[UI] add file custom style for theme

backend/repos/seeder/init_users.py

@@ -18,6 +18,13 @@ def dev_users() -> list[dict]:
       "is_admin": True,
       "is_lock": False,
     },
+    {
+      "username": "duy",
+      "password": "admin",
+      "name": "Duy",
+      "is_admin": True,
+      "is_lock": False,
+    },
     {
       "username": "sam1",
       "password": "admin",

frontend/package.json

@@ -31,6 +31,7 @@
     "lint-staged": "15.2.2",
     "postcss": "^8.4.38",
     "prettier": "3.2.5",
+    "sass": "^1.77.4",
     "tailwindcss": "^3.4.3",
     "vite": "^5.2.0",
     "vite-plugin-mkcert": "^1.17.5",

frontend/src/App.jsx

@@ -1,6 +1,6 @@
 import { MetaProvider } from '@solidjs/meta'
 import { Toaster } from 'solid-toast'
-import './App.css'
+// import './App.css'
 import { SiteContextProvider } from './context/SiteContext'
 
 function App(props) {

frontend/src/components/Navbar.jsx

@@ -49,7 +49,7 @@ export default function Navbar() {
             <IconTriangle size={30} />
           </div>
         </Show>
-        <ul class="menu p-4 w-80 text-base-content">
+        <ul class="scrollnavbar menu p-4 w-80 text-base-content bg-transparent py-6 px-4">
           <For each={NAV_ROUTES}>
             {(item) =>
               item.show && (

frontend/src/index.jsx

@@ -5,6 +5,7 @@ import { render } from 'solid-js/web'
 import App from './App'
 import './index.css'
 import { ROUTES } from './routes'
+import './styles/fuware.scss'
 
 const root = document.getElementById('root')
 

frontend/src/lang/vi.json

@@ -5,7 +5,8 @@
     "login": "Đăng Nhập",
     "logout": "Đăng xuất",
     "dashboard": "Bảng điều khiển",
-    "profile": "Hồ sơ"
+    "profile": "Hồ sơ",
+    "houses": "Kho"
   },
   "message": {
     "CREATED_USER": "Username already registered!",

frontend/src/pages/WareHouse.jsx

@@ -0,0 +1,14 @@
+import { NAV_ROUTES } from '@routes/routes'
+import { useNavigate } from '@solidjs/router'
+import { onMount } from 'solid-js'
+
+export default function WareHouse() {
+  const navigate = useNavigate()
+
+  onMount(() => {
+    const first = NAV_ROUTES.filter((item) => item.show)[0]?.path || '/me'
+    navigate(first, { replace: true })
+  })
+
+  return <></>
+}

frontend/src/routes/routes.js

@@ -25,6 +25,14 @@ export const NAV_ROUTES = [
     icon: IconDashboard,
     text: language?.ui.profile,
   },
+  {
+    path: '/ware-house',
+    components: lazy(() => import('@pages/WareHouse')),
+    filter: {},
+    show: true,
+    icon: IconDashboard,
+    text: language?.ui.houses,
+  },
 ]
 
 export const ROUTES = [

frontend/src/styles/fuware.scss

@@ -0,0 +1,22 @@
+$color-white: #fff;
+$color-black: #212121;
+$primary: #03c9d7;
+
+.menu  {
+  li {
+    a {
+      color: $color-black;
+      font-weight: normal;
+
+      &:not(ul, .menu-title, details, .btn).active {
+        background-color: $primary;
+        color: $color-white;
+      }
+
+      &:hover {
+        background-color: rgba($primary, 0.05);
+        color: $primary;
+      }
+    }
+  }
+}

frontend/tailwind.config.js

@@ -7,4 +7,16 @@ export default {
     extend: {},
   },
   plugins: [daisyui],
+  daisyui: {
+    themes: [
+      {
+        light: {
+          primary: '#03c9d7',
+          'primary-content': '#ffff',
+          secondary: '#fb9678',
+          'secondary-content': '#ffff',
+        },
+      },
+    ],
+  },
 }