diff --git a/colors.cjs b/colors.cjs index f178df3f3..c6092b0c8 100644 --- a/colors.cjs +++ b/colors.cjs @@ -1,15 +1,12 @@ const colors = { primary: { DEFAULT: '#18181b' }, // gray-900 secondary: '#64748b', // blue-gray-500 - primaryText: '#141414', - spaceGray: { DEFAULT: '#141414' }, white: '#ffffff', offWhite: '#F8F8F7', danger: '#b91c1c', // red-700 success: '#bbf7d0', // green-200 black: '#000000', lightBlue: '#DFFBFF', - lightPurple: '#DDD6FE', blue: { 50: '#eff6ff', 100: '#dbeafe', diff --git a/package.json b/package.json index 819bd39a1..eb93941cc 100644 --- a/package.json +++ b/package.json @@ -78,6 +78,9 @@ "@codemirror/state": "^6.2.0", "@codemirror/view": "^6.7.2", "@crownframework/svelte-error-boundary": "^1.0.3", + "@fontsource-variable/inter": "^5.0.8", + "@fontsource/noto-sans-mono": "^5.0.9", + "@fontsource/poppins": "^5.0.8", "@lezer/highlight": "^1.1.3", "@sveltejs/package": "^2.0.2", "@sveltejs/svelte-virtual-list": "^3.0.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1a96b9a0e..6b19e4617 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -26,6 +26,15 @@ dependencies: '@crownframework/svelte-error-boundary': specifier: ^1.0.3 version: 1.0.3 + '@fontsource-variable/inter': + specifier: ^5.0.8 + version: 5.0.8 + '@fontsource/noto-sans-mono': + specifier: ^5.0.9 + version: 5.0.9 + '@fontsource/poppins': + specifier: ^5.0.8 + version: 5.0.8 '@lezer/highlight': specifier: ^1.1.3 version: 1.1.3 @@ -1320,6 +1329,18 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true + /@fontsource-variable/inter@5.0.8: + resolution: {integrity: sha512-WkYfFNccmEIeL2fNg0mYeLWqOoB7xD8MFxFRc4IwbSP2o8ZaBt36v5aW4by4MyrgGRMNk7uNi5LbvYKq6clPjw==} + dev: false + + /@fontsource/noto-sans-mono@5.0.9: + resolution: {integrity: sha512-kEnRN/Vs7TgWkY+Y5U36b2NZOYITWEY1T6LYkjFopCA2eaUWY4DDO7UOov55VE/PHDZH8KZZIOoEmBiM4Nv7Kw==} + dev: false + + /@fontsource/poppins@5.0.8: + resolution: {integrity: sha512-P8owfYWluoUY5Nyzk4gT/L6LmLmseP6ezFWhj6VBUa5pRIdnCvNJpoQ6i/vhekjtJOfqX6nKlB+LCttoUl2GQQ==} + dev: false + /@grpc/grpc-js@1.7.3: resolution: {integrity: sha512-H9l79u4kJ2PVSxUNA08HMYAnUBLj9v6KjYQ7SQ71hOZcEXhShE/y5iQCesP8+6/Ik/7i2O0a10bPquIcYfufog==} engines: {node: ^8.13.0 || >=10.10.0} diff --git a/src/app.css b/src/app.css index d1016fc27..43bd21f67 100644 --- a/src/app.css +++ b/src/app.css @@ -1,120 +1,36 @@ +@import '@fontsource-variable/inter'; +@import '@fontsource/poppins'; +@import '@fontsource/noto-sans-mono'; + @import 'tailwindcss/base'; @import 'tailwindcss/components'; @import 'tailwindcss/utilities'; @layer base { - @font-face { - font-family: 'Inter'; - src: local('Inter'), local('inter'), - url('/src/lib/vendor/css/fonts/Inter/Inter-Light.ttf'); - font-style: normal; - font-weight: 300; - font-display: swap; - } - - @font-face { - font-family: 'Inter'; - src: local('Inter'), local('inter'), - url('/src/lib/vendor/css/fonts/Inter/Inter-Regular.ttf'); - font-style: normal; - font-weight: 400; - font-display: swap; - } - - @font-face { - font-family: 'Inter'; - src: local('Inter'), local('inter'), - url('/src/lib/vendor/css/fonts/Inter/Inter-Medium.ttf'); - font-style: normal; - font-weight: 500; - font-display: swap; - } - - @font-face { - font-family: 'Inter'; - src: local('Inter'), local('inter'), - url('/src/lib/vendor/css/fonts/Inter/Inter-SemiBold.ttf'); - font-style: normal; - font-weight: 600; - font-display: swap; - } - - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Light.ttf'); - font-style: normal; - font-weight: 300; - font-display: swap; + *, + html, + body { + box-sizing: border-box; } - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Regular.ttf'); - font-style: normal; - font-weight: 400; - font-display: swap; + body { + font-family: theme('fontFamily.primary'); + position: relative; + overscroll-behavior: none; } - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Medium.ttf'); - font-style: normal; - font-weight: 500; - font-display: swap; + h1, + h2, + h3, + h4, + h5, + h6, + titles, + labels { + font-family: theme('fontFamily.secondary'); } - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-SemiBold.ttf'); - font-style: normal; - font-weight: 600; - font-display: swap; + input[type='search']::-webkit-search-cancel-button { + display: none; } - - @font-face { - font-family: 'Noto Sans Mono'; - src: local('Noto Sans Mono'), local('noto sans mono'), - url('/src/lib/vendor/css/fonts/NotoSansMono/NotoSansMono-VariableFont_wdth\,wght.ttf'); - font-display: swap; - } -} - -*, -html, -body { - box-sizing: border-box; -} - -body { - font-family: Inter, sans-serif; - position: relative; - overscroll-behavior: none; -} - -h1, -h2, -h3, -h4, -h5, -h6, -titles, -labels { - font-family: Poppins, sans-serif; -} - -.hljs { - max-height: 25em; - overflow-y: scroll; -} - -.noto { - font-family: 'Noto Sans Mono', monospace; -} - -input[type='search']::-webkit-search-cancel-button { - display: none; } diff --git a/src/histoire.css b/src/histoire.css index 651e8f54f..afb1e3a69 100644 --- a/src/histoire.css +++ b/src/histoire.css @@ -4,48 +4,3 @@ @tailwind base; @tailwind components; @tailwind utilities; - -@layer base { - @font-face { - font-family: 'Inter'; - src: local('Inter'), local('inter'), - url('/src/lib/vendor/css/fonts/Inter/Inter-VariableFont_slnt\,wght.ttf'); - font-display: swap; - } - - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Light.ttf'); - font-style: normal; - font-weight: 300; - font-display: swap; - } - - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Regular.ttf'); - font-style: normal; - font-weight: 400; - font-display: swap; - } - - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-Medium.ttf'); - font-style: medium; - font-weight: 500; - font-display: swap; - } - - @font-face { - font-family: 'Poppins'; - src: local('Poppins'), local('poppins'), - url('/src/lib/vendor/css/fonts/Poppins/Poppins-SemiBold.ttf'); - font-style: medium; - font-weight: 600; - font-display: swap; - } -} diff --git a/src/lib/components/workers-list.svelte b/src/lib/components/workers-list.svelte index c9cf63369..ed9e298e6 100644 --- a/src/lib/components/workers-list.svelte +++ b/src/lib/components/workers-list.svelte @@ -63,7 +63,7 @@
+
{#if defaultVersion && buildId}