Add vuestic

This commit is contained in:
2025-09-06 23:01:36 +02:00
parent e5e9bfa14a
commit 1be0affff3
7 changed files with 792 additions and 7 deletions
+746 -2
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>TramTrack</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
+5 -1
View File
@@ -17,9 +17,13 @@
"check:all": "run-p lint check type-check" "check:all": "run-p lint check type-check"
}, },
"dependencies": { "dependencies": {
"@tailwindcss/vite": "^4.1.13",
"@vuestic/tailwind": "^0.1.5",
"pinia": "^3.0.3", "pinia": "^3.0.3",
"tailwind": "^4.0.0",
"vue": "^3.5.18", "vue": "^3.5.18",
"vue-router": "^4.5.1" "vue-router": "^4.5.1",
"vuestic-ui": "^1.10.3"
}, },
"devDependencies": { "devDependencies": {
"@tsconfig/node22": "^22.0.2", "@tsconfig/node22": "^22.0.2",
+26
View File
@@ -0,0 +1,26 @@
@import 'https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;1,700&display=swap';
@import 'https://fonts.googleapis.com/icon?family=Material+Icons';
@import 'tailwindcss';
@theme {
--breakpoint-xs: 0px;
--breakpoint-sm: 640px;
--breakpoint-md: 1024px;
--breakpoint-lg: 1440px;
--breakpoint-xl: 1920px;
--color-primary: #154ec1;
--color-secondary: #767c88;
--color-success: #3d9209;
--color-info: #158de3;
--color-danger: #e42222;
--color-warning: #ffd43a;
--color-backgroundPrimary: #f6f6f6;
--color-backgroundSecondary: #ffffff;
--color-backgroundElement: #ecf0f1;
--color-backgroundBorder: #dee5f2;
--color-textPrimary: #262824;
--color-textInverted: #ffffff;
--color-shadow: rgba(0, 0, 0, 0.12);
--color-focus: #49a8ff;
--color-transparent: rgba(0, 0, 0, 0);
}
+5
View File
@@ -1,12 +1,17 @@
import { createPinia } from 'pinia'; import { createPinia } from 'pinia';
import { createApp } from 'vue'; import { createApp } from 'vue';
import { createVuestic } from 'vuestic-ui';
import 'vuestic-ui/styles/essential.css';
import 'vuestic-ui/styles/typography.css';
import App from './App.vue'; import App from './App.vue';
import './main.css';
import router from './router'; import router from './router';
const app = createApp(App); const app = createApp(App);
app.use(createPinia()); app.use(createPinia());
app.use(router); app.use(router);
app.use(createVuestic());
app.mount('#app'); app.mount('#app');
+7 -2
View File
@@ -1,5 +1,10 @@
<script setup lang="ts"></script> <script setup lang="ts">
import { VaButton } from 'vuestic-ui';
</script>
<template><h1>home</h1></template> <template>
<h1 class="text-3xl text-red-500">home</h1>
<VaButton icon="home" />
</template>
<style scoped></style> <style scoped></style>
+2 -1
View File
@@ -1,5 +1,6 @@
import { fileURLToPath, URL } from 'node:url'; import { fileURLToPath, URL } from 'node:url';
import tailwindcss from '@tailwindcss/vite';
import vue from '@vitejs/plugin-vue'; import vue from '@vitejs/plugin-vue';
import { defineConfig } from 'vite'; import { defineConfig } from 'vite';
import vueDevTools from 'vite-plugin-vue-devtools'; import vueDevTools from 'vite-plugin-vue-devtools';
@@ -7,7 +8,7 @@ import vueDevTools from 'vite-plugin-vue-devtools';
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
base: process.env.BASE || '/', base: process.env.BASE || '/',
plugins: [vue(), vueDevTools()], plugins: [vue(), tailwindcss(), vueDevTools()],
resolve: { resolve: {
alias: { alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)) '@': fileURLToPath(new URL('./src', import.meta.url))