feat(UI): add PrimeVue and TailwindCSS for UI components

src/main.ts

@@ -1,6 +1,17 @@
 import { createApp } from 'vue';
+import PrimeVue from 'primevue/config';
+import Lara from '@primeuix/themes/lara';
 
+import 'primeicons/primeicons.css';
 import './style.css';
+import './style.less';
 import App from './App.vue';
 
-createApp(App).mount('#app');
+const app = createApp(App);
+app.use(PrimeVue, {
+  theme: {
+    preset: Lara,
+  },
+  ripple: true,
+});
+app.mount('#app');

src/style.css

@@ -0,0 +1,86 @@
+@import url('https://fonts.googleapis.com/css?family=Plus%20Jakarta%20Sans:700|Noto%20Sans:400');
+
+@import "tailwindcss";
+
+
+@theme {
+  --font-jakarta: Plus Jakarta Sans, sans-serif;
+  --font-heading: Plus Jakarta Sans, sans-serif;
+  --font-noto: Noto Sans, sans-serif;
+  --font-body: Noto Sans, sans-serif;
+  --font-normal: 400;
+  --font-bold: 700;
+  --text-sm: 0.750rem;
+  --text-base: 1rem;
+  --text-xl: 1.333rem;
+  --text-2xl: 1.777rem;
+  --text-3xl: 2.369rem;
+  --text-4xl: 3.158rem;
+  --text-5xl: 4.210rem;
+
+  --color-text: oklch(13.42% 0.025 277.52);
+  --color-text-50: oklch(13.49% 0.027 277.57);
+  --color-text-100: oklch(18.12% 0.047 276.94);
+  --color-text-200: oklch(26.14% 0.086 274.25);
+  --color-text-300: oklch(33.63% 0.119 273.77);
+  --color-text-400: oklch(40.55% 0.152 273.78);
+  --color-text-500: oklch(47.37% 0.181 273.51);
+  --color-text-600: oklch(57.68% 0.143 277.26);
+  --color-text-700: oklch(68.53% 0.103 278.92);
+  --color-text-800: oklch(79.24% 0.067 280.95);
+  --color-text-900: oklch(89.69% 0.031 281.79);
+  --color-text-950: oklch(94.88% 0.016 282.27);
+
+  --color-background: oklch(98.32% 0.005 286.30);
+  --color-background-50: oklch(13.12% 0.030 281.49);
+  --color-background-100: oklch(17.61% 0.050 279.92);
+  --color-background-200: oklch(25.07% 0.093 277.28);
+  --color-background-300: oklch(32.27% 0.129 276.41);
+  --color-background-400: oklch(39.10% 0.162 275.91);
+  --color-background-500: oklch(45.65% 0.193 275.59);
+  --color-background-600: oklch(56.14% 0.154 280.23);
+  --color-background-700: oklch(67.14% 0.113 282.93);
+  --color-background-800: oklch(78.44% 0.072 284.61);
+  --color-background-900: oklch(89.30% 0.034 285.69);
+  --color-background-950: oklch(94.69% 0.017 286.06);
+
+  --color-primary: oklch(47.97% 0.175 276.79);
+  --color-primary-50: oklch(13.64% 0.027 282.25);
+  --color-primary-100: oklch(17.88% 0.046 280.64);
+  --color-primary-200: oklch(25.68% 0.085 277.64);
+  --color-primary-300: oklch(32.98% 0.118 277.13);
+  --color-primary-400: oklch(39.93% 0.151 276.24);
+  --color-primary-500: oklch(46.58% 0.180 276.13);
+  --color-primary-600: oklch(57.13% 0.142 279.97);
+  --color-primary-700: oklch(68.02% 0.103 282.69);
+  --color-primary-800: oklch(78.84% 0.066 283.81);
+  --color-primary-900: oklch(89.54% 0.031 285.75);
+  --color-primary-950: oklch(94.66% 0.016 286.09);
+
+  --color-secondary: oklch(70.78% 0.104 302.18);
+  --color-secondary-50: oklch(14.31% 0.027 303.00);
+  --color-secondary-100: oklch(18.93% 0.046 300.07);
+  --color-secondary-200: oklch(27.46% 0.086 298.89);
+  --color-secondary-300: oklch(35.53% 0.118 298.36);
+  --color-secondary-400: oklch(43.08% 0.151 298.00);
+  --color-secondary-500: oklch(50.51% 0.179 298.28);
+  --color-secondary-600: oklch(60.08% 0.145 300.36);
+  --color-secondary-700: oklch(70.18% 0.106 301.86);
+  --color-secondary-800: oklch(80.18% 0.070 302.91);
+  --color-secondary-900: oklch(90.24% 0.032 303.45);
+  --color-secondary-950: oklch(95.04% 0.017 304.80);
+
+  --color-accent: oklch(66.24% 0.137 313.05);
+  --color-accent-50: oklch(14.75% 0.029 314.19);
+  --color-accent-100: oklch(19.76% 0.049 312.79);
+  --color-accent-200: oklch(29.04% 0.090 311.91);
+  --color-accent-300: oklch(37.77% 0.123 311.83);
+  --color-accent-400: oklch(45.96% 0.157 311.53);
+  --color-accent-500: oklch(53.87% 0.186 311.54);
+  --color-accent-600: oklch(62.58% 0.152 312.52);
+  --color-accent-700: oklch(71.89% 0.112 313.25);
+  --color-accent-800: oklch(81.23% 0.074 313.55);
+  --color-accent-900: oklch(90.72% 0.035 314.09);
+  --color-accent-950: oklch(95.28% 0.018 314.73);
+
+}