<template>
  <router-view />
</template>

<script setup>
import useSettingsStore from '@/store/modules/settings'
import { handleThemeStyle } from '@/utils/theme'

onMounted(() => {
  nextTick(() => {
    handleThemeStyle(useSettingsStore().theme);
  })
})
</script>
<style lang="scss">
.el-form-item__content {
  .el-select--default {
    width: 192px;
  }
}
.pagination-container {
  .el-pagination {
    right: 20px;
  }
}
.el-sub-menu__title{
  position: relative;
  .todo_num_tips{
    top:20px;
    position: absolute;
    right: 36px;
    background-color: #f56c6c;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    height: 18px;
    line-height: 18px;
    padding: 0 6px;
    text-align: center;
    white-space: nowrap;
    border: 1px solid #fff;
    cursor: pointer;
    top: 16px;
    display: none;
  }
}
.nest-menu{
  position: relative;
  .todo_num_tips{
    position: absolute;
    right: 18px;
    background-color: #f56c6c;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    height: 18px;
    line-height: 18px;
    padding: 0 6px;
    text-align: center;
    white-space: nowrap;
    border: 1px solid #fff;
    cursor: pointer;
    top: 16px;
    display: none;
  }
}   
:focus-visible {
  outline:  none !important;
} 
.command{
  cursor: pointer;
}
</style>