feat: update ui

.eslintrc.cjs

@@ -0,0 +1,20 @@
+module.exports = {
+	root: true,
+	parser: '@typescript-eslint/parser',
+	extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
+	plugins: ['svelte3', '@typescript-eslint'],
+	ignorePatterns: ['*.cjs'],
+	overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
+	settings: {
+		'svelte3/typescript': () => require('typescript')
+	},
+	parserOptions: {
+		sourceType: 'module',
+		ecmaVersion: 2020
+	},
+	env: {
+		browser: true,
+		es2017: true,
+		node: true
+	}
+};

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

.prettierrc

@@ -0,0 +1,6 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100
+}

package.json

@@ -0,0 +1,35 @@
+{
+	"name": "cq-ui",
+	"version": "0.0.1",
+	"scripts": {
+		"dev": "svelte-kit dev",
+		"build": "svelte-kit build",
+		"package": "svelte-kit package",
+		"preview": "svelte-kit preview",
+		"check": "svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
+		"format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "next",
+		"@sveltejs/kit": "next",
+		"@tailwindcss/forms": "^0.4.0",
+		"@tailwindcss/typography": "^0.5.0",
+		"@typescript-eslint/eslint-plugin": "^4.31.1",
+		"@typescript-eslint/parser": "^4.31.1",
+		"autoprefixer": "^10.4.0",
+		"eslint": "^7.32.0",
+		"eslint-config-prettier": "^8.3.0",
+		"eslint-plugin-svelte3": "^3.2.1",
+		"prettier": "^2.4.1",
+		"prettier-plugin-svelte": "^2.4.0",
+		"svelte": "^3.44.0",
+		"svelte-check": "^2.2.6",
+		"svelte-preprocess": "^4.10.1",
+		"tailwindcss": "^3.0.7",
+		"tslib": "^2.3.1",
+		"typescript": "^4.4.3"
+	},
+	"type": "module"
+}

postcss.config.cjs

@@ -0,0 +1,13 @@
+const tailwindcss = require('tailwindcss');
+const autoprefixer = require('autoprefixer');
+
+const config = {
+	plugins: [
+		//Some plugins, like tailwindcss/nesting, need to run before Tailwind,
+		tailwindcss(),
+		//But others, like autoprefixer, need to run after,
+		autoprefixer()
+	]
+};
+
+module.exports = config;

static/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow:

svelte.config.js

@@ -0,0 +1,35 @@
+import adapter from '@sveltejs/adapter-auto';
+import preprocess from 'svelte-preprocess';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	// Consult https://github.com/sveltejs/svelte-preprocess
+	// for more information about preprocessors
+	preprocess: [preprocess({})],
+
+	kit: {
+		adapter: adapter(),
+
+		files: {
+			assets: 'static',
+			hooks: 'web_src/hooks',
+			lib: 'web_src/lib',
+			routes: 'web_src/routes',
+			serviceWorker: 'web_src/service-worker',
+			template: 'web_src/app.html'
+		},
+
+		// hydrate the <div id="svelte"> element in src/app.html
+		target: '#svelte',
+
+		vite: {
+			server: {
+				fs: {
+					allow: ['./web_src']
+				}
+			}
+		}
+	}
+};
+
+export default config;

tailwind.config.cjs

