mirror of
https://github.com/marktext/marktext.git
synced 2025-05-02 07:00:23 +08:00
4bd22b6dc5
* dynamic change element-ui theme to our themeColor * add some ui components * add preference doc * add json schema file * update preference.json and schema.json * reset to old commit * rename preference file for rebase * rebase develop * add setting window * user electron-store to store preferences * add themes setting * add select component * add markdown pref * fix: bool and select init value * add font size setting * editor pref * add general preference * search preference * update menu after preference changed * update muya codes * prevent scale setting window * fix: titlebar undefined * update input style * remove window from windowManager after close setting window * remove old docs and preference.md * if a setting window is already created, no need to create another one, just move it to top * rename openFilesInNewWindow to openFileInNewWindow * change aidou runtime * change hideQuickInsertHint by setting page runtime * change autopair runtime * change codefont and codefontfamily dynamic * change default value of autoSave to false * update bulletListMarker * fix style error * add custom titlebar to settings window * add window shadow for Linux and Windows * fix Windows build * fix some typo error * update doc * add default menu and setting menu * fix update menu bug * fix typo * remove mac titlebarstyle * do not need to send titlebarstyle to renderer * fix typo * crash Mark Text if no initial preference.json file * update the path * add showCustomTitleBar prop * set empty settings menu on Linux/Windows + workaround
94 lines
1.8 KiB
Vue
94 lines
1.8 KiB
Vue
<template>
|
|
<section class="pref-switch-item" :class="{'ag-underdevelop': disable}">
|
|
<div class="description">
|
|
<span>{{description}}</span>
|
|
<i class="el-icon-info" v-if="more"
|
|
@click="handleMoreClick"
|
|
></i>
|
|
</div>
|
|
<el-switch
|
|
style="display: block"
|
|
v-model="status"
|
|
@change="handleSwitchChange"
|
|
:active-text="status ? 'On': 'Off'">
|
|
</el-switch>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import { shell } from 'electron'
|
|
|
|
export default {
|
|
data () {
|
|
return {
|
|
status: this.bool
|
|
}
|
|
},
|
|
props: {
|
|
description: String,
|
|
bool: Boolean,
|
|
onChange: Function,
|
|
more: String,
|
|
disable: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
watch: {
|
|
bool: function (value, oldValue) {
|
|
if (value !== oldValue) {
|
|
this.status = value
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
handleMoreClick () {
|
|
if (typeof this.more === 'string') {
|
|
shell.openExternal(this.more)
|
|
}
|
|
},
|
|
handleSwitchChange (value) {
|
|
this.onChange(value)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.pref-switch-item {
|
|
font-size: 14px;
|
|
user-select: none;
|
|
margin: 20px 0;
|
|
color: var(--editorColor);
|
|
}
|
|
.pref-switch-item .description {
|
|
margin-bottom: 10px;
|
|
& i {
|
|
cursor: pointer;
|
|
opacity: .7;
|
|
color: var(--iconColor);
|
|
}
|
|
& i:hover {
|
|
color: var(--themeColor);
|
|
}
|
|
}
|
|
span.el-switch__core::after {
|
|
top: 3px;
|
|
left: 7px;
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
.el-switch .el-switch__core {
|
|
border: 2px solid var(--iconColor);
|
|
background: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
span.el-switch__label {
|
|
color: var(--editorColor50);
|
|
}
|
|
.el-switch:not(.is-checked) .el-switch__core::after {
|
|
background: var(--iconColor);
|
|
}
|
|
</style>
|
|
|