Add vuestic
This commit is contained in:
+1
-1
@@ -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
@@ -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",
|
||||||
|
|||||||
@@ -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);
|
||||||
|
}
|
||||||
@@ -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');
|
||||||
|
|||||||
@@ -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
@@ -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))
|
||||||
|
|||||||
Reference in New Issue
Block a user