adjust style
cast1e
parent
be030c2ae9
commit
56ccc04f2a
|
|
@ -1,6 +1,7 @@
|
|||
use crate::reader;
|
||||
use std::path::Path;
|
||||
use std::fs;
|
||||
use serde::{Deserialize, Serialize};
|
||||
use tauri::ipc::Response;
|
||||
|
||||
#[tauri::command]
|
||||
|
|
@ -40,3 +41,16 @@ pub async fn del_folder(path: String) -> bool {
|
|||
}
|
||||
false
|
||||
}
|
||||
|
||||
#[derive(Serialize,Deserialize)]
|
||||
struct settings{
|
||||
title_bar:String,
|
||||
auto_start:bool,
|
||||
auto_pause:bool
|
||||
}
|
||||
|
||||
|
||||
#[tauri::command]
|
||||
pub async fn get_config() -> String{
|
||||
if let Ok()
|
||||
}
|
||||
|
|
@ -2,9 +2,15 @@
|
|||
<div data-tauri-drag-region class="titlebar colbox">
|
||||
<div class="titlebar-icon-wrapper colbox">
|
||||
<template v-if="mode == 'mac'">
|
||||
<div class="titlebar-button titlebar-close button-style-mac" @click="close"></div>
|
||||
<div class="titlebar-button titlebar-minimize button-style-mac" @click="minimize"></div>
|
||||
<div class="titlebar-button titlebar-maximize button-style-mac" @click="toggleMaximize"></div>
|
||||
<div class="titlebar-button titlebar-close button-style-mac" @click="close">
|
||||
<svg-icon name="window-close" :size="button_size_mac"></svg-icon>
|
||||
</div>
|
||||
<div class="titlebar-button titlebar-minimize button-style-mac" @click="minimize">
|
||||
<svg-icon name="window-minimize" :size="button_size_mac"></svg-icon>
|
||||
</div>
|
||||
<div class="titlebar-button titlebar-maximize button-style-mac" @click="toggleMaximize">
|
||||
<svg-icon name="window-maximize" :size="button_size_mac"></svg-icon>
|
||||
</div>
|
||||
</template>
|
||||
<img src="@/assets/vw.png" class="titlebar-icon">
|
||||
<div class="titlebar-icon-title">
|
||||
|
|
@ -27,7 +33,7 @@
|
|||
<div class="titlebar-button titlebar-maximize button-style-win" @click="toggleMaximize">
|
||||
<template v-if="maximized">
|
||||
<div class="titlebar-button-rect">
|
||||
<svg-icon name="window-maximized button-style-win" :size="button_size_alter"></svg-icon>
|
||||
<svg-icon name="window-maximized" :size="button_size_alter"></svg-icon>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
|
@ -60,6 +66,8 @@ type Mode = "win" | "mac";
|
|||
const maximized = ref(false);
|
||||
const button_size_default = ref("18px");
|
||||
const button_size_alter = ref("15px")
|
||||
const button_size_mac = ref("11px")
|
||||
|
||||
const props = defineProps({
|
||||
mode: {
|
||||
type: String as PropType<Mode>,
|
||||
|
|
@ -169,20 +177,43 @@ function openSettings() {
|
|||
|
||||
|
||||
.button-style-mac.titlebar-button {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
border-radius: 100%;
|
||||
margin-left: 6px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #000000b4
|
||||
}
|
||||
|
||||
.button-style-mac.titlebar-minimize {
|
||||
background-color: red;
|
||||
background: #FFBB39;
|
||||
border: 1px solid #CFA64E;
|
||||
}
|
||||
|
||||
.button-style-mac.titlebar-maximize {
|
||||
background-color: green;
|
||||
margin-right: 6px;
|
||||
background: #606060;
|
||||
border: 1px solid #656565;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.button-style-mac:hover.titlebar-maximize {
|
||||
background: #00CD4E;
|
||||
border: 1px solid #0EA642;
|
||||
}
|
||||
|
||||
.button-style-mac.titlebar-close {
|
||||
background-color: yellow;
|
||||
background: #FF5D5B;
|
||||
border: 1px solid #CF544D;
|
||||
}
|
||||
|
||||
.button-style-mac svg {
|
||||
opacity: 0;
|
||||
transition: .2s;
|
||||
}
|
||||
|
||||
.button-style-mac:hover svg {
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,30 +1,36 @@
|
|||
<template>
|
||||
<div class="settings-wrapper">
|
||||
<div class="settings-back" @click="back_home">
|
||||
<div class="settings-back colbox" @click="back_home">
|
||||
<SvgIcon name="direction-left"></SvgIcon>
|
||||
返回
|
||||
<div class="settings-back-text">返回</div>
|
||||
</div>
|
||||
<table class="settings-table">
|
||||
<tbody class="setting-table-body">
|
||||
<tr>
|
||||
<td><div class="settings-label">
|
||||
<td>
|
||||
<div class="settings-label">
|
||||
<div class="settings-label-title">标题栏样式</div>
|
||||
<div class="settings-label-subtitle">选择选题栏关闭按钮样式</div>
|
||||
</div></td>
|
||||
</div>
|
||||
</td>
|
||||
<td><el-switch></el-switch></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><div class="settings-label">
|
||||
<td>
|
||||
<div class="settings-label">
|
||||
<div class="settings-label-title">开机自启</div>
|
||||
<div class="settings-label-subtitle">开机自启</div>
|
||||
</div></td>
|
||||
</div>
|
||||
</td>
|
||||
<td><el-switch></el-switch></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><div class="settings-label">
|
||||
<td>
|
||||
<div class="settings-label">
|
||||
<div class="settings-label-title">最大化自动暂停</div>
|
||||
<div class="settings-label-subtitle">最大化自动暂停</div>
|
||||
</div></td>
|
||||
</div>
|
||||
</td>
|
||||
<td><el-switch></el-switch></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
|
@ -56,6 +62,7 @@ function back_home() {
|
|||
padding-right: 30px;
|
||||
width: calc(100% - 60px);
|
||||
}
|
||||
|
||||
.settings-back {
|
||||
color: var(--text-color);
|
||||
padding: 8px;
|
||||
|
|
@ -79,7 +86,9 @@ function back_home() {
|
|||
margin-left: 40px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
.settings-table td,th{
|
||||
|
||||
.settings-table td,
|
||||
th {
|
||||
padding: 5px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
|
@ -95,4 +104,10 @@ function back_home() {
|
|||
font-weight: 300;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.settings-back-text {
|
||||
transform: translateY(-3px);
|
||||
margin-left: 4px;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue