first commit
This commit is contained in:
commit
a880028a7b
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
.svelte-kit
|
||||
4
.prettierignore
Normal file
4
.prettierignore
Normal file
@ -0,0 +1,4 @@
|
||||
# Package Managers
|
||||
package-lock.json
|
||||
pnpm-lock.yaml
|
||||
yarn.lock
|
||||
8
.prettierrc
Normal file
8
.prettierrc
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"useTabs": true,
|
||||
"singleQuote": true,
|
||||
"trailingComma": "none",
|
||||
"printWidth": 50,
|
||||
"plugins": ["prettier-plugin-svelte"],
|
||||
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
|
||||
}
|
||||
13
README.md
Normal file
13
README.md
Normal file
@ -0,0 +1,13 @@
|
||||
# SvelteKit + Tailwind + STDF
|
||||
|
||||
This template should help get you started developing with Svelte + Tailwind + STDF in SvelteKit.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
- [VS Code](https://code.visualstudio.com/) + [Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) + [Tailwind](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) + [STDF](https://stdf.design) .
|
||||
|
||||
- [WebStorm](https://www.jetbrains.com/webstorm/) + [Svelte](https://www.jetbrains.com/help/webstorm/svelte.html) + [Tailwind](https://www.jetbrains.com/help/webstorm/tailwind-css.html) + [STDF](https://stdf.design) .
|
||||
|
||||
## More Info
|
||||
|
||||
For more information about quickly create a new project, see the STDF [Quick start](https://stdf.design/#/guide) guide.
|
||||
7
jsconfig.json
Normal file
7
jsconfig.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"checkJs": true
|
||||
},
|
||||
"include": ["src/**/*.js", "src/**/*.svelte"],
|
||||
"exclude": ["node_modules", "dist"]
|
||||
}
|
||||
24
package.json
Normal file
24
package.json
Normal file
@ -0,0 +1,24 @@
|
||||
{
|
||||
"name": "twcss-demo",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"dev": "vite dev",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-static": "^2.0.3",
|
||||
"@sveltejs/kit": "^1.25.1",
|
||||
"autoprefixer": "^10.4.16",
|
||||
"postcss": "^8.4.31",
|
||||
"rollup-plugin-stdf-icon": "^0.0.14",
|
||||
"stdf": "^0.4.3",
|
||||
"svelte": "^4.2.1",
|
||||
"tailwindcss": "^3.3.3",
|
||||
"vite": "^4.4.9"
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"prettier": "^3.3.3"
|
||||
}
|
||||
}
|
||||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
30
src/app.css
Normal file
30
src/app.css
Normal file
@ -0,0 +1,30 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
h1 {
|
||||
@apply mb-2 text-3xl font-bold;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply text-xl font-semibold mb-1;
|
||||
}
|
||||
|
||||
a {
|
||||
@apply underline text-sky-300 hover:text-sky-500 transition decoration-wavy underline-offset-4;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@apply px-4 py-3 rounded-lg hover:transition hover:duration-300 hover:opacity-80 disabled:bg-slate-400/30 hover:disabled:opacity-100;
|
||||
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply bg-blue-600 text-white;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply bg-slate-500 text-white;
|
||||
}
|
||||
}
|
||||
14
src/app.html
Normal file
14
src/app.html
Normal file
@ -0,0 +1,14 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="icon" type="image/svg+xml" href="%sveltekit.assets%/stdf.svg" media="(prefers-color-scheme: light)" />
|
||||
<link rel="icon" type="image/svg+xml" href="%sveltekit.assets%/stdf_dark.svg" media="(prefers-color-scheme: dark)" />
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
|
||||
<title>SvelteKit + Tailwind + STDF</title>
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
|
||||
<body data-sveltekit-preload-data="hover" class="bg-primaryWhite dark:bg-darkBlack text-black dark:text-white">
|
||||
<main style="display: contents">%sveltekit.body%</main>
|
||||
</body>
|
||||
</html>
|
||||
46
src/data/Nintendo.js
Normal file
46
src/data/Nintendo.js
Normal file
@ -0,0 +1,46 @@
|
||||
export default {
|
||||
name: 'Nintendo',
|
||||
color: {
|
||||
primary: {
|
||||
50: '255, 246, 245', // #FFF6F5
|
||||
100: '255, 234, 232', // #FFEAE8
|
||||
200: '250, 185, 182', // #FAB9B6
|
||||
300: '245, 136, 134', // #F58886
|
||||
400: '240, 87, 90', // #F0575A
|
||||
500: '235, 43, 52', // #EB2B34
|
||||
default: '230, 0, 18', // #E60012
|
||||
700: '192, 0, 22', // #C00016
|
||||
800: '153, 0, 23', // #990017
|
||||
900: '115, 0, 21', // #730015
|
||||
950: '77, 0, 17', // #4D0011
|
||||
},
|
||||
dark: {
|
||||
50: '245, 255, 254', // #F5FFFE
|
||||
100: '232, 255, 254', // #E8FFFE
|
||||
200: '182, 249, 249', // #B6F9F9
|
||||
300: '133, 240, 244', // #85F0F4
|
||||
400: '87, 228, 238', // #57E4EE
|
||||
500: '42, 214, 233', // #2AD6E9
|
||||
default: '0, 195, 227', // #00C3E3
|
||||
700: '0, 158, 189', // #009EBD
|
||||
800: '0, 121, 152', // #007998
|
||||
900: '0, 87, 114', // #005772
|
||||
950: '0, 56, 77', // #00384D
|
||||
},
|
||||
primaryBlack: '25, 1, 3', // #190103
|
||||
primaryWhite: '243, 242, 242', // #F3F2F2
|
||||
darkBlack: '1, 22, 25', // #011619
|
||||
darkWhite: '242, 243, 243', // #F2F3F3
|
||||
functional: {
|
||||
success: '0, 180, 42', // #00b42a
|
||||
warning: '255, 125, 0', // #ff7d00
|
||||
error: '245, 63, 63', // #f53f3f
|
||||
info: '22, 93, 255', // #165dff
|
||||
},
|
||||
extend: [
|
||||
{ color: '0, 82, 217', alias: 'Tencent' }, // #0052d9
|
||||
{ color: '26, 173, 25', alias: 'WeChat' }, // #1aad19
|
||||
{ color: '243, 112, 33', alias: 'Hermès' }, // #f37021
|
||||
],
|
||||
},
|
||||
};
|
||||
4
src/lib/svgs/Heroicons/cake.svg
Normal file
4
src/lib/svgs/Heroicons/cake.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 8.25v-1.5m0 1.5c-1.355 0-2.697.056-4.024.166C6.845 8.51 6 9.473 6 10.608v2.513m6-4.87c1.355 0 2.697.055 4.024.165C17.155 8.51 18 9.473 18 10.608v2.513m-3-4.87v-1.5m-6 1.5v-1.5m12 9.75l-1.5.75a3.354 3.354 0 01-3 0 3.354 3.354 0 00-3 0 3.354 3.354 0 01-3 0 3.354 3.354 0 00-3 0 3.354 3.354 0 01-3 0L3 16.5m15-3.38a48.474 48.474 0 00-6-.37c-2.032 0-4.034.125-6 .37m12 0c.39.049.777.102 1.163.16 1.07.16 1.837 1.094 1.837 2.175v5.17c0 .62-.504 1.124-1.125 1.124H4.125A1.125 1.125 0 013 20.625v-5.17c0-1.08.768-2.014 1.837-2.174A47.78 47.78 0 016 13.12M12.265 3.11a.375.375 0 11-.53 0L12 2.845l.265.265zm-3 0a.375.375 0 11-.53 0L9 2.845l.265.265zm6 0a.375.375 0 11-.53 0L15 2.845l.265.265z" />
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 894 B |
1
src/lib/svgs/IconPark/cup.svg
Normal file
1
src/lib/svgs/IconPark/cup.svg
Normal file
@ -0,0 +1 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 49 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.77783 17.012C8.77783 16.4531 9.23094 16 9.78988 16H33.7658C34.3247 16 34.7778 16.4531 34.7778 17.012V31C34.7778 38.1797 28.9575 44 21.7778 44V44C14.5981 44 8.77783 38.1797 8.77783 31V17.012Z" stroke="#000000" stroke-width="4"/><rect x="8.77783" y="23" width="26" height="8" fill="none" stroke="#000000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.7778 4V10" stroke="#000000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M13.7778 6V8" stroke="#000000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M29.7778 6V8" stroke="#000000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M34.7778 34C38.6438 34 41.7778 30.866 41.7778 27C41.7778 23.134 38.6438 20 34.7778 20" stroke="#000000" stroke-width="4" stroke-linecap="round"/></svg>
|
||||
|
After Width: | Height: | Size: 989 B |
1
src/lib/svgs/Remix/javascript-fill.svg
Normal file
1
src/lib/svgs/Remix/javascript-fill.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6 3C4.34315 3 3 4.34315 3 6V18C3 19.6569 4.34315 21 6 21H18C19.6569 21 21 19.6569 21 18V6C21 4.34315 19.6569 3 18 3H6ZM13.3344 16.055C14.0531 16.6343 14.7717 16.9203 15.4904 16.913C15.9304 16.913 16.2677 16.8323 16.5024 16.671C16.7297 16.517 16.8434 16.297 16.8434 16.011C16.8434 15.7177 16.7297 15.4683 16.5024 15.263C16.2677 15.0577 15.8241 14.8523 15.1714 14.647C14.3867 14.4197 13.7817 14.1263 13.3564 13.767C12.9384 13.4077 12.7257 12.9053 12.7184 12.26C12.7184 11.6513 12.9824 11.1417 13.5104 10.731C14.0237 10.3203 14.6801 10.115 15.4794 10.115C16.5941 10.115 17.4887 10.3863 18.1634 10.929L17.3934 12.128C17.1221 11.9153 16.8104 11.7613 16.4584 11.666C16.1064 11.556 15.7911 11.501 15.5124 11.501C15.1311 11.501 14.8267 11.5707 14.5994 11.71C14.3721 11.8493 14.2584 12.0327 14.2584 12.26C14.2584 12.5093 14.3977 12.722 14.6764 12.898C14.9551 13.0667 15.4317 13.2537 16.1064 13.459C16.9204 13.701 17.4997 14.0237 17.8444 14.427C18.1891 14.8303 18.3614 15.3437 18.3614 15.967C18.3614 16.605 18.1157 17.155 17.6244 17.617C17.1404 18.0717 16.4364 18.31 15.5124 18.332C14.3024 18.332 13.2904 17.969 12.4764 17.243L13.3344 16.055ZM7.80405 16.693C8.03872 16.8397 8.32105 16.913 8.65105 16.913C8.99572 16.913 9.28172 16.814 9.50905 16.616C9.73639 16.4107 9.85005 16.055 9.85005 15.549V10.247H11.3351V15.835C11.3131 16.7003 11.0637 17.3237 10.5871 17.705C10.3157 17.9323 10.0187 18.0937 9.69605 18.189C9.37339 18.2843 9.06172 18.332 8.76105 18.332C8.21105 18.332 7.72339 18.2367 7.29805 18.046C6.84339 17.8407 6.46205 17.4777 6.15405 16.957L7.18805 16.11C7.37872 16.3667 7.58405 16.561 7.80405 16.693Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
1
src/lib/svgs/Remix/riding-line.svg
Normal file
1
src/lib/svgs/Remix/riding-line.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.5 21C3.01472 21 1 18.9853 1 16.5C1 14.0147 3.01472 12 5.5 12C7.98528 12 10 14.0147 10 16.5C10 18.9853 7.98528 21 5.5 21ZM5.5 19C6.88071 19 8 17.8807 8 16.5C8 15.1193 6.88071 14 5.5 14C4.11929 14 3 15.1193 3 16.5C3 17.8807 4.11929 19 5.5 19ZM18.5 21C16.0147 21 14 18.9853 14 16.5C14 14.0147 16.0147 12 18.5 12C20.9853 12 23 14.0147 23 16.5C23 18.9853 20.9853 21 18.5 21ZM18.5 19C19.8807 19 21 17.8807 21 16.5C21 15.1193 19.8807 14 18.5 14C17.1193 14 16 15.1193 16 16.5C16 17.8807 17.1193 19 18.5 19ZM11.023 10.3054L13 12V18H11V13L8.28117 10.7343C8.18221 10.6661 8.08802 10.588 8 10.5C7.21895 9.71895 7.21895 8.45262 8 7.67157L10.8284 4.84315C11.6095 4.0621 12.8758 4.0621 13.6569 4.84315L15.0711 6.25736C16.1746 7.36086 17.5548 8.01891 18.9884 8.23151L18.978 10.2474C17.0335 10.0218 15.1485 9.16323 13.6569 7.67157L11.023 10.3054ZM16 5C14.8954 5 14 4.10457 14 3C14 1.89543 14.8954 1 16 1C17.1046 1 18 1.89543 18 3C18 4.10457 17.1046 5 16 5Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
1
src/lib/svgs/Remix/spy-line.svg
Normal file
1
src/lib/svgs/Remix/spy-line.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17 13C19.2091 13 21 14.7909 21 17C21 19.2091 19.2091 21 17 21C14.7909 21 13 19.2091 13 17H11C11 19.2091 9.20914 21 7 21C4.79086 21 3 19.2091 3 17C3 14.7909 4.79086 13 7 13C8.48052 13 9.77317 13.8043 10.4648 14.9999H13.5352C14.2268 13.8043 15.5195 13 17 13ZM7 15C5.89543 15 5 15.8954 5 17C5 18.1046 5.89543 19 7 19C8.10457 19 9 18.1046 9 17C9 15.8954 8.10457 15 7 15ZM17 15C15.8954 15 15 15.8954 15 17C15 18.1046 15.8954 19 17 19C18.1046 19 19 18.1046 19 17C19 15.8954 18.1046 15 17 15ZM16 3C18.2091 3 20 4.79086 20 7V10H22V12H2V10H4V7C4 4.79086 5.79086 3 8 3H16ZM16 5H8C6.94564 5 6 5.95 6 7V10H18V7C18 5.94564 17.05 5 16 5Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 708 B |
1
src/lib/symbol/ri-arrow-left-s-line.svg
Normal file
1
src/lib/symbol/ri-arrow-left-s-line.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 189 B |
1
src/lib/symbol/ri-arrow-right-s-line.svg
Normal file
1
src/lib/symbol/ri-arrow-right-s-line.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 197 B |
3
src/routes/+layout.js
Normal file
3
src/routes/+layout.js
Normal file
@ -0,0 +1,3 @@
|
||||
// 修改 ssr 为 false ，使其不再使用服务端渲染，而是使用客户端渲染
|
||||
// Change ssr to false to use client-side rendering instead of server-side rendering
|
||||
export const ssr = false;
|
||||
29
src/routes/+layout.svelte
Normal file
29
src/routes/+layout.svelte
Normal file
@ -0,0 +1,29 @@
|
||||
<script>
|
||||
import "../app.css"
|
||||
</script>
|
||||
<slot >
|
||||
|
||||
<div>
|
||||
<h1 class="!text-3xl font-bold mb-2">This is a title</h1>
|
||||
<h2 class="!text-xl font-semibold mb-1">This is a subtitle</h2>
|
||||
<p class="!text-base">This is a paragraph</p>
|
||||
<a>This is a an anchor</a>
|
||||
<div>
|
||||
<button>This is a button</button>
|
||||
</div>
|
||||
<div>
|
||||
<input type="text" />
|
||||
</div>
|
||||
<div>
|
||||
<input type="checkbox" id="checkbox" />
|
||||
<label for="checkbox">checkbox</label>
|
||||
</div>
|
||||
<div>
|
||||
<select>
|
||||
<option>Option 1</option>
|
||||
<option>Option 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</slot>
|
||||
42
src/routes/+page.svelte
Normal file
42
src/routes/+page.svelte
Normal file
@ -0,0 +1,42 @@
|
||||
<script>
|
||||
import '../app.css';
|
||||
</script>
|
||||
|
||||
<slot>
|
||||
<html lang="en">
|
||||
<h1>This is a title</h1>
|
||||
<h2>This is a subtitle</h2>
|
||||
<p class="!text-base">This is a paragraph</p>
|
||||
<a href="baidu.com">This is a an anchor</a>
|
||||
<div class="my-4">
|
||||
<button class="btn btn-primary"
|
||||
>This is a button</button
|
||||
>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<button class="btn btn-secondary"
|
||||
>This is a secondary button</button
|
||||
>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<button disabled class="btn btn-secondary"
|
||||
>This is a secondary button</button
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<input type="text" />
|
||||
</div>
|
||||
<div>
|
||||
<input type="checkbox" id="checkbox" />
|
||||
<label for="checkbox">checkbox</label>
|
||||
</div>
|
||||
<div>
|
||||
<select>
|
||||
<option>Option 1</option>
|
||||
<option>Option 2</option>
|
||||
</select>
|
||||
</div>
|
||||
<h1>This is a another title</h1>
|
||||
<h2>This is a subtitle</h2>
|
||||
</html>
|
||||
</slot>
|
||||
29
src/routes/Counter.svelte
Normal file
29
src/routes/Counter.svelte
Normal file
@ -0,0 +1,29 @@
|
||||
<script>
|
||||
import "../app.css"
|
||||
</script>
|
||||
<slot >
|
||||
|
||||
<div>
|
||||
<h1 class="!text-3xl font-bold mb-2">This is a title</h1>
|
||||
<h2 class="!text-xl font-semibold mb-1">This is a subtitle</h2>
|
||||
<p class="!text-base">This is a paragraph</p>
|
||||
<a>This is a an anchor</a>
|
||||
<div>
|
||||
<button>This is a button</button>
|
||||
</div>
|
||||
<div>
|
||||
<input type="text" />
|
||||
</div>
|
||||
<div>
|
||||
<input type="checkbox" id="checkbox" />
|
||||
<label for="checkbox">checkbox</label>
|
||||
</div>
|
||||
<div>
|
||||
<select>
|
||||
<option>Option 1</option>
|
||||
<option>Option 2</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</slot>
|
||||
20
src/routes/about/+page.svelte
Normal file
20
src/routes/about/+page.svelte
Normal file
@ -0,0 +1,20 @@
|
||||
<script>
|
||||
import { NavBar } from 'stdf';
|
||||
|
||||
const lang = sessionStorage.getItem('lang') === 'en_US' ? 'en_US' : 'zh_CN';
|
||||
$: isZh = lang === 'zh_CN';
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>About</title>
|
||||
<meta name="description" content="About this app" />
|
||||
</svelte:head>
|
||||
|
||||
<div class="sticky z-10 top-0">
|
||||
<NavBar title={isZh ? '关于' : 'ABOUT'} on:clickleft={() => window.history.back()} />
|
||||
</div>
|
||||
|
||||
<div class="px-2 py-20 text-center space-y-10">
|
||||
<div class="text-3xl text-primary dark:text-dark">{isZh ? '这是一个关于页面' : 'This is a about page'}</div>
|
||||
<div class="text-sm">{isZh ? '仅用于演示 SvelteKit 的路由功能' : "Only for demonstration of SvelteKit's routing functionality"}</div>
|
||||
</div>
|
||||
1
static/fonts/symbol.svg
Normal file
1
static/fonts/symbol.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="ri-arrow-left-s-line" viewBox="0 0 24 24"><path d="m10.828 12 4.95 4.95-1.414 1.415L8 12l6.364-6.364 1.414 1.414z"/></symbol><symbol id="ri-arrow-right-s-line" viewBox="0 0 24 24"><path d="m13.171 12-4.95-4.95 1.415-1.413L16 12l-6.364 6.364-1.414-1.415z"/></symbol></svg>
|
||||
|
After Width: | Height: | Size: 366 B |
4
static/stdf.svg
Normal file
4
static/stdf.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="90" height="80" viewBox="0 0 90 80" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H20H40H50C64.8056 0 77.7325 8.04398 84.6487 20H50H40V22.6757V30H50C55.5229 30 60 34.4771 60 40C60 45.5229 55.5229 50 50 50H40V57.3243V78.7398V80H20V66.4583V20H15.3513H0V0ZM50 80C72.0914 80 90 62.0914 90 40C90 36.547 89.5625 33.1962 88.7398 30H67.3244C69.0261 32.9417 70 36.3571 70 40C70 51.0457 61.0457 60 50 60V80Z" fill="#0B24FB"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20 30V0L0 50H20V80L40 30H20Z" fill="#FFC043"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 587 B |
4
static/stdf_dark.svg
Normal file
4
static/stdf_dark.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="90" height="80" viewBox="0 0 90 80" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H20H40H50C64.8056 0 77.7325 8.04398 84.6487 20H50H40V22.6757V30H50C55.5229 30 60 34.4771 60 40C60 45.5229 55.5229 50 50 50H40V57.3243V78.7398V80H20V66.4583V20H15.3513H0V0ZM50 80C72.0914 80 90 62.0914 90 40C90 36.547 89.5625 33.1962 88.7398 30H67.3244C69.0261 32.9417 70 36.3571 70 40C70 51.0457 61.0457 60 50 60V80Z" fill="#FFC043"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20 30V0L0 50H20V80L40 30H20Z" fill="#0B24FB"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 587 B |
1
static/svelte.svg
Normal file
1
static/svelte.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="26.6" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 308"><path fill="#FF3E00" d="M239.682 40.707C211.113-.182 154.69-12.301 113.895 13.69L42.247 59.356a82.198 82.198 0 0 0-37.135 55.056a86.566 86.566 0 0 0 8.536 55.576a82.425 82.425 0 0 0-12.296 30.719a87.596 87.596 0 0 0 14.964 66.244c28.574 40.893 84.997 53.007 125.787 27.016l71.648-45.664a82.182 82.182 0 0 0 37.135-55.057a86.601 86.601 0 0 0-8.53-55.577a82.409 82.409 0 0 0 12.29-30.718a87.573 87.573 0 0 0-14.963-66.244"></path><path fill="#FFF" d="M106.889 270.841c-23.102 6.007-47.497-3.036-61.103-22.648a52.685 52.685 0 0 1-9.003-39.85a49.978 49.978 0 0 1 1.713-6.693l1.35-4.115l3.671 2.697a92.447 92.447 0 0 0 28.036 14.007l2.663.808l-.245 2.659a16.067 16.067 0 0 0 2.89 10.656a17.143 17.143 0 0 0 18.397 6.828a15.786 15.786 0 0 0 4.403-1.935l71.67-45.672a14.922 14.922 0 0 0 6.734-9.977a15.923 15.923 0 0 0-2.713-12.011a17.156 17.156 0 0 0-18.404-6.832a15.78 15.78 0 0 0-4.396 1.933l-27.35 17.434a52.298 52.298 0 0 1-14.553 6.391c-23.101 6.007-47.497-3.036-61.101-22.649a52.681 52.681 0 0 1-9.004-39.849a49.428 49.428 0 0 1 22.34-33.114l71.664-45.677a52.218 52.218 0 0 1 14.563-6.398c23.101-6.007 47.497 3.036 61.101 22.648a52.685 52.685 0 0 1 9.004 39.85a50.559 50.559 0 0 1-1.713 6.692l-1.35 4.116l-3.67-2.693a92.373 92.373 0 0 0-28.037-14.013l-2.664-.809l.246-2.658a16.099 16.099 0 0 0-2.89-10.656a17.143 17.143 0 0 0-18.398-6.828a15.786 15.786 0 0 0-4.402 1.935l-71.67 45.674a14.898 14.898 0 0 0-6.73 9.975a15.9 15.9 0 0 0 2.709 12.012a17.156 17.156 0 0 0 18.404 6.832a15.841 15.841 0 0 0 4.402-1.935l27.345-17.427a52.147 52.147 0 0 1 14.552-6.397c23.101-6.006 47.497 3.037 61.102 22.65a52.681 52.681 0 0 1 9.003 39.848a49.453 49.453 0 0 1-22.34 33.12l-71.664 45.673a52.218 52.218 0 0 1-14.563 6.398"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
1
static/symbols/Heroicons.svg
Normal file
1
static/symbols/Heroicons.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="cake" viewBox="0 0 24 24" fill="none" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 8.25v-1.5m0 1.5q-2.033 0-4.024.166C6.845 8.51 6 9.473 6 10.608v2.513m6-4.87q2.033 0 4.024.165C17.155 8.51 18 9.473 18 10.608v2.513m-3-4.87v-1.5m-6 1.5v-1.5m12 9.75-1.5.75a3.35 3.35 0 0 1-3 0 3.35 3.35 0 0 0-3 0 3.35 3.35 0 0 1-3 0 3.35 3.35 0 0 0-3 0 3.35 3.35 0 0 1-3 0L3 16.5m15-3.38a48.5 48.5 0 0 0-6-.37q-3.05.001-6 .37m12 0q.585.073 1.163.16c1.07.16 1.837 1.094 1.837 2.175v5.17c0 .62-.504 1.124-1.125 1.124H4.125A1.125 1.125 0 0 1 3 20.625v-5.17c0-1.08.768-2.014 1.837-2.174A48 48 0 0 1 6 13.12m6.265-10.01a.375.375 0 1 1-.53 0L12 2.845zm-3 0a.375.375 0 1 1-.53 0L9 2.845zm6 0a.375.375 0 1 1-.53 0L15 2.845z"/></symbol></svg>
|
||||
|
After Width: | Height: | Size: 846 B |
1
static/symbols/IconPark.svg
Normal file
1
static/symbols/IconPark.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="cup" viewBox="0 0 49 48" fill="none"><path stroke="currentColor" stroke-width="4" d="M8.778 17.012c0-.559.453-1.012 1.012-1.012h23.976c.559 0 1.012.453 1.012 1.012V31c0 7.18-5.82 13-13 13s-13-5.82-13-13z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M8.778 23h26v8h-26zM21.778 4v6M13.778 6v2M29.778 6v2"/><path stroke="currentColor" stroke-linecap="round" stroke-width="4" d="M34.778 34a7 7 0 1 0 0-14"/></symbol></svg>
|
||||
|
After Width: | Height: | Size: 565 B |
1
static/symbols/Remix.svg
Normal file
1
static/symbols/Remix.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="javascript-fill" viewBox="0 0 24 24"><path d="M6 3a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3h12a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3zm7.334 13.055q1.08.87 2.156.858.66 0 1.012-.242a.75.75 0 0 0 .341-.66.97.97 0 0 0-.34-.748q-.352-.307-1.332-.616-1.177-.34-1.815-.88-.626-.54-.638-1.507 0-.913.792-1.529.77-.616 1.97-.616 1.672 0 2.683.814l-.77 1.199a2.6 2.6 0 0 0-.935-.462 3.2 3.2 0 0 0-.946-.165q-.57 0-.913.209-.34.21-.34.55 0 .374.417.638.42.254 1.43.561 1.221.363 1.738.968t.517 1.54q0 .957-.737 1.65-.726.682-2.112.715-1.815 0-3.036-1.089zm-5.53.638q.352.22.847.22.517 0 .858-.297.34-.308.341-1.067v-5.302h1.485v5.588q-.033 1.298-.748 1.87a2.5 2.5 0 0 1-.891.484 3.3 3.3 0 0 1-.935.143q-.825 0-1.463-.286-.682-.307-1.144-1.089l1.034-.847q.285.385.616.583"/></symbol><symbol id="riding-line" viewBox="0 0 24 24"><path d="M5.5 21a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9m0-2a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5m13 2a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9m0-2a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5m-7.477-8.695L13 12v6h-2v-5l-2.719-2.266A2 2 0 0 1 8 7.671l2.828-2.828a2 2 0 0 1 2.829 0l1.414 1.414a6.97 6.97 0 0 0 3.917 1.975l-.01 2.015a8.96 8.96 0 0 1-5.321-2.575zM16 5a2 2 0 1 1 0-4 2 2 0 0 1 0 4"/></symbol><symbol id="spy-line" viewBox="0 0 24 24"><path d="M17 13a4 4 0 1 1-4 4h-2a4 4 0 1 1-.535-2h3.07A4 4 0 0 1 17 13M7 15a2 2 0 1 0 0 4 2 2 0 0 0 0-4m10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4M16 3a4 4 0 0 1 4 4v3h2v2H2v-2h2V7a4 4 0 0 1 4-4zm0 2H8c-1.054 0-2 .95-2 2v3h12V7c0-1.054-.95-2-2-2"/></symbol></svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
6
static/tailwindcss.svg
Normal file
6
static/tailwindcss.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<title>Tailwind CSS</title>
|
||||
<path
|
||||
fill="#06B6D4"
|
||||
d="M12.001,4.8c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 C13.666,10.618,15.027,12,18.001,12c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C16.337,6.182,14.976,4.8,12.001,4.8z M6.001,12c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 c1.177,1.194,2.538,2.576,5.512,2.576c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C10.337,13.382,8.976,12,6.001,12z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 641 B |
23
svelte.config.js
Normal file
23
svelte.config.js
Normal file
@ -0,0 +1,23 @@
|
||||
import adapter from '@sveltejs/adapter-static';
|
||||
import { vitePreprocess } from '@sveltejs/kit/vite';
|
||||
|
||||
/** @type {import('@sveltejs/kit').Config} */
|
||||
const config = {
|
||||
kit: {
|
||||
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
|
||||
// If your environment is not supported or you settled on a specific environment, switch out the adapter.
|
||||
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
|
||||
adapter: adapter({
|
||||
fallback: 'index.html', // may differ from host to host
|
||||
}),
|
||||
},
|
||||
onwarn: (warning, handler) => {
|
||||
if (warning.code.startsWith('a11y-')) {
|
||||
return;
|
||||
}
|
||||
handler(warning);
|
||||
},
|
||||
preprocess: vitePreprocess(),
|
||||
};
|
||||
|
||||
export default config;
|
||||
9
tailwind.config.js
Normal file
9
tailwind.config.js
Normal file
@ -0,0 +1,9 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: ['./src/**/*.{html,js,svelte,ts}', './node_modules/stdf/**/*.svelte'],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
darkMode: 'class',
|
||||
plugins: [],
|
||||
};
|
||||
20
vite.config.js
Normal file
20
vite.config.js
Normal file
@ -0,0 +1,20 @@
|
||||
import { sveltekit } from '@sveltejs/kit/vite';
|
||||
import { defineConfig } from 'vite';
|
||||
import svgSprite from 'rollup-plugin-stdf-icon';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
// @ts-ignore
|
||||
sveltekit({}),
|
||||
// 一般来说，一个应用的的 svg 不多时都放在一个文件夹下，合并为一个 symbol 即可。此处演示了不同文件夹下的图标如何合并为不同的 symbol。
|
||||
// Generally speaking, when the svg of an application is not much, it is placed in a folder and merged into one symbol. This example shows how the icons in different folders are merged into different symbols.
|
||||
svgSprite([
|
||||
{ inFile: 'src/lib/svgs/Heroicons', outFile: 'static/symbols' },
|
||||
{ inFile: 'src/lib/svgs/IconPark', outFile: 'static/symbols' },
|
||||
{ inFile: 'src/lib/svgs/Remix', outFile: 'static/symbols' },
|
||||
// 单独为 Cell 与 NavBar 用到的图标创建一个 symbol。详见：https://stdf.design/#/guide/icon
|
||||
// Create a symbol for the icons used by Cell and NavBar. See: https://stdf.design/#/guide/icon
|
||||
{ inFile: 'src/lib/symbol', outFile: 'static/fonts' },
|
||||
]),
|
||||
],
|
||||
});
|
||||
Loading…
x
Reference in New Issue
Block a user