1
0
mirror of https://github.com/immich-app/immich.git synced 2024-12-25 10:43:13 +02:00

feat(web): new fonts (#5165)

* feat(web): new fonts

* remove old fonts and make default font size larger

* fine tunning
This commit is contained in:
Alex 2023-11-19 21:06:16 -06:00 committed by GitHub
parent c1239a7337
commit f5d73b0499
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 15 additions and 6 deletions

View File

@ -23,11 +23,18 @@
--immich-dark-warning: 245 124 0;
}
}
@font-face {
font-family: 'Overpass';
src: url('$lib/assets/fonts/overpass/Overpass.ttf') format('truetype-variations');
font-weight: 1 999;
font-style: normal;
}
@font-face {
font-family: 'Work Sans';
src: url('$lib/assets/fonts/WorkSans-VariableFont_wght.ttf') format('truetype-variations');
font-family: 'Overpass Mono';
src: url('$lib/assets/fonts/overpass/OverpassMono.ttf') format('truetype-variations');
font-weight: 1 999;
font-style: monospace;
}
@font-face {
@ -36,7 +43,7 @@
}
:root {
font-family: 'Work Sans', sans-serif;
font-family: 'Overpass', sans-serif;
/* Used by layouts to ensure proper spacing between navbar and content */
--navbar-height: calc(theme(spacing.18) + 4px);
}
@ -44,6 +51,7 @@
html {
height: 100%;
width: 100%;
font-size: 17px;
}
html::-webkit-scrollbar {

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -134,7 +134,7 @@
{#if segment.hasLabel}
<div
aria-label={segment.timeGroup + ' ' + segment.count}
class="absolute right-0 bottom-0 z-10 pr-5 text-xs font-medium dark:text-immich-dark-fg font-mono"
class="absolute right-0 bottom-0 z-10 pr-5 text-xs dark:text-immich-dark-fg font-immich-mono font-semibold"
>
{segment.date.year}
</div>

View File

@ -118,7 +118,7 @@
<p class="text-immich-fg dark:text-immich-dark-fg">
{partner.user.name}
</p>
<p class="text-xs text-immich-fg/75 dark:text-immich-dark-fg/75">
<p class="text-sm text-immich-fg/75 dark:text-immich-dark-fg/75">
{partner.user.email}
</p>
</div>

View File

@ -37,7 +37,7 @@
$: {
if (innerWidth && screenSize) {
// Set the number of faces according to the screen size and the div size
MAX_ITEMS = screenSize < 768 ? Math.floor(innerWidth / 96) : Math.floor(innerWidth / 112);
MAX_ITEMS = screenSize < 768 ? Math.floor(innerWidth / 96) : Math.floor(innerWidth / 120);
}
}
</script>

View File

@ -25,6 +25,7 @@ module.exports = {
},
fontFamily: {
'immich-title': ['Snowburst One', 'cursive'],
'immich-mono': ['Overpass Mono', 'monospace'],
},
spacing: {
18: '4.5rem',