feat: initial commit - Band Management application

apps/admin/themeConfig.ts

@@ -0,0 +1,79 @@
+import { breakpointsVuetifyV3 } from "@vueuse/core";
+import { VIcon } from "vuetify/components/VIcon";
+import { defineThemeConfig } from "@core";
+import { Skins } from "@core/enums";
+
+// ❗ Logo SVG must be imported with ?raw suffix
+import logo from "@images/logo.svg?raw";
+
+import {
+  AppContentLayoutNav,
+  ContentWidth,
+  FooterType,
+  NavbarType,
+} from "@layouts/enums";
+
+export const { themeConfig, layoutConfig } = defineThemeConfig({
+  app: {
+    title: "Admin",
+    logo: h("div", {
+      innerHTML: logo,
+      style: "line-height:0; color: rgb(var(--v-global-theme-primary))",
+    }),
+    contentWidth: ContentWidth.Boxed,
+    contentLayoutNav: AppContentLayoutNav.Vertical,
+    overlayNavFromBreakpoint: breakpointsVuetifyV3.lg - 1, // 1 for matching with vuetify breakpoint. Docs: https://next.vuetifyjs.com/en/features/display-and-platform/
+    i18n: {
+      enable: true,
+      defaultLocale: "en",
+      langConfig: [
+        {
+          label: "English",
+          i18nLang: "en",
+          isRTL: false,
+        },
+        {
+          label: "French",
+          i18nLang: "fr",
+          isRTL: false,
+        },
+        {
+          label: "Arabic",
+          i18nLang: "ar",
+          isRTL: true,
+        },
+      ],
+    },
+    theme: "system",
+    skin: Skins.Default,
+    iconRenderer: VIcon,
+  },
+  navbar: {
+    type: NavbarType.Sticky,
+    navbarBlur: true,
+  },
+  footer: { type: FooterType.Static },
+  verticalNav: {
+    isVerticalNavCollapsed: false,
+    defaultNavItemIconProps: { icon: "tabler-circle" },
+    isVerticalNavSemiDark: false,
+  },
+  horizontalNav: {
+    type: "sticky",
+    transition: "slide-y-reverse-transition",
+    popoverOffset: 6,
+  },
+
+  /*
+  // ℹ️  In below Icons section, you can specify icon for each component. Also you can use other props of v-icon component like `color` and `size` for each icon.
+  // Such as: chevronDown: { icon: 'tabler-chevron-down', color:'primary', size: '24' },
+  */
+  icons: {
+    chevronDown: { icon: "tabler-chevron-down" },
+    chevronRight: { icon: "tabler-chevron-right", size: 20 },
+    close: { icon: "tabler-x", size: 20 },
+    verticalNavPinned: { icon: "tabler-circle-dot", size: 20 },
+    verticalNavUnPinned: { icon: "tabler-circle", size: 20 },
+    sectionTitlePlaceholder: { icon: "tabler-minus" },
+  },
+});