Theaninova/DeviceManager
1
0
Fork 0
mirror of https://github.com/CharaChorder/DeviceManager.git synced 2026-01-20 08:52:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

use local fonts

Browse Source
This commit is contained in:
Thea Schöbl
2023-07-06 14:01:56 +02:00
parent 0759b2e4ad
commit f1e15863ea
10 changed files with 148 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/Navigation.svelte
View File

@@ -75,6 +75,8 @@
border: none;
border-radius: 50%;
transition: all 250ms ease;
&.error {
color: var(--md-sys-color-on-error);
background: var(--md-sys-color-error);

33
src/lib/fonts/material-symbols-rounded.scss Normal file
View File

@@ -0,0 +1,33 @@
/* fallback */
@font-face {
font-family: "Material Symbols Rounded";
font-weight: 100 700;
font-style: normal;
src: url("@fontsource-variable/material-symbols-rounded/files/material-symbols-rounded-latin-full-normal.woff2")
format("woff2");
}
.icon {
user-select: none;
direction: ltr;
display: inline-block;
/* stylelint-disable-next-line */
font-family: "Material Symbols Rounded";
font-size: 24px;
font-feature-settings: "liga";
font-variation-settings: "FILL" var(--icon-fill, 0), "wght" var(--icon-weigth, 400), "GRAD"
var(--icon-grade, 0);
font-weight: normal;
font-style: normal;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
transition: font-variation-settings 250ms ease;
-moz-osx-font-smoothing: grayscale;
}

87
src/lib/fonts/noto-sans-mono.scss Normal file
View File

@@ -0,0 +1,87 @@
/* noto-sans-mono-cyrillic-ext-wght-normal */
@font-face {
font-family: "Noto Sans Mono";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-cyrillic-ext-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* noto-sans-mono-cyrillic-wght-normal */
@font-face {
font-family: "Noto Sans Mono";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-cyrillic-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* noto-sans-mono-greek-ext-wght-normal */
@font-face {
font-family: "Noto Sans Mono Variable";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-greek-ext-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+1F00-1FFF;
}
/* noto-sans-mono-greek-wght-normal */
@font-face {
font-family: "Noto Sans Mono";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-greek-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0370-03FF;
}
/* noto-sans-mono-vietnamese-wght-normal */
@font-face {
font-family: "Noto Sans Mono";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-vietnamese-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301,
U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* noto-sans-mono-latin-ext-wght-normal */
@font-face {
font-family: "Noto Sans Mono Variable";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-latin-ext-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020,
U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* noto-sans-mono-latin-wght-normal */
@font-face {
font-family: "Noto Sans Mono";
font-weight: 100 900;
font-style: normal;
font-display: swap;
font-stretch: 62.5% 100%;
src: url("@fontsource-variable/noto-sans-mono/files/noto-sans-mono-latin-wght-normal.woff2")
format("woff2-variations");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301,
U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
U+2215, U+FEFF, U+FFFD;
}

32
src/lib/style/fonts/material-symbols-rounded.scss
View File

@@ -1,32 +0,0 @@
/* fallback */
@font-face {
font-family: 'Material Symbols Rounded';
font-weight: 100 700;
font-style: normal;
src: url("https://fonts.gstatic.com/s/materialsymbolsrounded/v121/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2") format('woff2');
}
.icon {
user-select: none;
direction: ltr;
display: inline-block;
/* stylelint-disable-next-line */
font-family: 'Material Symbols Rounded';
font-size: 24px;
font-feature-settings: 'liga';
font-variation-settings: "FILL" var(--icon-fill, 0) "wght" var(--icon-weigth, 400) "GRAD"
var(--icon-grade, 0);
font-weight: normal;
font-style: normal;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
transition: all 250ms ease;
-moz-osx-font-smoothing: grayscale;
}

153
src/lib/style/fonts/noto-sans-mono.scss
View File

@@ -1,153 +0,0 @@
/* cyrillic-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCLwR26eg.woff2") format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCCwR26eg.woff2") format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCKwR26eg.woff2") format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCFwR26eg.woff2") format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCJwR26eg.woff2") format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCIwR26eg.woff2") format('woff2');
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 320;
font-style: normal;
font-display: swap;
font-stretch: 77.8%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCGwR0.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCLwR26eg.woff2") format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCCwR26eg.woff2") format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCKwR26eg.woff2") format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCFwR26eg.woff2") format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCJwR26eg.woff2") format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCIwR26eg.woff2") format('woff2');
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Noto Sans Mono';
font-weight: 400;
font-style: normal;
font-display: swap;
font-stretch: 100%;
src: url("https://fonts.gstatic.com/s/notosansmono/v27/BngRUXNETWXI6LwhGYvaxZikqbCGwR0.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

6
src/routes/+layout.svelte
View File

@@ -1,6 +1,6 @@
<script>
import "$lib/style/fonts/noto-sans-mono.scss"
import "$lib/style/fonts/material-symbols-rounded.scss"
import "$lib/fonts/noto-sans-mono.scss"
import "$lib/fonts/material-symbols-rounded.scss"
import {onMount} from "svelte"
import {applyTheme, argbFromHex, themeFromSourceColor} from "@material/material-color-utilities"
import Navigation from "$lib/components/Navigation.svelte"
@@ -87,7 +87,7 @@
h1 {
margin-block-start: 0;
font-size: 4rem;
font-weight: 900;
font-weight: 700;
color: var(--md-sys-color-secondary);
}
</style>

7
src/routes/config/+layout.svelte
View File

@@ -31,6 +31,9 @@
border-radius: 32px;
}
.icon {
}
a {
display: flex;
gap: 4px;
@@ -41,7 +44,7 @@
padding: 8px;
padding-inline: 16px;
font-weight: 800;
font-weight: 600;
color: var(--md-sys-color-on-surface-variant);
text-decoration: none;
@@ -51,6 +54,8 @@
}
a.active {
--icon-fill: 1;
color: var(--md-sys-color-on-primary);
background: var(--md-sys-color-primary);
}