Daisy UI (#14)

* add dependency

* rename Input to TextInput and use daisy

* base styling

* storybook setup with tailwind and theme changer

* daisy buttons

* add flaticons

* text input to daisy

* Navbar to daisy

* login using daisy

* autodocs is... auto

* refactor Tabs to separate components

* move TextInput

* move button

* move navbar

* remove index

* move container

* move loader

* move tabs to navigation

* organize storybook hierarchy

* use card

* remove storybook dark mode

* README

* ignore db file

* ignore db

* prisma scripts

* format

* blyat

* fix redirect

.storybook/main.js

@@ -2,15 +2,16 @@
 const config = {
 	stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|ts|svelte)'],
 	addons: [
-		'@storybook/addon-svelte-csf',
-		'@storybook/addon-essentials',
 		'@chromatic-com/storybook',
+		'@storybook/addon-essentials',
 		'@storybook/addon-interactions',
-		'storybook-dark-mode'
+		'@storybook/addon-styling-webpack',
+		'@storybook/addon-svelte-csf',
+		'@storybook/addon-themes',
 	],
 	framework: {
 		name: '@storybook/sveltekit',
-		options: {}
-	}
+		options: {},
+	},
 };
-export default config;
+export default config;

.storybook/preview.css

@@ -0,0 +1,4 @@
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';
+@import '@flaticon/flaticon-uicons/css/all/all';

.storybook/preview.js

@@ -1,13 +1,28 @@
+import { withThemeByDataAttribute } from '@storybook/addon-themes';
+import './preview.css';
+
 /** @type { import('@storybook/svelte').Preview } */
 const preview = {
+	tags: ['autodocs'],
 	parameters: {
 		controls: {
 			matchers: {
 				color: /(background|color)$/i,
-				date: /Date$/i
-			}
-		}
-	}
+				date: /Date$/i,
+			},
+		},
+	},
+	decorators: [
+		withThemeByDataAttribute({
+			themes: {
+				light: 'light',
+				dark: 'dark',
+				night: 'night',
+			},
+			defaultTheme: 'dark',
+			attributeName: 'data-theme',
+		}),
+	],
 };
 
-export default preview;
+export default preview;