Mudanças entre as edições de "Widget:MainPageChangelog"
Ir para navegação
Ir para pesquisar
m |
m |
||
| Linha 22: | Linha 22: | ||
} | } | ||
.notice-content{ flex:1; display:flex; flex-direction:column; gap:0; position:relative; z-index:2; padding-right: | .notice-content{ flex:1; display:flex; flex-direction:column; gap:0; position:relative; z-index:2; padding-right:0; } | ||
.notice-title, .notice-title a{ | .notice-title, .notice-title a{ | ||
| Linha 37: | Linha 37: | ||
/* layout the text vertically and control spacing consistently */ | /* layout the text vertically and control spacing consistently */ | ||
/* header: inline row with optional inline icon, title and date */ | /* header: inline row with optional inline icon, title and date */ | ||
.notice-header{ display:flex; align-items:center; gap:8px; flex- | .notice-header{ display:flex; align-items:center; gap:8px; justify-content:space-between; } | ||
.notice-header-left{ display:flex; align-items:center; gap:8px; } | |||
.notice-header-right{ white-space:nowrap; } | |||
.notice-date{ font-size:.85em; color:#888; margin:0 0 0 8px; } | .notice-date{ font-size:.85em; color:#888; margin:0 0 0 8px; } | ||
Edição das 20h36min de 2 de setembro de 2025
<style>
.widget-changelog{
max-height: 280px;
overflow-y: auto;
padding-right: 5px;
box-sizing: border-box;
}
.notice-item{
display:flex;
align-items:flex-start;
position:relative; /* allow absolute-positioned icon */
gap:10px;
background:#fff;
border:1px solid #ddd; /* borda padrão */
border-radius:6px;
margin-bottom:10px;
padding:8px 10px;
box-sizing:border-box;
--notice-color: var(--notice-color, #f5b700);
border-left:5px solid var(--notice-color);
}
.notice-content{ flex:1; display:flex; flex-direction:column; gap:0; position:relative; z-index:2; padding-right:0; }
.notice-title, .notice-title a{
display:block;
font-size:1.05rem; /* slightly smaller */
font-weight:700;
color:#333;
text-decoration:none;
margin:0;
line-height:1.1;
}
.notice-title a:hover{ text-decoration: underline; }
/* layout the text vertically and control spacing consistently */
/* header: inline row with optional inline icon, title and date */
.notice-header{ display:flex; align-items:center; gap:8px; justify-content:space-between; }
.notice-header-left{ display:flex; align-items:center; gap:8px; }
.notice-header-right{ white-space:nowrap; }
.notice-date{ font-size:.85em; color:#888; margin:0 0 0 8px; }
.notice-desc{ color:#555; line-height:1.35; margin:2px 0 0 0 !important; display:block; }
/* icon: fixed size, responsive and separated from content */
.notice-icon{
width:32px;
height:32px;
object-fit:contain;
flex-shrink:0;
border-radius:4px;
background:transparent;
/* align icon visually with the top of the card/content */
margin-top:6px;
position:absolute;
right:8px;
bottom:8px;
opacity:0.28; /* increased opacity */
z-index:1; /* behind content */
}
/* overlay-specific class (visual only) */
.notice-icon--overlay{ pointer-events:none; }
/* inline icon: hidden on desktop, shown on small screens and participates in layout */
.notice-icon--inline{ display:none; width:20px; height:20px; margin-right:6px; position:static; opacity:0.9; }
/* mobile: show inline icon, hide overlay so it doesn't block layout */
@media (max-width:600px){
.notice-icon--inline{ display:inline-block; }
.notice-icon--overlay{ display:none !important; }
.notice-content{ padding-right:16px; }
}
/* ensure content sits above the icon and has space on the right */
</style>