From 890eb55d274a7be1c57e3fa2a27465a03fde715e Mon Sep 17 00:00:00 2001 From: Hayden <64056131+hay-kot@users.noreply.github.com> Date: Tue, 30 Aug 2022 21:22:32 -0800 Subject: [PATCH] update styles --- frontend/components.d.ts | 6 +- frontend/index.html | 48 +++----- frontend/src/pages/home.vue | 76 ++++++++++-- frontend/tsconfig.json | 64 +++++----- frontend/vite.config.ts | 237 +++++++++++++++++------------------- 5 files changed, 235 insertions(+), 196 deletions(-) diff --git a/frontend/components.d.ts b/frontend/components.d.ts index 50c0ff9..8c99ec1 100644 --- a/frontend/components.d.ts +++ b/frontend/components.d.ts @@ -8,14 +8,12 @@ export {} declare module '@vue/runtime-core' { export interface GlobalComponents { AppHeader: typeof import('./src/components/AppHeader.vue')['default'] - Icon: typeof import('./src/components/Icon.vue')['default'] + AppToast: typeof import('./src/components/App/Toast.vue')['default'] + FormTextField: typeof import('./src/components/Form/TextField.vue')['default'] 'Icon:bx:bxMoon': typeof import('~icons/bx/bx-moon')['default'] 'Icon:bx:bxsMoon': typeof import('~icons/bx/bxs-moon')['default'] 'IconAkarIcons:githubFill': typeof import('~icons/akar-icons/github-fill')['default'] - Notifier: typeof import('./src/components/App/Notifier.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] - TextField: typeof import('./src/components/Form/TextField.vue')['default'] - Toast: typeof import('./src/components/App/Toast.vue')['default'] } } diff --git a/frontend/index.html b/frontend/index.html index 738c036..63af3c8 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -1,34 +1,20 @@ - - - - - - Vitailse | Opinionated vite starter template with TailwindCSS - + + + + + Vitailse | Opinionated vite starter template with TailwindCSS - - - - - - - - - -
- - + + + + + + + + + +
+ + diff --git a/frontend/src/pages/home.vue b/frontend/src/pages/home.vue index 5109a92..3d89e8a 100644 --- a/frontend/src/pages/home.vue +++ b/frontend/src/pages/home.vue @@ -1,6 +1,8 @@ diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json index b6c0a56..a4c87e8 100644 --- a/frontend/tsconfig.json +++ b/frontend/tsconfig.json @@ -1,34 +1,34 @@ { - "compilerOptions": { - "target": "esnext", - "useDefineForClassFields": true, - "module": "esnext", - "moduleResolution": "node", - "strict": true, - "jsx": "preserve", - "sourceMap": true, - "resolveJsonModule": true, - "esModuleInterop": true, - "lib": ["esnext", "dom"], - "baseUrl": ".", - "paths": { - "@/*": ["src/*"] - }, - "types": [ - "vite/client", - "vite-plugin-vue-layouts/client", - "unplugin-icons/types/vue", - "vite-plugin-pwa/client", - "@intlify/vite-plugin-vue-i18n/client" - ] - }, - "include": [ - "src/**/*.ts", - "src/**/*.d.ts", - "src/**/*.tsx", - "src/**/*.vue", - "components.d.ts", - "auto-imports.d.ts", - "typed-router.d.ts" - ] + "compilerOptions": { + "target": "esnext", + "useDefineForClassFields": true, + "module": "esnext", + "moduleResolution": "node", + "strict": true, + "jsx": "preserve", + "sourceMap": true, + "resolveJsonModule": true, + "esModuleInterop": true, + "lib": ["esnext", "dom"], + "baseUrl": ".", + "paths": { + "@/*": ["src/*"] + }, + "types": [ + "vite/client", + "vite-plugin-vue-layouts/client", + "unplugin-icons/types/vue", + "vite-plugin-pwa/client", + "@intlify/vite-plugin-vue-i18n/client" + ] + }, + "include": [ + "src/**/*.ts", + "src/**/*.d.ts", + "src/**/*.tsx", + "src/**/*.vue", + "components.d.ts", + "auto-imports.d.ts", + "typed-router.d.ts" + ] } diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 045f9ba..ee6d191 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -13,128 +13,121 @@ import VueRouter from 'unplugin-vue-router/vite'; import { VueRouterExports } from 'unplugin-vue-router'; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [ - vue(), - VueRouter({ - dts: true, - routesFolder: 'src/pages', - }), - Components({ - dts: true, - resolvers: [ - IconsResolver({ - prefix: 'icon', - }), - ], - }), - Icons({ - compiler: 'vue3', - }), - AutoImport({ - dts: true, - // targets to transform - include: [ - /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx - /\.vue\??/, // .vue - ], + plugins: [ + vue(), + VueRouter({ + dts: true, + routesFolder: 'src/pages', + }), + Components({ + dts: true, + dirs: ['src/components'], + directoryAsNamespace: true, + resolvers: [ + IconsResolver({ + prefix: 'icon', + }), + ], + }), + Icons({ + compiler: 'vue3', + }), + AutoImport({ + dts: true, + // targets to transform + include: [ + /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx + /\.vue\??/, // .vue + ], + dirs: ['./composables'], - // global imports to register - imports: [ - // presets - 'vue', - { '@vue-router': VueRouterExports }, - 'vue-i18n', - '@vueuse/core', - '@vueuse/head', - // custom - ], + // global imports to register + imports: [ + // presets + 'vue', + { '@vue-router': VueRouterExports }, + 'vue-i18n', + '@vueuse/core', + '@vueuse/head', + // custom + ], - // custom resolvers - // see https://github.com/antfu/unplugin-auto-import/pull/23/ - resolvers: [], - }), - Layouts(), - VitePWA({ - includeAssets: [ - 'favicon-16x16.png', - 'favicon-32x32.png', - 'favicon.ico', - 'robots.txt', - 'apple-touch-icon.png', - ], - manifest: { - name: 'Vitailse', - short_name: 'Vitailse', - description: 'Opinionated vite template with TailwindCSS', - theme_color: '#076AE0', - icons: [ - { - src: 'pwa-192x192.png', - sizes: '192x192', - type: 'image/png', - }, - { - src: 'pwa-512x512.png', - sizes: '512x512', - type: 'image/png', - }, - { - src: 'pwa-512x512.png', - sizes: '512x512', - type: 'image/png', - purpose: 'any maskable', - }, - ], - }, - }), - VueI18n({ - runtimeOnly: true, - compositionOnly: true, - include: [resolve(__dirname, 'locales/**')], - }), - ], - resolve: { - alias: { - '@': resolve(__dirname, './src'), - }, - }, - server: { - fs: { - strict: true, - }, - proxy: { - '/api': { - target: 'http://localhost:7745', - }, - }, - }, - optimizeDeps: { - include: ['vue', 'vue-router', '@vueuse/core', '@vueuse/head'], - }, - // @ts-ignore - ssgOptions: { - script: 'async', - formatting: 'minify', - format: 'cjs', - onFinished() { - generateSitemap(); - }, - mock: true, - }, - // https://github.com/vitest-dev/vitest - test: { - include: [ - 'src/__test__/**/*.test.ts', - 'src/**/*.test.ts', - 'src/__test__/**/*.spec.ts', - ], - environment: 'jsdom', - deps: { - inline: ['@vue', '@vueuse', 'vue-demi'], - }, - }, - ssr: { - // TODO: workaround until they support native ESM - noExternal: ['workbox-window', /vue-i18n/], - }, + // custom resolvers + // see https://github.com/antfu/unplugin-auto-import/pull/23/ + resolvers: [], + }), + Layouts(), + VitePWA({ + includeAssets: ['favicon-16x16.png', 'favicon-32x32.png', 'favicon.ico', 'robots.txt', 'apple-touch-icon.png'], + manifest: { + name: 'Vitailse', + short_name: 'Vitailse', + description: 'Opinionated vite template with TailwindCSS', + theme_color: '#076AE0', + icons: [ + { + src: 'pwa-192x192.png', + sizes: '192x192', + type: 'image/png', + }, + { + src: 'pwa-512x512.png', + sizes: '512x512', + type: 'image/png', + }, + { + src: 'pwa-512x512.png', + sizes: '512x512', + type: 'image/png', + purpose: 'any maskable', + }, + ], + }, + }), + VueI18n({ + runtimeOnly: true, + compositionOnly: true, + include: [resolve(__dirname, 'locales/**')], + }), + ], + resolve: { + alias: { + '@': resolve(__dirname, './src'), + }, + }, + server: { + fs: { + strict: true, + }, + proxy: { + '/api': { + target: 'http://localhost:7745', + }, + }, + }, + optimizeDeps: { + include: ['vue', 'vue-router', '@vueuse/core', '@vueuse/head'], + }, + // @ts-ignore + ssgOptions: { + script: 'async', + formatting: 'minify', + format: 'cjs', + onFinished() { + generateSitemap(); + }, + mock: true, + }, + // https://github.com/vitest-dev/vitest + test: { + include: ['src/__test__/**/*.test.ts', 'src/**/*.test.ts', 'src/__test__/**/*.spec.ts'], + environment: 'jsdom', + deps: { + inline: ['@vue', '@vueuse', 'vue-demi'], + }, + }, + ssr: { + // TODO: workaround until they support native ESM + noExternal: ['workbox-window', /vue-i18n/], + }, });