feat(gui-v2): add windicss

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

packages/nc-gui-v2/app.vue

@@ -1,3 +1,4 @@
+
 <template>
   <NuxtPage />
 </template>

packages/nc-gui-v2/assets/style.css

@@ -1,3 +1,7 @@
+html, body {
+  @apply scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-green-500 scrollbar-track-black;
+}
+
 .shake-btn {
   color: red !important;
   animation: shake .4s;

packages/nc-gui-v2/nuxt.config.ts

@@ -2,6 +2,7 @@ import path from 'path'
 import { defineNuxtConfig } from 'nuxt'
 import vueI18n from '@intlify/vite-plugin-vue-i18n'
 import Icons from 'unplugin-icons/vite'
+import WindiCSS from 'vite-plugin-windicss'
 
 // https://v3.nuxtjs.org/api/configuration/nuxt.config
 export default defineNuxtConfig({

packages/nc-gui-v2/package.json

@@ -7,26 +7,27 @@
     "preview": "nuxt preview",
     "lint": "eslint --ext \".js,.jsx,.ts,.tsx,.vue\" --fix --ignore-path .gitignore ."
   },
+  "dependencies": {
+    "@vueuse/core": "^8.7.5",
+    "nocodb-sdk": "file:../nocodb-sdk",
+    "socket.io-client": "^4.5.1",
+    "vue-i18n": "^9.1.10",
+    "vue-toastification": "^2.0.0-rc.5",
+    "vuetify": "^3.0.0-alpha.13"
+  },
   "devDependencies": {
     "@antfu/eslint-config": "^0.25.2",
     "@iconify-json/material-symbols": "^1.1.8",
     "@intlify/vite-plugin-vue-i18n": "^4.0.0",
     "@vue/compiler-sfc": "^3.2.37",
     "@vueuse/nuxt": "^8.6.0",
-    "nuxt": "3.0.0-rc.4",
-    "sass": "^1.53.0",
-    "unplugin-icons": "^0.14.7"
-  },
-  "dependencies": {
-    "@vueuse/core": "^8.7.5",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.0.0",
-    "nocodb-sdk": "file:../nocodb-sdk",
+    "nuxt": "3.0.0-rc.4",
-    "nuxt3-store": "^1.0.0",
     "prettier": "^2.7.1",
-    "socket.io-client": "^4.5.1",
+    "sass": "^1.53.0",
-    "vue-i18n": "^9.1.10",
+    "unplugin-icons": "^0.14.7",
-    "vue-toastification": "^2.0.0-rc.5",
+    "vite-plugin-windicss": "^1.8.6",
-    "vuetify": "^3.0.0-alpha.13"
+    "windicss": "^3.5.6"
   }
 }

packages/nc-gui-v2/plugins/api.ts

@@ -1,5 +1,5 @@
 import { Api } from 'nocodb-sdk'
-import { defineNuxtPlugin } from 'nuxt3/app'
+import { defineNuxtPlugin } from '#app'
 
 export default defineNuxtPlugin((nuxtApp) => {
   const api = new Api({

packages/nc-gui-v2/plugins/state.ts

@@ -1,4 +1,4 @@
-import { defineNuxtPlugin } from 'nuxt3/app'
+import { defineNuxtPlugin } from '#app'
 import { useGlobalState } from '~/composables/useGlobalState'
 
 export default defineNuxtPlugin((nuxtApp) => {

packages/nc-gui-v2/tsconfig.json

@@ -12,7 +12,7 @@
     "forceConsistentCasingInFileNames": true,
     "types": ["@intlify/vite-plugin-vue-i18n/client", "vue-i18n", "unplugin-icons/types/vue"]
   },
-  "files": ["nuxt-shim.d.ts"],
+  "files": ["nuxt-shim.d.ts", "windi.config.ts"],
   "exclude": [
     "node_modules",
     "dist"

packages/nc-gui-v2/utils/colorsUtils.ts

@@ -1,17 +1,5 @@
 export default {
-  light: [
+  light: ['#ffdce5', '#fee2d5', '#ffeab6', '#d1f7c4', '#ede2fe', '#eee', '#cfdffe', '#d0f1fd', '#c2f5e8', '#ffdaf6'],
-
-    '#ffdce5',
-    '#fee2d5',
-    '#ffeab6',
-    '#d1f7c4',
-    '#ede2fe',
-    '#eee',
-    '#cfdffe',
-    '#d0f1fd',
-    '#c2f5e8',
-    '#ffdaf6',
-  ],
   dark: [
     '#f82b6099',
     '#ff6f2c99',
@@ -27,18 +15,7 @@ export default {
 }
 
 const enumColor = {
-  light: [
+  light: ['#cfdffe', '#d0f1fd', '#c2f5e8', '#ffdaf6', '#ffdce5', '#fee2d5', '#ffeab6', '#d1f7c4', '#ede2fe', '#eeeeee'],
-    '#cfdffe',
-    '#d0f1fd',
-    '#c2f5e8',
-    '#ffdaf6',
-    '#ffdce5',
-    '#fee2d5',
-    '#ffeab6',
-    '#d1f7c4',
-    '#ede2fe',
-    '#eeeeee',
-  ],
   dark: [
     '#2d7ff999',
     '#18bfff99',
@@ -53,6 +30,4 @@ const enumColor = {
   ],
 }
 
-export {
+export { enumColor }
-  enumColor,
-}