|
|
@@ -248,62 +248,6 @@ const closePopover = () => {
|
|
|
</template>
|
|
|
</el-popover>
|
|
|
|
|
|
- <el-popover
|
|
|
- placement="bottom-end"
|
|
|
- :width="400"
|
|
|
- trigger="click"
|
|
|
- ref="themePopoverRef"
|
|
|
- popper-class="toggle-theme-popover"
|
|
|
- >
|
|
|
- <div>
|
|
|
- <div class="header">
|
|
|
- <span class="title">Themes</span>
|
|
|
- <el-button @click="themePopoverRef.hide()" class="close-icon el-button--text">
|
|
|
- <div class="font_family icon-icon_reject_b"></div>
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- <div class="tips">
|
|
|
- Customize your workspace by changing the appearance and theme color
|
|
|
- </div>
|
|
|
- <div class="picture-module">
|
|
|
- <div class="item" :class="{ active: themeStore.theme === 'light' }">
|
|
|
- <img src="./images/light.png" alt="" />
|
|
|
- <div v-if="themeStore.theme === 'light'" class="selected-icon">
|
|
|
- <span class="font_family icon-icon_confirm_b"></span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item" :class="{ active: themeStore.theme === 'dark' }">
|
|
|
- <img src="./images/dark.png" alt="" />
|
|
|
- <div v-if="themeStore.theme === 'dark'" class="selected-icon">
|
|
|
- <span class="font_family icon-icon_confirm_b"></span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="btn-module">
|
|
|
- <div
|
|
|
- class="btn-item"
|
|
|
- @click="toggleThemeMode('light')"
|
|
|
- :class="{ active: themeStore.theme === 'light' }"
|
|
|
- >
|
|
|
- <span class="font_family icon-icon_light_b"></span>
|
|
|
- Light
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="btn-item"
|
|
|
- @click="toggleThemeMode('dark')"
|
|
|
- :class="{ active: themeStore.theme === 'dark' }"
|
|
|
- >
|
|
|
- <span class="font_family icon-icon_dark_b"></span>Dark
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <template #reference>
|
|
|
- <el-button style="height: 40px; width: 40px" class="el-button--text">
|
|
|
- <span class="font_family icon-icon_themes_b" style="font-size: 16px"></span
|
|
|
- ></el-button>
|
|
|
- </template>
|
|
|
- </el-popover>
|
|
|
-
|
|
|
<el-popover
|
|
|
placement="bottom-end"
|
|
|
:width="256"
|
|
|
@@ -551,4 +495,4 @@ div.el-popover.el-popper.user-config-popover {
|
|
|
div.el-popper.theme-popper-class {
|
|
|
padding: 3px 4px;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|