Mudanças entre as edições de "Widget:MainPageChangelog"
Ir para navegação
Ir para pesquisar
m |
m |
||
| Linha 9: | Linha 9: | ||
.notice-item{ | .notice-item{ | ||
display:flex; | display:flex; | ||
align-items:flex-start; | |||
position:relative; /* allow absolute-positioned icon */ | |||
gap:10px; | gap:10px; | ||
background:#fff; | background:#fff; | ||
| Linha 21: | Linha 22: | ||
} | } | ||
.notice-content{ flex:1; } | .notice-content{ flex:1; display:flex; flex-direction:column; gap:0; position:relative; z-index:2; padding-right:44px; } | ||
.notice-title, .notice-title a{ | .notice-title, .notice-title a{ | ||
| Linha 35: | Linha 36: | ||
/* layout the text vertically and control spacing consistently */ | /* layout the text vertically and control spacing consistently */ | ||
/* header row: title left, date right */ | /* header row: title left, date right */ | ||
.notice-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; } | .notice-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; } | ||
| Linha 43: | Linha 42: | ||
.notice-date{ font-size:.85em; color:#888; margin:0; } | .notice-date{ font-size:.85em; color:#888; margin:0; } | ||
.notice-desc{ color:#555; line-height:1.35; margin:2px 0 0 0; } | .notice-desc{ color:#555; line-height:1.35; margin:2px 0 0 0 !important; display:block; } | ||
/* icon: fixed size, responsive and separated from content */ | /* icon: fixed size, responsive and separated from content */ | ||
.notice-icon{ | .notice-icon{ | ||
| Linha 54: | Linha 53: | ||
/* align icon visually with the top of the card/content */ | /* align icon visually with the top of the card/content */ | ||
margin-top:6px; | margin-top:6px; | ||
position:absolute; | |||
right:8px; | |||
bottom:8px; | |||
opacity:0.18; | |||
z-index:1; /* behind content */ | |||
} | } | ||
/* ensure content sits above the icon and has space on the right */ | |||
</style> | </style> | ||
Edição das 20h23min 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:44px; }
.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 row: title left, date right */
.notice-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.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; }
.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.18;
z-index:1; /* behind content */
}
/* ensure content sits above the icon and has space on the right */
</style>