Madeorsk/rudeshark.net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 💄 Use Atkinson Hyperlegible as default font

Browse Source
This commit is contained in:
ThatOneCalculator 2023-09-26 14:23:38 -07:00
parent bae6fa18df
commit 01dd71c4d3
No known key found for this signature in database
GPG Key ID: 8703CACD01000000
6 changed files with 54 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
packages/backend/assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-700.woff2 Normal file
View File

Binary file not shown.

BIN
packages/backend/assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-700italic.woff2 Normal file
View File

Binary file not shown.

BIN
packages/backend/assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-italic.woff2 Normal file
View File

Binary file not shown.

BIN
packages/backend/assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-regular.woff2 Normal file
View File

Binary file not shown.

15
packages/backend/src/server/web/style.css
View File

@ -1,7 +1,18 @@
/* atkinson-hyperlegible-regular - latin_latin-ext */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Atkinson Hyperlegible";
font-style: normal;
font-weight: 400;
src: url("/static-assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-regular.woff2")
format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
html { html {
background-color: var(--bg); background-color: var(--bg);
color: var(--fg); color: var(--fg);
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
html { html {
--bg: rgb(17, 17, 27); --bg: rgb(17, 17, 27);
@ -104,7 +115,7 @@ html {
} }
} }
@media(prefers-reduced-motion) { @media (prefers-reduced-motion) {
#splashSpinner { #splashSpinner {
display: block; display: block;
} }
@ -122,5 +133,5 @@ html {
height: 0; height: 0;
text-align: center; text-align: center;
padding-top: 100px; padding-top: 100px;
font-family: sans-serif; font-family: "Atkinson Hyperlegible", sans-serif;
} }

44
packages/client/src/style.scss
View File

@ -25,6 +25,43 @@
//--ad: rgb(255 169 0 / 10%); //--ad: rgb(255 169 0 / 10%);
} }
/* atkinson-hyperlegible-regular - latin_latin-ext */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Atkinson Hyperlegible";
font-style: normal;
font-weight: 400;
src: url("/static-assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-regular.woff2")
format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* atkinson-hyperlegible-italic - latin_latin-ext */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Atkinson Hyperlegible";
font-style: italic;
font-weight: 400;
src: url("/static-assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-italic.woff2")
format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* atkinson-hyperlegible-700 - latin_latin-ext */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Atkinson Hyperlegible";
font-style: normal;
font-weight: 700;
src: url("/static-assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-700.woff2")
format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* atkinson-hyperlegible-700italic - latin_latin-ext */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Atkinson Hyperlegible";
font-style: italic;
font-weight: 700;
src: url("/static-assets/fonts/atkinson-hyperlegible-v11-latin_latin-ext-700italic.woff2")
format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
::selection { ::selection {
color: #fff; color: #fff;
background-color: var(--accent); background-color: var(--accent);
@ -39,7 +76,8 @@ html {
accent-color: var(--accent); accent-color: var(--accent);
overflow: auto; overflow: auto;
overflow-wrap: break-word; overflow-wrap: break-word;
font-family: Roboto, HelveticaNeue, Arial, sans-serif; font-family: "Atkinson Hyperlegible", Roboto, HelveticaNeue, Arial,
sans-serif;
font-size: 14px; font-size: 14px;
line-height: 1.6; line-height: 1.6;
text-size-adjust: 100%; text-size-adjust: 100%;
@ -50,8 +88,8 @@ html {
-webkit-text-size-adjust: none; -webkit-text-size-adjust: none;
&.useCJKFont { &.useCJKFont {
font-family: "Hiragino Maru Gothic Pro", "BIZ UDGothic", Roboto, font-family: "Hiragino Maru Gothic Pro", "BIZ UDGothic",
HelveticaNeue, Arial, sans-serif; "Atkinson Hyperlegible", Roboto, HelveticaNeue, Arial, sans-serif;
} }
&.useSystemFont { &.useSystemFont {