tom/diana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Carpentry & Mounting h1: Georgia italic ampersand via styleAmp filter

Browse Source
This commit is contained in:
Tom Roth
2026-07-31 10:10:02 +02:00
parent 51d7221220
commit f60e66e671
3 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.eleventy.js
View File

@@ -14,6 +14,11 @@ module.exports = function (eleventyConfig) {
new Date().getFullYear() new Date().getFullYear()
); );
// Wrap & with a Georgia-italic span so headings use an elegant ampersand
eleventyConfig.addFilter("styleAmp", (str) =>
String(str).replace(/&amp;|&/g, '<span class="amp">&amp;</span>')
);
return { return {
templateFormats: ["njk", "html", "xml", "txt"], templateFormats: ["njk", "html", "xml", "txt"],
htmlTemplateEngine: "njk", htmlTemplateEngine: "njk",

2
src/_includes/layouts/service.njk
View File

@@ -31,7 +31,7 @@ layout: layouts/base.njk
</ol> </ol>
</nav> </nav>
<p class="section-eyebrow">{{ _eyebrow }}</p> <p class="section-eyebrow">{{ _eyebrow }}</p>
<h1 class="page-hero__title">{{ _title }}</h1> <h1 class="page-hero__title">{{ _title | styleAmp | safe }}</h1>
<p class="page-hero__lead">{{ _lead }}</p> <p class="page-hero__lead">{{ _lead }}</p>
<a href="{{ rootPath }}contact/index.html" class="btn btn--primary">Request a Quote</a> <a href="{{ rootPath }}contact/index.html" class="btn btn--primary">Request a Quote</a>
</div> </div>

11
src/css/main.css
View File

@@ -333,7 +333,11 @@ a {
} }
/* Georgia italic has a far more elegant ampersand than Fraunces at small sizes */ /* Georgia italic has a far more elegant ampersand than Fraunces at small sizes */
.nav__brand-amp { /* Shared elegant ampersand — applied via the styleAmp filter in headings
and directly in nav/footer brand markup */
.amp,
.nav__brand-amp,
.footer__brand-amp {
font-family: Georgia, 'Times New Roman', serif; font-family: Georgia, 'Times New Roman', serif;
font-style: italic; font-style: italic;
} }
@@ -1117,10 +1121,7 @@ a {
transition: color 0.2s ease; transition: color 0.2s ease;
} }
.footer__brand-amp { /* .footer__brand-amp covered by shared .amp rule in section 6 (Navigation) */
font-family: Georgia, 'Times New Roman', serif;
font-style: italic;
}
.footer__brand:hover .footer__brand-her, .footer__brand:hover .footer__brand-her,
.footer__brand:hover .footer__brand-tagline { .footer__brand:hover .footer__brand-tagline {