fix: css on homepage

This commit is contained in:
Boofdev 2024-11-29 22:25:30 +01:00
parent 7e5d521b32
commit 1f55d71aa6
4 changed files with 50 additions and 87 deletions

View File

@ -15,6 +15,8 @@
"@sveltejs/adapter-auto": "^3.3.1",
"@sveltejs/kit": "^2.9.0",
"@sveltejs/vite-plugin-svelte": "^4.0.2",
"@tailwindcss/typography": "^0.5.15",
"@types/node": "^22.10.1",
"autoprefixer": "^10.4.20",
"prettier": "^3.4.1",
"prettier-plugin-svelte": "^3.3.2",
@ -28,7 +30,6 @@
"vite": "^5.4.11"
},
"dependencies": {
"@tailwindcss/typography": "^0.5.15",
"mode-watcher": "^0.5.0"
}
}

60
pnpm-lock.yaml generated
View File

@ -8,22 +8,25 @@ importers:
.:
dependencies:
'@tailwindcss/typography':
specifier: ^0.5.15
version: 0.5.15(tailwindcss@3.4.15)
mode-watcher:
specifier: ^0.5.0
version: 0.5.0(svelte@5.2.11)
devDependencies:
'@sveltejs/adapter-auto':
specifier: ^3.3.1
version: 3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11))
version: 3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))
'@sveltejs/kit':
specifier: ^2.9.0
version: 2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11)
version: 2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
'@sveltejs/vite-plugin-svelte':
specifier: ^4.0.2
version: 4.0.2(svelte@5.2.11)(vite@5.4.11)
version: 4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
'@tailwindcss/typography':
specifier: ^0.5.15
version: 0.5.15(tailwindcss@3.4.15)
'@types/node':
specifier: ^22.10.1
version: 22.10.1
autoprefixer:
specifier: ^10.4.20
version: 10.4.20(postcss@8.4.49)
@ -56,7 +59,7 @@ importers:
version: 5.7.2
vite:
specifier: ^5.4.11
version: 5.4.11
version: 5.4.11(@types/node@22.10.1)
packages:
@ -377,6 +380,9 @@ packages:
'@types/estree@1.0.6':
resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
'@types/node@22.10.1':
resolution: {integrity: sha512-qKgsUwfHZV2WCWLAnVP1JqnpE6Im6h3Y0+fYgMTasNQ7V++CBX5OT1as0g0f+OyubbFqhf6XVNIsmN4IIhEgGQ==}
acorn-typescript@1.4.13:
resolution: {integrity: sha512-xsc9Xv0xlVfwp2o7sQ+GCQ1PgbkdcpWdTzrwXxO3xDMTAywVS3oXVOcOHuRjAPkS4P9b+yc/qNF15460v+jp4Q==}
peerDependencies:
@ -997,6 +1003,9 @@ packages:
engines: {node: '>=14.17'}
hasBin: true
undici-types@6.20.0:
resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==}
update-browserslist-db@1.1.1:
resolution: {integrity: sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==}
hasBin: true
@ -1241,14 +1250,14 @@ snapshots:
'@rollup/rollup-win32-x64-msvc@4.27.4':
optional: true
'@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11))':
'@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))':
dependencies:
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11)
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
import-meta-resolve: 4.1.0
'@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11)':
'@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))':
dependencies:
'@sveltejs/vite-plugin-svelte': 4.0.2(svelte@5.2.11)(vite@5.4.11)
'@sveltejs/vite-plugin-svelte': 4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
'@types/cookie': 0.6.0
cookie: 0.6.0
devalue: 5.1.1
@ -1262,27 +1271,27 @@ snapshots:
sirv: 3.0.0
svelte: 5.2.11
tiny-glob: 0.2.9
vite: 5.4.11
vite: 5.4.11(@types/node@22.10.1)
'@sveltejs/vite-plugin-svelte-inspector@3.0.1(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11)':
'@sveltejs/vite-plugin-svelte-inspector@3.0.1(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))':
dependencies:
'@sveltejs/vite-plugin-svelte': 4.0.2(svelte@5.2.11)(vite@5.4.11)
'@sveltejs/vite-plugin-svelte': 4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
debug: 4.3.7
svelte: 5.2.11
vite: 5.4.11
vite: 5.4.11(@types/node@22.10.1)
transitivePeerDependencies:
- supports-color
'@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11)':
'@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))':
dependencies:
'@sveltejs/vite-plugin-svelte-inspector': 3.0.1(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11))(svelte@5.2.11)(vite@5.4.11)
'@sveltejs/vite-plugin-svelte-inspector': 3.0.1(@sveltejs/vite-plugin-svelte@4.0.2(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1)))(svelte@5.2.11)(vite@5.4.11(@types/node@22.10.1))
debug: 4.3.7
deepmerge: 4.3.1
kleur: 4.1.5
magic-string: 0.30.14
svelte: 5.2.11
vite: 5.4.11
vitefu: 1.0.4(vite@5.4.11)
vite: 5.4.11(@types/node@22.10.1)
vitefu: 1.0.4(vite@5.4.11(@types/node@22.10.1))
transitivePeerDependencies:
- supports-color
@ -1298,6 +1307,10 @@ snapshots:
'@types/estree@1.0.6': {}
'@types/node@22.10.1':
dependencies:
undici-types: 6.20.0
acorn-typescript@1.4.13(acorn@8.14.0):
dependencies:
acorn: 8.14.0
@ -1862,6 +1875,8 @@ snapshots:
typescript@5.7.2: {}
undici-types@6.20.0: {}
update-browserslist-db@1.1.1(browserslist@4.24.2):
dependencies:
browserslist: 4.24.2
@ -1870,17 +1885,18 @@ snapshots:
util-deprecate@1.0.2: {}
vite@5.4.11:
vite@5.4.11(@types/node@22.10.1):
dependencies:
esbuild: 0.21.5
postcss: 8.4.49
rollup: 4.27.4
optionalDependencies:
'@types/node': 22.10.1
fsevents: 2.3.3
vitefu@1.0.4(vite@5.4.11):
vitefu@1.0.4(vite@5.4.11(@types/node@22.10.1)):
optionalDependencies:
vite: 5.4.11
vite: 5.4.11(@types/node@22.10.1)
which@2.0.2:
dependencies:

