Template: Blog post row/styles.css
No edit summary |
No edit summary |
||
| Line 32: | Line 32: | ||
/* Body */ | /* Body */ | ||
.blogpost-row-body { min-width: 0; } | .blogpost-row-body { min-width: 0; } | ||
.blogpost-row-title { font-weight: 600; font-size: 1. | .blogpost-row-title { font-weight: 600; font-size: 1.5rem; margin-bottom: 0.25rem; } | ||
.blogpost-row-meta { color: #666; margin: 0.15rem 0 0.45rem; font-size: 0.92rem; } | .blogpost-row-meta { color: #666; margin: 0.15rem 0 0.45rem; font-size: 0.92rem; } | ||
.blogpost-row-desc { color: #2f2f2f; } | .blogpost-row-desc { color: #2f2f2f; font-size: 1.05rem; font-style: italic; } | ||
Latest revision as of 16:40, 3 October 2025
/* Container */
.blogpost-row {
display: grid;
grid-template-columns: 200px 1fr;
gap: 0.75rem;
padding: 0.9rem 0;
border-bottom: 1px solid #eee;
}
/* Thumbnail area */
.blogpost-row-thumb { width: 200px; height: 200px; overflow: hidden; border-radius: 6px; }
/* MediaWiki wraps the image; make wrappers fill and crop nicely */
.blogpost-row-thumb a.image,
.blogpost-row-thumb span.image {
display: block;
width: 200px;
height: 200px;
}
.blogpost-row-thumb img.mw-file-element {
display: block;
width: 100% !important;
height: 100% !important;
object-fit: cover; /* crop while preserving aspect */
object-position: center;
border-radius: 6px;
margin: 0;
padding: 0;
}
/* Body */
.blogpost-row-body { min-width: 0; }
.blogpost-row-title { font-weight: 600; font-size: 1.5rem; margin-bottom: 0.25rem; }
.blogpost-row-meta { color: #666; margin: 0.15rem 0 0.45rem; font-size: 0.92rem; }
.blogpost-row-desc { color: #2f2f2f; font-size: 1.05rem; font-style: italic; }