style: update code style and default value

This commit is contained in:
yanglbme 2020-07-27 22:35:56 +08:00
parent baf0f93fb7
commit f81e392899
4 changed files with 13 additions and 13 deletions

View File

@ -10,7 +10,7 @@
margin: 10px 8px; margin: 10px 8px;
color: #333; color: #333;
position: relative; position: relative;
background-color: rgb(238, 238, 238); background-color: rgba(27, 31, 35, .05);
border: 1px solid #f0f0f0; border: 1px solid #f0f0f0;
border-radius: 2px; border-radius: 2px;
display: flex; display: flex;

View File

@ -37,29 +37,29 @@ export default {
colorOption: [{ colorOption: [{
label: '经典蓝', label: '经典蓝',
value: 'rgba(15, 76, 129, 1)', value: 'rgba(15, 76, 129, 1)',
hex: '最新流行' desc: '最新流行'
}, },
{ {
label: '翡翠绿', label: '翡翠绿',
value: 'rgba(0, 152, 116, 1)', value: 'rgba(0, 152, 116, 1)',
hex: '优雅清新' desc: '优雅清新'
}, },
{ {
label: '活力橘', label: '活力橘',
value: 'rgba(250, 81, 81, 1)', value: 'rgba(250, 81, 81, 1)',
hex: '热情活泼' desc: '热情活泼'
} }
], ],
codeThemeOption: [ codeThemeOption: [
{ {
label: '微信', label: '微信',
value: 'wechat', value: 'wechat',
hex: '默认样式' desc: '默认样式'
}, },
{ {
label: 'github', label: 'GitHub',
value: 'github', value: 'github',
hex: '精简风格' desc: '精简风格'
} }
], ],
form: { form: {

View File

@ -43,17 +43,17 @@
<el-select v-model="selectColor" size="mini" placeholder="选择颜色" clearable @change="colorChanged"> <el-select v-model="selectColor" size="mini" placeholder="选择颜色" clearable @change="colorChanged">
<el-option v-for="color in config.colorOption" :key="color.value" :label="color.label" :value="color.value"> <el-option v-for="color in config.colorOption" :key="color.value" :label="color.label" :value="color.value">
<span class="select-item-left">{{ color.label }}</span> <span class="select-item-left">{{ color.label }}</span>
<span class="select-item-right">{{ color.hex }}</span> <span class="select-item-right">{{ color.desc }}</span>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-select v-model="selectCodeTheme" size="mini" placeholder="选择代码样式" clearable @change="codeThemeChanged"> <el-select v-model="selectCodeTheme" size="mini" placeholder="选择代码样式" clearable @change="codeThemeChanged">
<el-option v-for="theme in config.codeThemeOption" :key="theme.value" <el-option v-for="theme in config.codeThemeOption" :key="theme.value"
:label="'代码块样式:' + theme.label" :label="theme.label"
:value="theme.value"> :value="theme.value">
<span class="select-item-left">{{ theme.label }}</span> <span class="select-item-left">{{ theme.label }}</span>
<span class="select-item-right">{{ theme.hex }}</span> <span class="select-item-right">{{ theme.desc }}</span>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -105,7 +105,7 @@ export default {
selectFont: '', selectFont: '',
selectSize: '', selectSize: '',
selectColor: '', selectColor: '',
selectCodeTheme: 'wechat' selectCodeTheme: 'github'
}; };
}, },
components: { components: {

View File

@ -24,7 +24,7 @@ const state = {
currentColor: '', currentColor: '',
citeStatus: 0, citeStatus: 0,
nightMode: false, nightMode: false,
codeTheme: 'wechat', codeTheme: 'github',
rightClickMenuVisible: false rightClickMenuVisible: false
}; };
const mutations = { const mutations = {