View File

@ -14,7 +14,7 @@
<ul>
{#each hostlist as host}
<li class="self-center">
<a href={host.url}>{host.name}</a>
<a href={host.url}>{host.name}</a>
<p>{host.description}</p>
</li>
{/each}

View File

@ -1,64 +1,10 @@
import { fontFamily } from "tailwindcss/defaultTheme";
import type { Config } from "tailwindcss";
import type { Config } from 'tailwindcss'
const config: Config = {
darkMode: ["class"],
content: ["./src/**/*.{html,js,svelte,ts}"],
safelist: ["dark"],
theme: {
container: {
center: true,
padding: "2rem",
screens: {
"2xl": "1400px"
}
},
extend: {
colors: {
border: "hsl(var(--border) / <alpha-value>)",
input: "hsl(var(--input) / <alpha-value>)",
ring: "hsl(var(--ring) / <alpha-value>)",
background: "hsl(var(--background) / <alpha-value>)",
foreground: "hsl(var(--foreground) / <alpha-value>)",
primary: {
DEFAULT: "hsl(var(--primary) / <alpha-value>)",
foreground: "hsl(var(--primary-foreground) / <alpha-value>)"
},
secondary: {
DEFAULT: "hsl(var(--secondary) / <alpha-value>)",
foreground: "hsl(var(--secondary-foreground) / <alpha-value>)"
},
destructive: {
DEFAULT: "hsl(var(--destructive) / <alpha-value>)",
foreground: "hsl(var(--destructive-foreground) / <alpha-value>)"
},
muted: {
DEFAULT: "hsl(var(--muted) / <alpha-value>)",
foreground: "hsl(var(--muted-foreground) / <alpha-value>)"
},
accent: {
DEFAULT: "hsl(var(--accent) / <alpha-value>)",
foreground: "hsl(var(--accent-foreground) / <alpha-value>)"
},
popover: {
DEFAULT: "hsl(var(--popover) / <alpha-value>)",
foreground: "hsl(var(--popover-foreground) / <alpha-value>)"
},
card: {
DEFAULT: "hsl(var(--card) / <alpha-value>)",
foreground: "hsl(var(--card-foreground) / <alpha-value>)"
}
},
borderRadius: {
lg: "var(--radius)",
md: "calc(var(--radius) - 2px)",
sm: "calc(var(--radius) - 4px)"
},
fontFamily: {
sans: [...fontFamily.sans]
}
}
},
};
export default config;
export default {
// darkMode: "selector",
darkMode: ['variant', ['&:where(.dark, .dark *)', '&:where(:global(.dark), :global(.dark) *)']], // Fix for dark mode after upgrade to svelte 5
content: ["./src/**/*.{html,js,svelte,ts}"],
plugins: [
require('@tailwindcss/typography'),
]
} satisfies Config