Template: Blog post/styles.css

No edit summary
No edit summary
Line 1: Line 1:
/* Title area (skin heading is the H1) */
/* Title area (skin heading is the H1) */
.firstHeading { font-size: 2.4rem; line-height: 1.15; font-weight: 800; margin-bottom: 0.5rem; }
.firstHeading {  
  font-size: 2.4rem;  
  line-height: 1.15;  
  font-weight: 800;  
  margin-bottom: 0.2rem;   /* smaller gap below title */
}


/* Byline */
/* Byline */
.blog-byline { color: #616161; font-size: 0.98rem; margin-bottom: 1.1rem; }
.blog-byline {  
.blog-byline .dot { padding: 0 0.35rem; }
  color: #616161;  
  font-size: 0.98rem;  
  margin-top: 0;           /* remove extra space above */
  margin-bottom: 1rem;  
}
.blog-byline a { color: inherit; text-decoration: underline; }
.blog-byline a { color: inherit; text-decoration: underline; }


/* Standfirst (intro paragraph above the body text) */
/* Hero image */
.blog-standfirst { font-size: 1.1rem; line-height: 1.6; margin: 0.75rem 0 1.25rem; }
.blog-hero {  
 
  margin: 1rem auto 0.75rem;  
/* Hero image — make it fill the content width */
  text-align: center;      /* center the image container */
.blog-hero { margin: 1rem 0 0.75rem; }
}
.blog-hero-img { display: block; width: 100% !important; height: auto !important; border-radius: 8px; }
.blog-hero-img {  
.blog-hero-cap { text-align: center; color: #6f6f6f; font-size: 0.92rem; margin-top: 0.45rem; }
  display: block;  
 
  margin: 0 auto;          /* center the image itself */
/* Page container */
  max-width: 100%;  
.blog-article { max-width: 920px; margin: 0 auto; padding: 0 1rem 2rem; }
  height: auto;  
 
  border-radius: 8px;  
/* List rows for blog index */
}
.blogpost-row { display: grid; grid-template-columns: 120px 1fr; gap: 0.75rem; padding: 0.9rem 0; border-bottom: 1px solid #eee; }
.blog-hero-cap {  
.blogpost-thumb { border-radius: 6px; overflow: hidden; }
  text-align: center;  
.blogpost-row-title { font-weight: 600; font-size: 1.05rem; }
  color: #6f6f6f;  
.blogpost-row-meta { color: #666; margin: 0.25rem 0 0.5rem; font-size: 0.92rem; }
  font-size: 0.92rem;  
.blogpost-row-desc { color: #2f2f2f; }
  margin-top: 0.45rem;  
  font-style: italic;  
}

Revision as of 21:12, 1 October 2025

/* Title area (skin heading is the H1) */
.firstHeading { 
  font-size: 2.4rem; 
  line-height: 1.15; 
  font-weight: 800; 
  margin-bottom: 0.2rem;   /* smaller gap below title */
}

/* Byline */
.blog-byline { 
  color: #616161; 
  font-size: 0.98rem; 
  margin-top: 0;           /* remove extra space above */
  margin-bottom: 1rem; 
}
.blog-byline a { color: inherit; text-decoration: underline; }

/* Hero image */
.blog-hero { 
  margin: 1rem auto 0.75rem; 
  text-align: center;      /* center the image container */
}
.blog-hero-img { 
  display: block; 
  margin: 0 auto;          /* center the image itself */
  max-width: 100%; 
  height: auto; 
  border-radius: 8px; 
}
.blog-hero-cap { 
  text-align: center; 
  color: #6f6f6f; 
  font-size: 0.92rem; 
  margin-top: 0.45rem; 
  font-style: italic; 
}
Discuss this page