支持编辑区域主题选择

This commit is contained in:
xiaoqi.cxq 2022-10-06 03:45:51 +08:00
parent 8aff518e34
commit 347358f6bc
24 changed files with 1239 additions and 8 deletions

View File

@ -64,6 +64,10 @@ module.exports = (app) => {
// Google Drive action receiver // Google Drive action receiver
app.get('/googleDriveAction', (req, res) => app.get('/googleDriveAction', (req, res) =>
res.redirect(`./app#providerId=googleDrive&state=${encodeURIComponent(req.query.state)}`)); res.redirect(`./app#providerId=googleDrive&state=${encodeURIComponent(req.query.state)}`));
// Serve the static folder with 1 year max-age
app.use('/themes', serveStatic(resolvePath('static/themes'), {
maxAge: '1m',
}));
// Serve static resources // Serve static resources
if (process.env.NODE_ENV === 'production') { if (process.env.NODE_ENV === 'production') {

View File

@ -54,6 +54,9 @@ export default {
try { try {
await syncSvc.init(); await syncSvc.init();
await networkSvc.init(); await networkSvc.init();
// store
const editTheme = localStorage.getItem('theme/currEditTheme');
store.dispatch('theme/setEditTheme', editTheme || 'default');
this.ready = true; this.ready = true;
tempFileSvc.setReady(); tempFileSvc.setReady();
} catch (err) { } catch (err) {

View File

@ -0,0 +1,154 @@
<template>
<div class="editor-in-page-buttons">
<ul>
<li :title="`查找 ${mod}+F`">
<a @click="showFind"><icon-search></icon-search></a>
</li>
<li :title="`替换 ${mod}+Alt+F`">
<a @click="showFindReplace"><icon-find-replace></icon-find-replace></a>
</li>
<li title="切换编辑主题">
<dropdown-menu :selected="selectedTheme" :options="allThemes" :closeOnItemClick="false" @change="changeTheme">
<icon-select-theme></icon-select-theme>
</dropdown-menu>
</li>
<li title="Markdown语法帮助">
<a @click="showHelp"><icon-help-circle></icon-help-circle></a>
</li>
</ul>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
import store from '../store';
import editorSvc from '../services/editorSvc';
import DropdownMenu from './common/DropdownMenu';
const mod = /Mac|iPod|iPhone|iPad/.test(navigator.platform) ? 'Meta' : 'Ctrl';
export default {
components: {
DropdownMenu,
},
data: () => ({
mod,
allThemes: [{
name: '默认主题',
value: 'default',
}, {
name: '天蓝黑',
value: 'azure',
}, {
name: '冰山黑',
value: 'iceberg_contrast',
}, {
name: '黎明白',
value: 'dawn',
}, {
name: '孔雀黑',
value: 'peacock',
}, {
name: '薄荷黑',
value: 'mintchoc',
}, {
name: '薄荷绿',
value: 'spearmint',
}, {
name: '暗蓝黑',
value: 'slate',
}, {
name: '文墨黑',
value: 'carbonight',
}, {
name: '日光白',
value: 'solarized_light',
}, {
name: 'Clouds白',
value: 'clouds',
}, {
name: 'Clouds黑',
value: 'clouds_midnight',
}, {
name: 'GitHub白',
value: 'github',
}],
}),
computed: {
...mapGetters('theme', [
'currEditTheme',
]),
selectedTheme() {
return {
value: this.currEditTheme || 'default',
};
},
},
methods: {
...mapActions('data', [
'toggleSideBar',
]),
showFind() {
store.dispatch('findReplace/open', {
type: 'find',
findText: editorSvc.clEditor.selectionMgr.hasFocus() &&
editorSvc.clEditor.selectionMgr.getSelectedText(),
});
},
showFindReplace() {
store.dispatch('findReplace/open', {
type: 'replace',
findText: editorSvc.clEditor.selectionMgr.hasFocus() &&
editorSvc.clEditor.selectionMgr.getSelectedText(),
});
},
async changeTheme(item) {
store.dispatch('theme/setEditTheme', item.value);
},
showHelp() {
this.toggleSideBar(true);
store.dispatch('data/setSideBarPanel', 'help');
},
},
};
</script>
<style lang="scss">
@import '../styles/variables.scss';
.editor-in-page-buttons {
position: absolute;
top: 0;
right: 10px;
height: 34px;
padding: 5px;
background-color: rgba(187, 187, 187, 0.05);
border-radius: $border-radius-base;
ul {
padding: 0;
margin-left: 10px;
li {
line-height: 16px;
width: 16px;
display: inline-block;
list-style: none;
cursor: pointer;
font-size: 14px;
margin-right: 10px;
}
}
.icon {
color: #dea731;
opacity: 0.4;
&:active,
&:focus,
&:hover {
opacity: 1;
}
}
}
</style>

View File

@ -9,11 +9,12 @@
<navigation-bar></navigation-bar> <navigation-bar></navigation-bar>
</div> </div>
<div class="layout__panel flex flex--row" :style="{height: styles.innerHeight + 'px'}"> <div class="layout__panel flex flex--row" :style="{height: styles.innerHeight + 'px'}">
<div class="layout__panel layout__panel--editor" v-show="styles.showEditor" :style="{width: (styles.editorWidth + styles.editorGutterWidth) + 'px', fontSize: styles.fontSize + 'px'}"> <div class="layout__panel layout__panel--editor" :class="currTheme" v-show="styles.showEditor" :style="{width: (styles.editorWidth + styles.editorGutterWidth) + 'px', fontSize: styles.fontSize + 'px'}">
<div class="gutter" :style="{left: styles.editorGutterLeft + 'px'}"> <div class="gutter" :style="{left: styles.editorGutterLeft + 'px'}">
<div class="gutter__background" v-if="styles.editorGutterWidth" :style="{width: styles.editorGutterWidth + 'px'}"></div> <div class="gutter__background" v-if="styles.editorGutterWidth" :style="{width: styles.editorGutterWidth + 'px'}"></div>
</div> </div>
<editor></editor> <editor></editor>
<editor-in-page-buttons></editor-in-page-buttons>
<div class="gutter" :style="{left: styles.editorGutterLeft + 'px'}"> <div class="gutter" :style="{left: styles.editorGutterLeft + 'px'}">
<sticky-comment v-if="styles.editorGutterWidth && stickyComment === 'top'"></sticky-comment> <sticky-comment v-if="styles.editorGutterWidth && stickyComment === 'top'"></sticky-comment>
<current-discussion v-if="styles.editorGutterWidth"></current-discussion> <current-discussion v-if="styles.editorGutterWidth"></current-discussion>
@ -58,6 +59,7 @@ import SideBar from './SideBar';
import Editor from './Editor'; import Editor from './Editor';
import Preview from './Preview'; import Preview from './Preview';
import Tour from './Tour'; import Tour from './Tour';
import EditorInPageButtons from './EditorInPageButtons';
import StickyComment from './gutters/StickyComment'; import StickyComment from './gutters/StickyComment';
import CurrentDiscussion from './gutters/CurrentDiscussion'; import CurrentDiscussion from './gutters/CurrentDiscussion';
import FindReplace from './FindReplace'; import FindReplace from './FindReplace';
@ -75,6 +77,7 @@ export default {
Editor, Editor,
Preview, Preview,
Tour, Tour,
EditorInPageButtons,
StickyComment, StickyComment,
CurrentDiscussion, CurrentDiscussion,
FindReplace, FindReplace,
@ -96,6 +99,12 @@ export default {
...mapGetters('data', [ ...mapGetters('data', [
'layoutSettings', 'layoutSettings',
]), ]),
...mapGetters('theme', [
'currEditTheme',
]),
currTheme() {
return `edit-theme--${this.currEditTheme || 'default'}`;
},
showFindReplace() { showFindReplace() {
return !!store.state.findReplace.type; return !!store.state.findReplace.type;
}, },

View File

@ -0,0 +1,127 @@
<template>
<span class="dropdown-menu">
<span @click="toggleMenu()" class="dropdown-toggle">
<slot></slot>
</span>
<ul class="dropdown-menu-items" v-if="showMenu">
<li v-for="(option, idx) in options" :key="idx">
<a href="javascript:void(0)" :class="{selected: option.value === selectedOption.value}" @click="updateOption(option)">
{{ option.name }}
</a>
</li>
</ul>
</span>
</template>
<script>
export default {
data: () => ({
selectedOption: {
value: '',
name: '',
},
showMenu: false,
}),
props: {
options: {
type: [Array, Object],
},
selected: {},
closeOnOutsideClick: {
type: [Boolean],
default: true,
},
closeOnItemClick: {
type: [Boolean],
default: true,
},
},
mounted() {
this.selectedOption = this.selected;
if (this.closeOnOutsideClick) {
document.addEventListener('click', this.clickHandler);
}
},
beforeDestroy() {
document.removeEventListener('click', this.clickHandler);
},
methods: {
updateOption(option) {
this.selectedOption = option;
if (this.closeOnItemClick) {
this.showMenu = false;
}
this.$emit('change', this.selectedOption);
},
toggleMenu() {
this.showMenu = !this.showMenu;
},
clickHandler(event) {
const { target } = event;
const { $el } = this;
if (!$el.contains(target)) {
this.showMenu = false;
}
},
},
watch: {
selected(val) {
this.selectedOption = val;
},
},
};
</script>
<style lang="scss">
.dropdown-menu {
.dropdown-menu-items {
position: absolute;
top: 100%;
right: 0;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 15px;
background-color: #666;
border: 1px solid #666;
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgb(0, 0, 0 / 18%);
box-shadow: 0 6px 12px rgb(0, 0, 0 / 18%);
background-clip: padding-box;
li {
width: 100%;
display: list-item;
text-align: -webkit-match-parent;
a {
display: block;
clear: both;
font-weight: normal;
line-height: 1.45;
white-space: nowrap;
color: #eee;
padding: 5px 20px;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
text-decoration: none;
&:active,
&:focus,
&:hover {
background-color: rgb(82, 82, 82);
}
}
a.selected {
background: #74b936 !important;
color: #fff !important;
}
}
}
}
</style>

View File

@ -0,0 +1,3 @@
<template>
<svg t="1664799557150" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8995" width="32" height="32"><path d="M781.702095 712.752762l208.847238 208.798476-68.998095 68.998095-208.798476-208.847238A436.906667 436.906667 0 0 1 438.857143 877.714286c-242.249143 0-438.857143-196.608-438.857143-438.857143s196.608-438.857143 438.857143-438.857143 438.857143 196.608 438.857143 438.857143a436.906667 436.906667 0 0 1-96.012191 273.895619zM714.800762 341.333333A292.571429 292.571429 0 0 0 438.857143 146.285714C277.211429 146.285714 146.285714 277.211429 146.285714 438.857143h97.52381a195.096381 195.096381 0 0 1 288.182857-171.398095L487.619048 341.333333h227.181714zM731.428571 438.857143h-97.523809a195.096381 195.096381 0 0 1-288.182857 171.398095L390.095238 536.380952H162.913524A292.571429 292.571429 0 0 0 438.857143 731.428571c161.645714 0 292.571429-130.925714 292.571428-292.571428z" p-id="8996"></path></svg>
</template>

View File

@ -1,3 +1,3 @@
<template> <template>
<svg t="1660710445280" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2419" width="32" height="32"><path d="M576 672a192 192 0 0 1 192-192 182.72 182.72 0 0 1 48 6.4v-106.56a48 48 0 0 0-13.12-32L565.76 96a48 48 0 0 0-34.88-15.04H128A48 48 0 0 0 80 128v768A48 48 0 0 0 128 944h640a48 48 0 0 0 48-48v-38.4a184.64 184.64 0 0 1-48 6.4 192 192 0 0 1-192-192z m-64-326.72V112l272 272h-233.28A38.72 38.72 0 0 1 512 345.28z" p-id="2420"></path><path d="M957.76 774.4l-71.36-53.76A128 128 0 1 0 768 800a125.76 125.76 0 0 0 79.36-28.48l72 54.08zM768 736a64 64 0 1 1 64-64 64 64 0 0 1-64 64z" p-id="2421"></path></svg> <svg t="1664775684106" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6828" width="32" height="32"><path d="M694.857143 475.428571q0-105.714286-75.142857-180.857143t-180.857143-75.142857-180.857143 75.142857-75.142857 180.857143 75.142857 180.857143 180.857143 75.142857 180.857143-75.142857 75.142857-180.857143zm292.571429 475.428571q0 29.714286-21.714286 51.428571t-51.428571 21.714286q-30.857143 0-51.428571-21.714286l-196-195.428571q-102.285714 70.857143-228 70.857143-81.714286 0-156.285714-31.714286t-128.571429-85.714286-85.714286-128.571429-31.714286-156.285714 31.714286-156.285714 85.714286-128.571429 128.571429-85.714286 156.285714-31.714286 156.285714 31.714286 128.571429 85.714286 85.714286 128.571429 31.714286 156.285714q0 125.714286-70.857143 228l196 196q21.142857 21.142857 21.142857 51.428571z" p-id="6829"></path></svg>
</template> </template>

View File

@ -0,0 +1,3 @@
<template>
<svg t="1664776491043" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7365" width="32" height="32"><path d="M384.096 222.4L238.08 363.072l590.4 606.048 155.584-173.92-599.968-572.8z m442.368 652.96L328.832 364.512l55.456-53.408L895.072 798.72l-68.608 76.64zM205.312 321.856l140.384-134.08L286.304 129.6c-36.384-35.552-98.944-35.264-134.88 0.608a96.384 96.384 0 0 0-1.184 134.88l55.072 56.768zM416 64h64v64h-64zM320 672h64v64h-64zM32 352h64v64H32zM232.672 492.192l-60.48-20.864-16.512 47.776-48.768-15.136-18.944 61.088 46.848 14.56-15.488 44.928 60.48 20.864 16.16-46.784 45.824 14.208 18.976-61.12-43.904-13.632zM632.16 277.472l61.312 18.368 14.72-49.152 45.6 14.144 18.976-61.088-46.176-14.368 14.048-46.848-61.312-18.368-13.888 46.24-46.496-14.432-19.008 61.088 47.136 14.656z" p-id="7366"></path></svg>
</template>

View File

@ -59,6 +59,9 @@ import Key from './Key';
import DotsHorizontal from './DotsHorizontal'; import DotsHorizontal from './DotsHorizontal';
import Seal from './Seal'; import Seal from './Seal';
import SwitchTheme from './SwitchTheme'; import SwitchTheme from './SwitchTheme';
import Search from './Search';
import FindReplace from './FindReplace';
import SelectTheme from './SelectTheme';
Vue.component('iconProvider', Provider); Vue.component('iconProvider', Provider);
Vue.component('iconFormatBold', FormatBold); Vue.component('iconFormatBold', FormatBold);
@ -120,3 +123,6 @@ Vue.component('iconKey', Key);
Vue.component('iconDotsHorizontal', DotsHorizontal); Vue.component('iconDotsHorizontal', DotsHorizontal);
Vue.component('iconSeal', Seal); Vue.component('iconSeal', Seal);
Vue.component('iconSwitchTheme', SwitchTheme); Vue.component('iconSwitchTheme', SwitchTheme);
Vue.component('iconSearch', Search);
Vue.component('iconFindReplace', FindReplace);
Vue.component('iconSelectTheme', SelectTheme);

View File

@ -19,6 +19,7 @@ import syncedContent from './syncedContent';
import userInfo from './userInfo'; import userInfo from './userInfo';
import workspace from './workspace'; import workspace from './workspace';
import img from './img'; import img from './img';
import theme from './theme';
import locationTemplate from './locationTemplate'; import locationTemplate from './locationTemplate';
import emptyPublishLocation from '../data/empties/emptyPublishLocation'; import emptyPublishLocation from '../data/empties/emptyPublishLocation';
import emptySyncLocation from '../data/empties/emptySyncLocation'; import emptySyncLocation from '../data/empties/emptySyncLocation';
@ -49,6 +50,7 @@ const store = new Vuex.Store({
userInfo, userInfo,
workspace, workspace,
img, img,
theme,
}, },
state: { state: {
light: false, light: false,

55
src/store/theme.js Normal file
View File

@ -0,0 +1,55 @@
const localKey = 'theme/currEditTheme';
export default {
namespaced: true,
state: {
// 当前编辑主题
currEditTheme: null,
initEditTheme: false,
},
mutations: {
setEditTheme: (state, value) => {
state.currEditTheme = value;
},
setInitEditTheme: (state, value) => {
state.initEditTheme = value;
},
},
getters: {
currEditTheme: state => state.currEditTheme,
initEditTheme: state => state.initEditTheme,
},
actions: {
async setEditTheme({ commit }, theme) {
commit('setEditTheme', theme);
commit('setInitEditTheme', true);
localStorage.setItem(localKey, theme);
// 如果不是default 则加载样式
if (!theme || theme === 'default') {
return;
}
const themeStyle = document.getElementById(`edit-theme-${theme}`);
if (themeStyle) {
return;
}
const script = document.createElement('script');
let timeout;
try {
await new Promise((resolve, reject) => {
script.onload = resolve;
script.onerror = reject;
script.src = `/themes/edit-theme-${theme}.js`;
try {
document.head.appendChild(script);
timeout = setTimeout(reject, 30);
} catch (e) {
reject(e);
}
});
} finally {
clearTimeout(timeout);
document.head.removeChild(script);
}
},
},
};

View File

@ -188,28 +188,28 @@
.h1, .h1,
.h11 { .h11 {
font-size: 2em; font-size: 1.7em;
} }
.h2, .h2,
.h22 { .h22 {
font-size: 1.5em; font-size: 1.4em;
} }
.h3 { .h3 {
font-size: 1.17em; font-size: 1.2em;
} }
.h4 { .h4 {
font-size: 1em; font-size: 1.1em;
} }
.h5 { .h5 {
font-size: 0.83em; font-size: 1em;
} }
.h6 { .h6 {
font-size: 0.75em; font-size: 0.9em;
} }
.cl-hash { .cl-hash {

View File

@ -0,0 +1,72 @@
function init_edit_theme_azure() {
const style = document.createElement('style');
style.id = 'edit-theme-azure';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--azure .editor__inner {\n\
color: #fff;\n\
caret-color: #fff;\n\
}\n\
.edit-theme--azure .editor {\n\
background-color: #181D26;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--azure .editor__inner .cn-head,\n\
.edit-theme--azure .editor-in-page-buttons .icon {\n\
color: #64aeb3;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--azure .editor__inner .cn-strong {\n\
color: #508aaa;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--azure .editor__inner .blockquote {\n\
color: #52708b;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--azure .editor__inner .cl,\n\
.edit-theme--azure .editor__inner .hr,\n\
.edit-theme--azure .editor__inner .link,\n\
.edit-theme--azure .editor__inner .linkref, \n\
.edit-theme--azure .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--azure .editor__inner .cn-toc, \n\
.edit-theme--azure .editor__inner .code,\n\
.edit-theme--azure .editor__inner .img,\n\
.edit-theme--azure .editor__inner .img-wrapper,\n\
.edit-theme--azure .editor__inner .imgref,\n\
.edit-theme--azure .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--azure .editor__inner .cn-code {\n\
color: #6AB0A3;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--azure .editor__inner .img .cl-underlined-text,\n\
.edit-theme--azure .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--azure .editor__inner .link .cl-underlined-text,\n\
.edit-theme--azure .editor__inner .linkref .cl-underlined-text {\n\
color: #64aeb3;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--azure .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--azure .editor__inner .keyword {\n\
color: #508aaa;\n\
}\n\
.edit-theme--azure .editor__inner .email,\n\
.edit-theme--azure .editor__inner .cl-title,\n\
.edit-theme--azure .editor__inner .tag,\n\
.edit-theme--azure .editor__inner .latex,\n\
.edit-theme--azure .editor__inner .math,\n\
.edit-theme--azure .editor__inner .entity,\n\
.edit-theme--azure .editor__inner .pre [class*='language-'] {\n\
color: #fff;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_azure();

View File

@ -0,0 +1,72 @@
function init_edit_theme_carbonight() {
const style = document.createElement('style');
style.id = 'edit-theme-carbonight';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--carbonight .editor__inner {\n\
color: #B0B0B0;\n\
caret-color: #B0B0B0;\n\
}\n\
.edit-theme--carbonight .editor {\n\
background-color: #2E2C2B;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--carbonight .editor__inner .cn-head,\n\
.edit-theme--carbonight .editor-in-page-buttons .icon {\n\
color: #B0B0B0;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--carbonight .editor__inner .cn-strong {\n\
color: #eeeeee;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--carbonight .editor__inner .blockquote {\n\
color: #8C8C8C;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--carbonight .editor__inner .cl,\n\
.edit-theme--carbonight .editor__inner .hr,\n\
.edit-theme--carbonight .editor__inner .link,\n\
.edit-theme--carbonight .editor__inner .linkref, \n\
.edit-theme--carbonight .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--carbonight .editor__inner .cn-toc, \n\
.edit-theme--carbonight .editor__inner .code,\n\
.edit-theme--carbonight .editor__inner .img,\n\
.edit-theme--carbonight .editor__inner .img-wrapper,\n\
.edit-theme--carbonight .editor__inner .imgref,\n\
.edit-theme--carbonight .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--carbonight .editor__inner .cn-code {\n\
color: #fff;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--carbonight .editor__inner .img .cl-underlined-text,\n\
.edit-theme--carbonight .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--carbonight .editor__inner .link .cl-underlined-text,\n\
.edit-theme--carbonight .editor__inner .linkref .cl-underlined-text {\n\
color: #fff;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--carbonight .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--carbonight .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--carbonight .editor__inner .email,\n\
.edit-theme--carbonight .editor__inner .cl-title,\n\
.edit-theme--carbonight .editor__inner .tag,\n\
.edit-theme--carbonight .editor__inner .latex,\n\
.edit-theme--carbonight .editor__inner .math,\n\
.edit-theme--carbonight .editor__inner .entity,\n\
.edit-theme--carbonight .editor__inner .pre [class*='language-'] {\n\
color: #B0B0B0;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_carbonight();

View File

@ -0,0 +1,72 @@
function init_edit_theme_clouds() {
const style = document.createElement('style');
style.id = 'edit-theme-clouds';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--clouds .editor__inner {\n\
color: #000;\n\
caret-color: #000;\n\
}\n\
.edit-theme--clouds .editor {\n\
background-color: #fff;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--clouds .editor__inner .cn-head,\n\
.edit-theme--clouds .editor-in-page-buttons .icon {\n\
color: #46A609;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--clouds .editor__inner .cn-strong {\n\
color: #AF956F;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--clouds .editor__inner .blockquote {\n\
color: #5D90CD;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--clouds .editor__inner .cl,\n\
.edit-theme--clouds .editor__inner .hr,\n\
.edit-theme--clouds .editor__inner .link,\n\
.edit-theme--clouds .editor__inner .linkref, \n\
.edit-theme--clouds .editor__inner .linkdef .url {\n\
color: rgba(102,128,153,0.6);\n\
}\n\
.edit-theme--clouds .editor__inner .cn-toc, \n\
.edit-theme--clouds .editor__inner .code,\n\
.edit-theme--clouds .editor__inner .img,\n\
.edit-theme--clouds .editor__inner .img-wrapper,\n\
.edit-theme--clouds .editor__inner .imgref,\n\
.edit-theme--clouds .editor__inner .cl-toc {\n\
color: rgba(102,128,153,0.6);\n\
background-color: rgba(102,128,153,0.075);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--clouds .editor__inner .cn-code {\n\
color: #C52727;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--clouds .editor__inner .img .cl-underlined-text,\n\
.edit-theme--clouds .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--clouds .editor__inner .link .cl-underlined-text,\n\
.edit-theme--clouds .editor__inner .linkref .cl-underlined-text {\n\
color: #5D90CD;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--clouds .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--clouds .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--clouds .editor__inner .email,\n\
.edit-theme--clouds .editor__inner .cl-title,\n\
.edit-theme--clouds .editor__inner .tag,\n\
.edit-theme--clouds .editor__inner .latex,\n\
.edit-theme--clouds .editor__inner .math,\n\
.edit-theme--clouds .editor__inner .entity,\n\
.edit-theme--clouds .editor__inner .pre [class*='language-'] {\n\
color: #000;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_clouds();

View File

@ -0,0 +1,72 @@
function init_edit_theme_clouds_midnight() {
const style = document.createElement('style');
style.id = 'edit-theme-clouds_midnight';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--clouds_midnight .editor__inner {\n\
color: #929292;\n\
caret-color: #929292;\n\
}\n\
.edit-theme--clouds_midnight .editor {\n\
background-color: #191919;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .cn-head,\n\
.edit-theme--clouds_midnight .editor-in-page-buttons .icon {\n\
color: #46A609;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .cn-strong {\n\
color: #927C5D;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .blockquote {\n\
color: #5D90CD;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .cl,\n\
.edit-theme--clouds_midnight .editor__inner .hr,\n\
.edit-theme--clouds_midnight .editor__inner .link,\n\
.edit-theme--clouds_midnight .editor__inner .linkref, \n\
.edit-theme--clouds_midnight .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--clouds_midnight .editor__inner .cn-toc, \n\
.edit-theme--clouds_midnight .editor__inner .code,\n\
.edit-theme--clouds_midnight .editor__inner .img,\n\
.edit-theme--clouds_midnight .editor__inner .img-wrapper,\n\
.edit-theme--clouds_midnight .editor__inner .imgref,\n\
.edit-theme--clouds_midnight .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .cn-code {\n\
color: #E92E2E;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .img .cl-underlined-text,\n\
.edit-theme--clouds_midnight .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--clouds_midnight .editor__inner .link .cl-underlined-text,\n\
.edit-theme--clouds_midnight .editor__inner .linkref .cl-underlined-text {\n\
color: #5D90CD;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--clouds_midnight .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--clouds_midnight .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--clouds_midnight .editor__inner .email,\n\
.edit-theme--clouds_midnight .editor__inner .cl-title,\n\
.edit-theme--clouds_midnight .editor__inner .tag,\n\
.edit-theme--clouds_midnight .editor__inner .latex,\n\
.edit-theme--clouds_midnight .editor__inner .math,\n\
.edit-theme--clouds_midnight .editor__inner .entity,\n\
.edit-theme--clouds_midnight .editor__inner .pre [class*='language-'] {\n\
color: #929292;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_clouds_midnight();

View File

@ -0,0 +1,72 @@
function init_edit_theme_dawn() {
const style = document.createElement('style');
style.id = 'edit-theme-dawn';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--dawn .editor__inner {\n\
color: #080808;\n\
caret-color: #080808;\n\
}\n\
.edit-theme--dawn .editor {\n\
background-color: #F9F9F9;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--dawn .editor__inner .cn-head,\n\
.edit-theme--dawn .editor-in-page-buttons .icon {\n\
color: #19356D;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--dawn .editor__inner .cn-strong {\n\
color: #794938;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--dawn .editor__inner .blockquote {\n\
color: #811F24;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--dawn .editor__inner .cl,\n\
.edit-theme--dawn .editor__inner .hr,\n\
.edit-theme--dawn .editor__inner .link,\n\
.edit-theme--dawn .editor__inner .linkref, \n\
.edit-theme--dawn .editor__inner .linkdef .url {\n\
color: rgba(102,128,153,0.6);\n\
}\n\
.edit-theme--dawn .editor__inner .cn-toc, \n\
.edit-theme--dawn .editor__inner .code,\n\
.edit-theme--dawn .editor__inner .img,\n\
.edit-theme--dawn .editor__inner .img-wrapper,\n\
.edit-theme--dawn .editor__inner .imgref,\n\
.edit-theme--dawn .editor__inner .cl-toc {\n\
color: rgba(102,128,153,0.6);\n\
background-color: rgba(102,128,153,0.075);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--dawn .editor__inner .cn-code {\n\
color: #693A17;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--dawn .editor__inner .img .cl-underlined-text,\n\
.edit-theme--dawn .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--dawn .editor__inner .link .cl-underlined-text,\n\
.edit-theme--dawn .editor__inner .linkref .cl-underlined-text {\n\
color: #0B6125;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--dawn .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--dawn .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--dawn .editor__inner .email,\n\
.edit-theme--dawn .editor__inner .cl-title,\n\
.edit-theme--dawn .editor__inner .tag,\n\
.edit-theme--dawn .editor__inner .latex,\n\
.edit-theme--dawn .editor__inner .math,\n\
.edit-theme--dawn .editor__inner .entity,\n\
.edit-theme--dawn .editor__inner .pre [class*='language-'] {\n\
color: #080808;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_dawn();

View File

@ -0,0 +1,73 @@
function init_edit_theme_github() {
const style = document.createElement('style');
style.id = 'edit-theme-github';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--github .editor__inner {\n\
color: #000;\n\
caret-color: #000;\n\
background-color: #fff;\n\
}\n\
.edit-theme--github .editor {\n\
background-color: #fff;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--github .editor__inner .cn-head,\n\
.edit-theme--github .editor-in-page-buttons .icon {\n\
color: #AAAAAA;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--github .editor__inner .cn-strong {\n\
color: #000;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--github .editor__inner .blockquote {\n\
color: rgba(0,0,0,0.48);\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--github .editor__inner .cl,\n\
.edit-theme--github .editor__inner .hr,\n\
.edit-theme--github .editor__inner .link,\n\
.edit-theme--github .editor__inner .linkref, \n\
.edit-theme--github .editor__inner .linkdef .url {\n\
color: rgba(0,0,0,0.28);\n\
}\n\
.edit-theme--github .editor__inner .cn-toc, \n\
.edit-theme--github .editor__inner .code,\n\
.edit-theme--github .editor__inner .img,\n\
.edit-theme--github .editor__inner .img-wrapper,\n\
.edit-theme--github .editor__inner .imgref,\n\
.edit-theme--github .editor__inner .cl-toc {\n\
color: rgba(0,0,0,0.28);\n\
background-color: rgba(102,128,153,0.075);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--github .editor__inner .cn-code {\n\
color: #0086B3;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--github .editor__inner .img .cl-underlined-text,\n\
.edit-theme--github .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--github .editor__inner .link .cl-underlined-text,\n\
.edit-theme--github .editor__inner .linkref .cl-underlined-text {\n\
color: #D14;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--github .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--github .editor__inner .keyword {\n\
color: rgba(0,0,0,0.75);\n\
}\n\
.edit-theme--github .editor__inner .email,\n\
.edit-theme--github .editor__inner .cl-title,\n\
.edit-theme--github .editor__inner .tag,\n\
.edit-theme--github .editor__inner .latex,\n\
.edit-theme--github .editor__inner .math,\n\
.edit-theme--github .editor__inner .entity,\n\
.edit-theme--github .editor__inner .pre [class*='language-'] {\n\
color: #29333d;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_github();

View File

@ -0,0 +1,72 @@
function init_edit_theme_iceberg_contrast() {
const style = document.createElement('style');
style.id = 'edit-theme-iceberg_contrast';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--iceberg_contrast .editor__inner {\n\
color: #BDD6DB;\n\
caret-color: #fff;\n\
}\n\
.edit-theme--iceberg_contrast .editor {\n\
background-color: #0b0e0e;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .cn-head,\n\
.edit-theme--iceberg_contrast .editor-in-page-buttons .icon {\n\
color: #fff;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .cn-strong {\n\
color: #B1E2F2;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .blockquote {\n\
color: #ffffff;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .cl,\n\
.edit-theme--iceberg_contrast .editor__inner .hr,\n\
.edit-theme--iceberg_contrast .editor__inner .link,\n\
.edit-theme--iceberg_contrast .editor__inner .linkref, \n\
.edit-theme--iceberg_contrast .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--iceberg_contrast .editor__inner .cn-toc, \n\
.edit-theme--iceberg_contrast .editor__inner .code,\n\
.edit-theme--iceberg_contrast .editor__inner .img,\n\
.edit-theme--iceberg_contrast .editor__inner .img-wrapper,\n\
.edit-theme--iceberg_contrast .editor__inner .imgref,\n\
.edit-theme--iceberg_contrast .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .cn-code {\n\
color: #fff;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .img .cl-underlined-text,\n\
.edit-theme--iceberg_contrast .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--iceberg_contrast .editor__inner .link .cl-underlined-text,\n\
.edit-theme--iceberg_contrast .editor__inner .linkref .cl-underlined-text {\n\
color: #fff;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--iceberg_contrast .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--iceberg_contrast .editor__inner .keyword {\n\
color: #fff;\n\
}\n\
.edit-theme--iceberg_contrast .editor__inner .email,\n\
.edit-theme--iceberg_contrast .editor__inner .cl-title,\n\
.edit-theme--iceberg_contrast .editor__inner .tag,\n\
.edit-theme--iceberg_contrast .editor__inner .latex,\n\
.edit-theme--iceberg_contrast .editor__inner .math,\n\
.edit-theme--iceberg_contrast .editor__inner .entity,\n\
.edit-theme--iceberg_contrast .editor__inner .pre [class*='language-'] {\n\
color: #BDD6DB;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_iceberg_contrast();

View File

@ -0,0 +1,72 @@
function init_edit_theme_mintchoc() {
const style = document.createElement('style');
style.id = 'edit-theme-mintchoc';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--mintchoc .editor__inner {\n\
color: #BABABA;\n\
caret-color: #BABABA;\n\
}\n\
.edit-theme--mintchoc .editor {\n\
background-color: #2b221c;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--mintchoc .editor__inner .cn-head,\n\
.edit-theme--mintchoc .editor-in-page-buttons .icon {\n\
color: #00E08C;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--mintchoc .editor__inner .cn-strong {\n\
color: #9D8262;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--mintchoc .editor__inner .blockquote {\n\
color: #008D62;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--mintchoc .editor__inner .cl,\n\
.edit-theme--mintchoc .editor__inner .hr,\n\
.edit-theme--mintchoc .editor__inner .link,\n\
.edit-theme--mintchoc .editor__inner .linkref, \n\
.edit-theme--mintchoc .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--mintchoc .editor__inner .cn-toc, \n\
.edit-theme--mintchoc .editor__inner .code,\n\
.edit-theme--mintchoc .editor__inner .img,\n\
.edit-theme--mintchoc .editor__inner .img-wrapper,\n\
.edit-theme--mintchoc .editor__inner .imgref,\n\
.edit-theme--mintchoc .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--mintchoc .editor__inner .cn-code {\n\
color: #008D62;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--mintchoc .editor__inner .img .cl-underlined-text,\n\
.edit-theme--mintchoc .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--mintchoc .editor__inner .link .cl-underlined-text,\n\
.edit-theme--mintchoc .editor__inner .linkref .cl-underlined-text {\n\
color: #00E08C;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--mintchoc .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--mintchoc .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--mintchoc .editor__inner .email,\n\
.edit-theme--mintchoc .editor__inner .cl-title,\n\
.edit-theme--mintchoc .editor__inner .tag,\n\
.edit-theme--mintchoc .editor__inner .latex,\n\
.edit-theme--mintchoc .editor__inner .math,\n\
.edit-theme--mintchoc .editor__inner .entity,\n\
.edit-theme--mintchoc .editor__inner .pre [class*='language-'] {\n\
color: #BABABA;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_mintchoc();

View File

@ -0,0 +1,72 @@
function init_edit_theme_peacock() {
const style = document.createElement('style');
style.id = 'edit-theme-peacock';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--peacock .editor__inner {\n\
color: #ede0ce;\n\
caret-color: #ede0ce;\n\
}\n\
.edit-theme--peacock .editor {\n\
background-color: #2b2a27;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--peacock .editor__inner .cn-head,\n\
.edit-theme--peacock .editor-in-page-buttons .icon {\n\
color: #bcd42a;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--peacock .editor__inner .cn-strong {\n\
color: #26A6A6;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--peacock .editor__inner .blockquote {\n\
color: #ff5d38;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--peacock .editor__inner .cl,\n\
.edit-theme--peacock .editor__inner .hr,\n\
.edit-theme--peacock .editor__inner .link,\n\
.edit-theme--peacock .editor__inner .linkref, \n\
.edit-theme--peacock .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--peacock .editor__inner .cn-toc, \n\
.edit-theme--peacock .editor__inner .code,\n\
.edit-theme--peacock .editor__inner .img,\n\
.edit-theme--peacock .editor__inner .img-wrapper,\n\
.edit-theme--peacock .editor__inner .imgref,\n\
.edit-theme--peacock .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--peacock .editor__inner .cn-code {\n\
color: #FF5D38;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--peacock .editor__inner .img .cl-underlined-text,\n\
.edit-theme--peacock .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--peacock .editor__inner .link .cl-underlined-text,\n\
.edit-theme--peacock .editor__inner .linkref .cl-underlined-text {\n\
color: #bcd42a;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--peacock .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--peacock .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--peacock .editor__inner .email,\n\
.edit-theme--peacock .editor__inner .cl-title,\n\
.edit-theme--peacock .editor__inner .tag,\n\
.edit-theme--peacock .editor__inner .latex,\n\
.edit-theme--peacock .editor__inner .math,\n\
.edit-theme--peacock .editor__inner .entity,\n\
.edit-theme--peacock .editor__inner .pre [class*='language-'] {\n\
color: #ede0ce;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_peacock();

View File

@ -0,0 +1,72 @@
function init_edit_theme_slate() {
const style = document.createElement('style');
style.id = 'edit-theme-slate';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--slate .editor__inner {\n\
color: #ebebf4;\n\
caret-color: #ebebf4;\n\
}\n\
.edit-theme--slate .editor {\n\
background-color: #19191f;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--slate .editor__inner .cn-head,\n\
.edit-theme--slate .editor-in-page-buttons .icon {\n\
color: #9eb2d9;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--slate .editor__inner .cn-strong {\n\
color: #566981;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--slate .editor__inner .blockquote {\n\
color: #89A7B1;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--slate .editor__inner .cl,\n\
.edit-theme--slate .editor__inner .hr,\n\
.edit-theme--slate .editor__inner .link,\n\
.edit-theme--slate .editor__inner .linkref, \n\
.edit-theme--slate .editor__inner .linkdef .url {\n\
color: rgba(139,158,177,0.8);\n\
}\n\
.edit-theme--slate .editor__inner .cn-toc, \n\
.edit-theme--slate .editor__inner .code,\n\
.edit-theme--slate .editor__inner .img,\n\
.edit-theme--slate .editor__inner .img-wrapper,\n\
.edit-theme--slate .editor__inner .imgref,\n\
.edit-theme--slate .editor__inner .cl-toc {\n\
color: rgba(139,158,177,0.8);\n\
background-color: rgba(0,0,0,0.33);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--slate .editor__inner .cn-code {\n\
color: #89A7B1;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--slate .editor__inner .img .cl-underlined-text,\n\
.edit-theme--slate .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--slate .editor__inner .link .cl-underlined-text,\n\
.edit-theme--slate .editor__inner .linkref .cl-underlined-text {\n\
color: #9eb2d9;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--slate .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--slate .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--slate .editor__inner .email,\n\
.edit-theme--slate .editor__inner .cl-title,\n\
.edit-theme--slate .editor__inner .tag,\n\
.edit-theme--slate .editor__inner .latex,\n\
.edit-theme--slate .editor__inner .math,\n\
.edit-theme--slate .editor__inner .entity,\n\
.edit-theme--slate .editor__inner .pre [class*='language-'] {\n\
color: #ebebf4;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_slate();

View File

@ -0,0 +1,72 @@
function init_edit_theme_solarized_light() {
const style = document.createElement('style');
style.id = 'edit-theme-solarized_light';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--solarized_light .editor__inner {\n\
color: #586E75;\n\
caret-color: #586E75;\n\
}\n\
.edit-theme--solarized_light .editor {\n\
background-color: #FDF6E3;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--solarized_light .editor__inner .cn-head,\n\
.edit-theme--solarized_light .editor-in-page-buttons .icon {\n\
color: #D33682;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--solarized_light .editor__inner .cn-strong {\n\
color: #859900;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--solarized_light .editor__inner .blockquote {\n\
color: #CB4B16;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--solarized_light .editor__inner .cl,\n\
.edit-theme--solarized_light .editor__inner .hr,\n\
.edit-theme--solarized_light .editor__inner .link,\n\
.edit-theme--solarized_light .editor__inner .linkref, \n\
.edit-theme--solarized_light .editor__inner .linkdef .url {\n\
color: rgba(102,128,153,0.6);\n\
}\n\
.edit-theme--solarized_light .editor__inner .cn-toc, \n\
.edit-theme--solarized_light .editor__inner .code,\n\
.edit-theme--solarized_light .editor__inner .img,\n\
.edit-theme--solarized_light .editor__inner .img-wrapper,\n\
.edit-theme--solarized_light .editor__inner .imgref,\n\
.edit-theme--solarized_light .editor__inner .cl-toc {\n\
color: rgba(102,128,153,0.6);\n\
background-color: rgba(102,128,153,0.075);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--solarized_light .editor__inner .cn-code {\n\
color: #268BD2;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--solarized_light .editor__inner .img .cl-underlined-text,\n\
.edit-theme--solarized_light .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--solarized_light .editor__inner .link .cl-underlined-text,\n\
.edit-theme--solarized_light .editor__inner .linkref .cl-underlined-text {\n\
color: #2AA198;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--solarized_light .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--solarized_light .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--solarized_light .editor__inner .email,\n\
.edit-theme--solarized_light .editor__inner .cl-title,\n\
.edit-theme--solarized_light .editor__inner .tag,\n\
.edit-theme--solarized_light .editor__inner .latex,\n\
.edit-theme--solarized_light .editor__inner .math,\n\
.edit-theme--solarized_light .editor__inner .entity,\n\
.edit-theme--solarized_light .editor__inner .pre [class*='language-'] {\n\
color: #586E75;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_solarized_light();

View File

@ -0,0 +1,72 @@
function init_edit_theme_spearmint() {
const style = document.createElement('style');
style.id = 'edit-theme-spearmint';
style.type = 'text/css';
style.innerHTML = "/* 默认字体颜色、光标颜色、背景颜色*/\n\
.edit-theme--spearmint .editor__inner {\n\
color: #719692;\n\
caret-color: #719692;\n\
}\n\
.edit-theme--spearmint .editor {\n\
background-color: #E1F0EE;\n\
}\n\
/* 标题颜色 */\n\
.edit-theme--spearmint .editor__inner .cn-head,\n\
.edit-theme--spearmint .editor-in-page-buttons .icon {\n\
color: #199FA8;\n\
}\n\
/* 加粗颜色 */\n\
.edit-theme--spearmint .editor__inner .cn-strong {\n\
color: #69ADB5;\n\
}\n\
/* 信息块颜色 */\n\
.edit-theme--spearmint .editor__inner .blockquote {\n\
color: #25808A;\n\
}\n\
/* 源信息、md标记符号等非关键信息的颜色 */\n\
.edit-theme--spearmint .editor__inner .cl,\n\
.edit-theme--spearmint .editor__inner .hr,\n\
.edit-theme--spearmint .editor__inner .link,\n\
.edit-theme--spearmint .editor__inner .linkref, \n\
.edit-theme--spearmint .editor__inner .linkdef .url {\n\
color: rgba(102,128,153,0.6);\n\
}\n\
.edit-theme--spearmint .editor__inner .cn-toc, \n\
.edit-theme--spearmint .editor__inner .code,\n\
.edit-theme--spearmint .editor__inner .img,\n\
.edit-theme--spearmint .editor__inner .img-wrapper,\n\
.edit-theme--spearmint .editor__inner .imgref,\n\
.edit-theme--spearmint .editor__inner .cl-toc {\n\
color: rgba(102,128,153,0.6);\n\
background-color: rgba(102,128,153,0.075);\n\
}\n\
/* 代码块颜色 */\n\
.edit-theme--spearmint .editor__inner .cn-code {\n\
color: #199FA8;\n\
}\n\
/* 链接颜色 */\n\
.edit-theme--spearmint .editor__inner .img .cl-underlined-text,\n\
.edit-theme--spearmint .editor__inner .imgref .cl-underlined-text,\n\
.edit-theme--spearmint .editor__inner .link .cl-underlined-text,\n\
.edit-theme--spearmint .editor__inner .linkref .cl-underlined-text {\n\
color: #4CD7E0;\n\
}\n\
/* 图片原始链接背景颜色 */\n\
.edit-theme--spearmint .editor__inner .img-wrapper .img {\n\
background-color: transparent;\n\
}\n\
.edit-theme--spearmint .editor__inner .keyword {\n\
color: #47596b;\n\
}\n\
.edit-theme--spearmint .editor__inner .email,\n\
.edit-theme--spearmint .editor__inner .cl-title,\n\
.edit-theme--spearmint .editor__inner .tag,\n\
.edit-theme--spearmint .editor__inner .latex,\n\
.edit-theme--spearmint .editor__inner .math,\n\
.edit-theme--spearmint .editor__inner .entity,\n\
.edit-theme--spearmint .editor__inner .pre [class*='language-'] {\n\
color: #719692;\n\
}";
document.head.appendChild(style);
}
init_edit_theme_spearmint();