<template>
  <n-config-provider
    :theme-overrides="themeOverrides"
    :locale="zhCN"
    :date-locale="dateZhCN"
  >
    <div id="main">
      <Main />
    </div>
    <m-loader v-if="showLoading" />
  </n-config-provider>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import { NConfigProvider, GlobalThemeOverrides, zhCN, dateZhCN } from 'naive-ui'
import Main from './view/main.vue'
import store from '@/store'

const showLoading = computed(() => store.state.showLoading)
const themeOverrides: GlobalThemeOverrides = {
  common: {
    primaryColor: '#dd505E',
    fontSize: '0.1rem',
  },
  Input: {
    borderFocus: '#FCF4F5',
    iconSize: '0.14rem',
  },
  Checkbox: {
    textColor: '#6E798C',
  },
}
</script>

<style lang="stylus">
@font-face
  font-family DIN
  src url(./assets/font/DIN-Medium.otf)
@font-face
  font-family PingFang
  src url(./assets/font/PingFang.ttf)
@font-face
  font-family PingFangMedium
  src url(./assets/font/PingFangMedium.ttf)

html, body
  background #000
  font-family PingFang, DIN, Avenir, Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  -moz-osx-font-smoothing grayscale
  width 100%
  height 100%
  user-select none
  font-size 15.8vh
  line-height 1.5
  overflow hidden
  p
    margin 0
#app
  width 100%
  height 100%
  overflow hidden
  font-size .1rem
  background url('/src/assets/images/background.jpg') center/cover no-repeat
  color #000

/* 设置滚动条的样式 */
::-webkit-scrollbar
  width .04rem

/* 滚动条滑块 */
::-webkit-scrollbar-thumb
  background rgba(221, 80, 94, 0.5)
  -webkit-box-shadow inset006pxrgba(0,0,0,0.5)

::-webkit-scrollbar-thumb:window-inactive
  background rgba(221, 80, 94, 0.5)
</style>
