LukeParke/sveltekit-extension-template
1
0
Fork 0
mirror of https://github.com/LukeHagar/sveltekit-extension-template.git synced 2025-12-06 04:21:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated Deps, Skeleton V-mig

Browse Source
This commit is contained in:
Luke Hagar
2023-10-17 14:04:43 -05:00
parent 97393a8887
commit d3fedec2b9
5 changed files with 55 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
package.json
View File

@@ -13,31 +13,33 @@
"format": "prettier --plugin-search-dir . --write ." "format": "prettier --plugin-search-dir . --write ."
}, },
"devDependencies": { "devDependencies": {
"@floating-ui/dom": "^1.2.8", "@floating-ui/dom": "^1.5.3",
"@skeletonlabs/skeleton": "^1.5.1", "@skeletonlabs/skeleton": "^2.3.0",
"@sveltejs/adapter-auto": "^2.0.0", "@skeletonlabs/tw-plugin": "^0.2.2",
"@sveltejs/kit": "^1.5.0", "@sveltejs/adapter-auto": "^2.1.0",
"@tailwindcss/forms": "^0.5.3", "@sveltejs/kit": "^1.25.2",
"@tailwindcss/typography": "^0.5.9", "@tailwindcss/forms": "^0.5.6",
"@types/chrome": "^0.0.236", "@tailwindcss/typography": "^0.5.10",
"@typescript-eslint/eslint-plugin": "^5.45.0", "@types/chrome": "^0.0.247",
"@typescript-eslint/parser": "^5.45.0", "@typescript-eslint/eslint-plugin": "^6.8.0",
"autoprefixer": "^10.4.14", "@typescript-eslint/parser": "^6.8.0",
"eslint": "^8.28.0", "autoprefixer": "^10.4.16",
"eslint-config-prettier": "^8.5.0", "eslint": "^8.51.0",
"eslint-plugin-svelte": "^2.26.0", "eslint-config-prettier": "^9.0.0",
"highlight.js": "^11.8.0", "eslint-plugin-svelte": "^2.34.0",
"postcss": "^8.4.23", "highlight.js": "^11.9.0",
"prettier": "^2.8.0", "postcss": "^8.4.31",
"prettier-plugin-svelte": "^2.8.1", "prettier": "^3.0.3",
"svelte": "^3.54.0", "prettier-plugin-svelte": "^3.0.3",
"svelte-check": "^3.0.1", "svelte": "^4.2.1",
"svelte-check": "^3.5.2",
"sveltekit-adapter-chrome-extension": "^2.0.0", "sveltekit-adapter-chrome-extension": "^2.0.0",
"tailwindcss": "^3.3.2", "tailwindcss": "^3.3.3",
"tslib": "^2.4.1", "tslib": "^2.6.2",
"typescript": "^5.0.0", "typescript": "^5.2.2",
"vite": "^4.3.0", "vite": "^4.4.11",
"vitest": "^0.25.3" "vitest": "^0.34.6"
}, },
"type": "module" "type": "module"
} }

5
src/app.postcss
View File

@@ -1,3 +1,8 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@tailwind variants;
html, html,
body { body {
@apply !h-[600px] !w-[800px]; @apply !h-[600px] !w-[800px];

4
src/routes/+layout.svelte
View File

@@ -1,8 +1,4 @@
<script lang='ts'> <script lang='ts'>
// The ordering of these imports is critical to your app working properly
import '@skeletonlabs/skeleton/themes/theme-skeleton.css';
// If you have source.organizeImports set to true in VSCode, then it will auto change this ordering
import '@skeletonlabs/skeleton/styles/skeleton.css';
// Most of your app wide CSS should be put in this file // Most of your app wide CSS should be put in this file
import '../app.postcss'; import '../app.postcss';
import { AppShell, AppBar } from '@skeletonlabs/skeleton'; import { AppShell, AppBar } from '@skeletonlabs/skeleton';

9
tailwind.config.cjs
View File

@@ -1,9 +0,0 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
darkMode: 'class',
content: ['./src/**/*.{html,js,svelte,ts}', require('path').join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')],
theme: {
extend: {},
},
plugins: [require('@tailwindcss/forms'),require('@tailwindcss/typography'),...require('@skeletonlabs/skeleton/tailwind/skeleton.cjs')()],
}

24
tailwind.config.ts Normal file
View File

@@ -0,0 +1,24 @@
import { join } from 'path';
import type { Config } from 'tailwindcss';
// 1. Import the Skeleton plugin
import { skeleton } from '@skeletonlabs/tw-plugin';
const config = {
// 2. Opt for dark mode to be handled via the class method
darkMode: 'class',
content: [
'./src/**/*.{html,js,svelte,ts}',
// 3. Append the path to the Skeleton package
join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')
],
theme: {
extend: {}
},
plugins: [
// 4. Append the Skeleton plugin (after other plugins)
skeleton({ themes: { preset: [{ name: 'skeleton', enhancements: true }] } })
]
} satisfies Config;
export default config;