Template: Blog post/styles.css

Revision as of 20:34, 1 October 2025

/* Page container */ .blog-article { max-width: 920px; margin: 0 auto; padding: 0 1rem 2rem; }

/* Title */ .blog-h1 { font-size: 2.25rem; line-height: 1.2; margin: 0.5rem 0 0.25rem; font-weight: 700; }

/* Byline (date • author • optional translate link) */ .blog-byline { color: #616161; font-size: 0.95rem; margin-bottom: 1rem; } .blog-byline a { color: inherit; text-decoration: underline; }

/* Standfirst */ .blog-standfirst { font-size: 1.1rem; margin: 0.75rem 0 1.25rem; }

/* Hero image + caption */ .blog-hero { margin: 1rem 0 1rem; } .blog-hero-img { width: 100%; height: auto; border-radius: 8px; } .blog-hero-cap { text-align: center; color: #6f6f6f; font-size: 0.9rem; margin-top: 0.35rem; }

/* List rows */ .blogpost-row { display: grid; grid-template-columns: 120px 1fr; gap: 0.75rem; padding: 0.9rem 0; border-bottom: 1px solid #eee; } .blogpost-thumb { border-radius: 6px; overflow: hidden; } .blogpost-row-title { font-weight: 600; font-size: 1.05rem; } .blogpost-row-meta { color: #666; margin: 0.25rem 0 0.5rem; font-size: 0.92rem; } .blogpost-row-desc { color: #2f2f2f; }

@@ Line 1: / Line 1: @@
-.blogpost { margin: 0 0 1.5em; }
+/* Page container */
-.blogpost-banner { display: block; max-width: 100%; height: auto; margin: 0 0 0.75em; }
+.blog-article { max-width: 920px; margin: 0 auto; padding: 0 1rem 2rem; }
-.blogpost-title { margin: 0.2em 0 0.3em; font-weight: 600; }
-.blogpost-meta { color: #666; font-size: 92%; margin: 0 0 0.8em; }
+/* Title */
-.blogpost-desc { margin: 0.8em 0 1em; font-style: italic; }
+.blog-h1 { font-size: 2.25rem; line-height: 1.2; margin: 0.5rem 0 0.25rem; font-weight: 700; }
-.blogpost-keywords { margin: 0.6em 0 0; font-size: 92%; }
+/* Byline (date • author • optional translate link) */
+.blog-byline { color: #616161; font-size: 0.95rem; margin-bottom: 1rem; }
+.blog-byline a { color: inherit; text-decoration: underline; }
+/* Standfirst */
+.blog-standfirst { font-size: 1.1rem; margin: 0.75rem 0 1.25rem; }
+/* Hero image + caption */
+.blog-hero { margin: 1rem 0 1rem; }
+.blog-hero-img { width: 100%; height: auto; border-radius: 8px; }
+.blog-hero-cap { text-align: center; color: #6f6f6f; font-size: 0.9rem; margin-top: 0.35rem; }
+/* List rows */
+.blogpost-row { display: grid; grid-template-columns: 120px 1fr; gap: 0.75rem; padding: 0.9rem 0; border-bottom: 1px solid #eee; }
+.blogpost-thumb { border-radius: 6px; overflow: hidden; }
+.blogpost-row-title { font-weight: 600; font-size: 1.05rem; }
+.blogpost-row-meta { color: #666; margin: 0.25rem 0 0.5rem; font-size: 0.92rem; }
+.blogpost-row-desc { color: #2f2f2f; }