slibra-module-web/src/App.vue

<script setup lang="ts">
import { RouterView } from 'vue-router';
import { NConfigProvider, NMessageProvider, zhCN, dateZhCN } from 'naive-ui';
import type { GlobalThemeOverrides } from 'naive-ui';

const primaryColor = '#1A2029';

/**
 * @type import('naive-ui').GlobalThemeOverrides
 */
const themeOverrides: GlobalThemeOverrides = {
  common: {
    primaryColor: '#2454FF',
    primaryColorHover: '#2454FF',
    primaryColorPressed: '#2454FF',
    tableHeaderColor: '#F3F6F9',
  },
  Menu: {
    itemTextColor: primaryColor,
    itemTextColorActive: primaryColor,
    itemTextColorActiveHover: primaryColor,
    itemTextColorChildActiveHover: primaryColor,
    itemTextColorChildActive: primaryColor,
    itemColorActive: '#FCFDFE',
    itemColorActiveHover: '#FCFDFE',
    arrowColorChildActive: primaryColor
  },
  Scrollbar: {
    width: '2px',
  },
  Select: {
    peers: {
      InternalSelection: {
        textColor: '#5E5E5E',
        borderHover: '1px solid #2454FF',
        borderFocus: '1px solid #2454FF',
        placeholderColor: '#ccc',
        borderRadius: '8px'
      }
    },
  },
  Input: {
    border: '0px',
    borderHover: '0px',
    borderFocus: '0px',
    borderFocusWarning: '0px',
    boxShadowFocus: 'none',
    fontSizeMedium: '15px',
    textColor: '#1A2029',
    placeholderColor: 'rgba(158, 158, 158, 0.6)',
  },
  Tabs: {
    tabBorderColor: '#DAE5ED',
    tabFontSizeMedium: '12px',
    tabTextColorLine: '#272D35',
    tabFontWeightActive: 'bold'
  },
  LoadingBar: {
    colorLoading: '#000',
  },
  Button: {
    colorHoverPrimary: '#1D43CC',
    colorPressedPrimary: '#1D43CC',
    borderPressedPrimary: '#1D43CC',
  },
}

</script>

<template>
  <NConfigProvider :theme-overrides="themeOverrides" :locale="zhCN" :date-locale="dateZhCN">
    <NMessageProvider>
      <RouterView />
    </NMessageProvider>
  </NConfigProvider>
</template>