Clean up font usage

Remove unused fonts. Add woff2 types for smaller downloads.
Offer woff2, woff, truetype/opentype versions of the font files.
This commit is contained in:
2025-09-04 21:37:36 -04:00
parent edebce3fd3
commit 454d548ce7
12 changed files with 124 additions and 27362 deletions

View File

@@ -13,23 +13,22 @@ https://creativecommons.org/publicdomain/
* - CSS-Tricks: Linearly Scale font-size with CSS clamp() Based on the Viewport
* -- https://css-tricks.com/linearly-scale-font-size-with-css-clamp-based-on-the-viewport/
*/
@font-face {
font-family: "GNUTypewriter";
src:
local("GNUTypewriter"),
url("/css/gnutypewriter/gtw.woff") format("woff");
}
@font-face {
font-family: "BebasNeue";
src:
local("BebasNeue"),
url("/css/bebas/BebasNeue.woff") format("woff");
local("BEBAS NEUE"),
url("/css/bebas/BebasNeue.woff2") format("woff2"),
url("/css/bebas/BebasNeue.woff") format("woff"),
url("/css/bebas/BebasNeue.otf") format("opentype");
}
@font-face {
font-family: "PatrickHand";
src:
local("PatrickHand"),
url("/css/patrickhand/PatrickHand-Regular.ttf") format("truetype");
local("Patrick Hand"),
url("/css/patrickhand/PatrickHand-Regular.woff2") format("woff2"),
url("/css/patrickhand/PatrickHand-Regular.woff") format("woff"),
url("/css/patrickhand/PatrickHand-Regular.ttf") format("truetype");
}
:root {
--background-primary: #fffff7/*#fafafa#fbfbee #dfdfdf */;
@@ -45,13 +44,23 @@ https://creativecommons.org/publicdomain/
--link-secondary-hover: #f9e9c2;
--link-title-color: #00003e;
--font-family-hpr: Verdana, Arial, Helvetica, sans-serif; /* 1em/1.5 OpenDyslexic, */;
--font-size-default: clamp(1rem, 15px + 0.3vw, 1.07rem);
--logo-font-family: var(--font-family-hpr);
--logo-font-weight: bolder;
--logo-font-size: 7.5rem;
--logo-letter-spacing: -0.65rem;
--logo-line-height: 0.75;
--logo-margin: 0 0 0.25rem 0;
--tagline-font-family:"BebasNeue", sans-serif;
--lane-button-font-family: "PatrickHand", var(--font-family-hpr);
--lane-button-border: #80b4c0;
--input-border-primary: #4d4d4d;
--link-spacing-horizontal: clamp(0.5rem, -0.25rem + 3vw, 2.5rem);
--font-family-hpr: Verdana, Arial, Helvetica, sans-serif; /* 1em/1.5 OpenDyslexic, */;
--font-size-default: clamp(1rem, 15px + 0.3vw, 1.07rem);
--shadow-main-header-color: hsl(190deg 48% 49% / 0.2);
--shadow-secondary-color: hsl(0, 0%, 30.2%);
@@ -383,7 +392,7 @@ a.lane-button {
}
a.lane-button p {
font-family: 'PatrickHand', sans-serif;
font-family: var(--lane-button-font-family);
text-transform: lowercase;
font-size: 1.4em;
mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1)), url("../images/charcoal.png");
@@ -468,10 +477,12 @@ section:nth-of-type(even) .lane a:nth-of-type(4) {
color: var(--link-primary-hover);
}
#title #site_acronym {
font-size: 7.5rem;
letter-spacing: -0.65rem;
line-height: 0.75;
margin-bottom: 0.25rem;
font-family: var(--logo-font-family);
font-size: var(--logo-font-size);
font-weight: var(--logo-font-weight);
letter-spacing: var(--logo-letter-spacing);
line-height: var(--logo-line-height);
margin: var(--logo-margin);
color: transparent;
}
#title #site_acronym a {
@@ -488,13 +499,13 @@ section:nth-of-type(even) .lane a:nth-of-type(4) {
#tag_line #tag1,
#tag_line #tag2 {
text-transform: uppercase;
font-family: "BebasNeue", sans-serif;
font-family: var(--tagline-font-family);
font-size: clamp(1.03rem, -0.25rem + 3vw, var(--default-header-4-font-size));
font-weight: var(--default-header-x-font-weight);
letter-spacing: 0.05rem;
}
#tag_line #tag1 {
font-size: clamp(2.1rem, calc(100vw - 360px + 2.1rem), 2.3rem);
font-size: clamp(2.1rem, calc(100vw - 360px + 1rem), 2.3rem);;
}
#tag_line #tag3 {
text-align: center;
@@ -767,4 +778,4 @@ fieldset > table td input[type="radio"] {
flex: 1 1 30%;
max-width: 30%;
}
}
}