@@ -1,78 +1,46 @@
 const config = {
-  mode: "jit",
+	mode: 'jit',
-  purge: ["./web_src/**/*.{html,js,svelte,ts}"],
+	purge: ['./web_src/**/*.{html,js,svelte,ts}'],
-  theme: {
-    extend: {},
-  },
-  plugins: [
-    require('daisyui'),
-  ],
-
-
-
-
-  daisyui: {
-    themes: [
-      {
-        'hackathon': {
-          'primary': '#9BA77A',
-          'primary-focus': '#5E6536',
-          'primary-content': '#EAE7E4',
-          'secondary': '#A8351E',
-          'secondary-focus': '#703529',
-          'secondary-content': '#EAE7E4',
-          'accent': '#283D70',
-          'accent-focus': '#2E3546',
-          'accent-content': '#EAE7E4',
-          'neutral': '#1F1B12',
-          'neutral-focus': '#4F4630',
-          'neutral-content': '#EAE7E4',
-          'base-100': '#EBDCB3',
-          'base-200': '#E0C98A',
-          'base-300': '#B89876',
-          'base-content': '#3F270E',
-          'info': '#2094f3',
-          'success': '#009485',
-          'warning': '#ff9900',
-          'error': '#ff5724',
-        },
-      },
-    ],
-  },
 
-  // daisyui: {
+	theme: {
-  //   themes: [
+		extend: {}
-  //     {
+	},
-  //       'hackathon': {
-  //         'primary': '#8B4D96',
-  //         'primary-focus': '#702860',
-  //         'primary-content': '#EAE7E4',
 
-  //         'neutral': '#972812',
+  plugins: [
-  //         'neutral-focus': '#A8351E',
+    require('@tailwindcss/typography'),
-  //         'neutral-content': '#EAE7E4',
+    require('@tailwindcss/forms'),
-
+  ],
-  //         'neutral': '#1F1B12',
-  //         'neutral-focus': '#221F17',
-  //         'neutral-content': '#EAE7E4',
-
-  //         'secondary': '#283D70',
-  //         'secondary-focus': '#2E3546',
-  //         'secondary-content': '#EAE7E4',
-
-  //         'base-100': '#967E74',
-  //         'base-200': '#E4E0D2',
-  //         'base-300': '#B98976',
-  //         'base-content': '#D1AA59',
 
-  //         'info': '#2094f3',
+	// daisyui: {
-  //         'success': '#009485',
+	// 	themes: [
-  //         'warning': '#ff9900',
+	// 		{
-  //         'error': '#ff5724',
+	// 			hackathon: {
-  //       },
+	// 				primary: '#9BA77A',
-  //     },
+	// 				'primary-focus': '#5E6536',
-  //   ],
+	// 				'primary-content': '#EAE7E4',
-  // }
+	// 				secondary: '#A8351E',
+	// 				'secondary-focus': '#703529',
+	// 				'secondary-content': '#EAE7E4',
+	// 				accent: '#283D70',
+	// 				'accent-focus': '#2E3546',
+	// 				'accent-content': '#EAE7E4',
+	// 				neutral: '#1F1B12',
+	// 				'neutral-focus': '#4F4630',
+	// 				'neutral-content': '#EAE7E4',
+	// 				'base-100': '#EBDCB3',
+	// 				'base-200': '#E0C98A',
+	// 				'base-300': '#B89876',
+	// 				'base-content': '#3F270E',
+	// 				info: '#2094f3',
+	// 				success: '#009485',
+	// 				warning: '#ff9900',
+	// 				error: '#ff5724'
+	// 			}
+	// 		}
+	// 	]
+	// },
+
+	content: ['./src/**/*.{html,js,svelte,ts}']
 };
 
 module.exports = config;

tsconfig.json

@@ -0,0 +1,31 @@
+{
+	"compilerOptions": {
+		"moduleResolution": "node",
+		"module": "es2020",
+		"lib": ["es2020", "DOM"],
+		"target": "es2020",
+		/**
+			svelte-preprocess cannot figure out whether you have a value or a type, so tell TypeScript
+			to enforce using \`import type\` instead of \`import\` for Types.
+			*/
+		"importsNotUsedAsValues": "error",
+		"isolatedModules": true,
+		"resolveJsonModule": true,
+		/**
+			To have warnings/errors of the Svelte compiler at the correct position,
+			enable source maps by default.
+			*/
+		"sourceMap": true,
+		"esModuleInterop": true,
+		"skipLibCheck": true,
+		"forceConsistentCasingInFileNames": true,
+		"baseUrl": ".",
+		"allowJs": true,
+		"checkJs": true,
+		"paths": {
+			"$lib": ["src/lib"],
+			"$lib/*": ["src/lib/*"]
+		}
+	},
+	"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.ts", "src/**/*.svelte"]
+}

web_src/app.css

@@ -0,0 +1,4 @@
+/* Write your global styles here, in PostCSS syntax */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

web_src/app.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<meta name="description" content="" />
+		<link rel="icon" href="/favicon.png" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%svelte.head%
+	</head>
+	<body>
+		<div id="svelte">%svelte.body%</div>
+	</body>
+</html>

web_src/global.d.ts

@@ -0,0 +1 @@
+/// <reference types="@sveltejs/kit" />

web_src/routes/__layout.svelte

@@ -0,0 +1,5 @@
+<script>
+	import '../app.css';
+</script>
+
+<slot />

web_src/routes/index.svelte

@@ -0,0 +1,2 @@
+<h1>Welcome to SvelteKit</h1>
+<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>