KevinMidboe/patlite-tower-lights-controller
1
0
Fork 0
mirror of https://github.com/KevinMidboe/patlite-tower-lights-controller.git synced 2025-10-29 17:50:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

woff2 format, preload font & update repo in env.example

Browse Source
This commit is contained in:
Kevin
2025-04-20 00:52:16 +02:00
parent 6d124bd1f2
commit 73e85c6a7b
5 changed files with 23 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/.env.example
View File

@@ -1,4 +1,4 @@
VITE_APP_TITLE=Patlite Status Light Controller VITE_APP_TITLE=Patlite Status Light Controller
VITE_DEVICE_URL=http://localhost:5000 VITE_DEVICE_URL=http://localhost:5000
VITE_DEVICE_PATH=/api/ VITE_DEVICE_PATH=/api/
VITE_GITHUB_SOURCE=https://github.com/kevinmidboe/patlite-controller VITE_GITHUB_SOURCE=https://github.com/kevinmidboe/patlite-tower-lights-controller

3
frontend/index.html
View File

@@ -5,7 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Svelte App</title> <title>Svelte App</title>
<link rel="stylesheet" href="./style.scss" /> <link rel="preload" href="/fonts/IBMPlexSerif-SemiBoldItalic.woff2" as="font" type="font/woff2" crossorigin="anonymous">
<link rel="stylesheet" href="./styles.css" />
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

BIN
frontend/public/fonts/IBMPlexSerif-SemiBoldItalic.woff2 Normal file
View File

Binary file not shown.

29
frontend/public/style.scss → frontend/public/styles.css
View File

@@ -1,9 +1,8 @@
@font-face { @font-face {
font-family: 'ibm-plex'; font-family: ibm-plex;
src: url('./fonts/IBMPlexSerif-SemiBoldItalic.ttf') format('truetype'); src: url('/fonts/IBMPlexSerif-SemiBoldItalic.woff2') format('woff2');
font-weight: 500; font-weight: 500;
font-style: italic; font-style: italic;
font-display: swap;
} }
body { body {
@@ -31,8 +30,10 @@ body {
touch-action: manipulation; touch-action: manipulation;
margin: 2rem; margin: 2rem;
margin-bottom: 4rem; margin-bottom: 4rem;
}
@media screen and (max-width: 750px) { @media screen and (max-width: 750px) {
.container {
min-height: 100vh; min-height: 100vh;
margin: 0; margin: 0;
} }
@@ -46,11 +47,12 @@ h1 {
color: #333; color: #333;
margin-top: 0; margin-top: 0;
font-size: 4rem; font-size: 4rem;
font-family: 'ibm-plex'; font-family: ibm-plex;
font-style: italic;
text-transform: uppercase; text-transform: uppercase;
} }
body > div#app > footer { main ~ footer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
@@ -58,10 +60,13 @@ body > div#app > footer {
width: 100%; width: 100%;
display: grid; display: grid;
place-items: center; place-items: center;
a {
display: inline-block;
vertical-align: middle;
height: 1.5rem;
}
} }
main ~ footer a {
display: inline-block;
vertical-align: middle;
height: 1.6rem;
width: 1.5rem;
}

3
frontend/src/components/Tools.svelte
View File

@@ -150,10 +150,12 @@
-webkit-user-select: none; -webkit-user-select: none;
user-select: none; user-select: none;
/*
&::-webkit-details-marker, &::-webkit-details-marker,
&::marker { &::marker {
display: none; display: none;
} }
*/
label, label,
p { p {
@@ -173,6 +175,7 @@
float: right; float: right;
text-align: right; text-align: right;
border-radius: 0.5rem; border-radius: 0.5rem;
border: none;
} }
} }
} }