新版文件
Former-commit-id: f8cb004bc9c5fe881993aec4bc46f696bbc5a2c8
@@ -0,0 +1,3 @@
|
|||||||
|
> 1%
|
||||||
|
last 2 versions
|
||||||
|
not ie <= 8
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
# 开发环境
|
||||||
|
|
||||||
|
# 页面 title 前缀
|
||||||
|
VUE_APP_TITLE=D2Admin Dev
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
# 忽略目录
|
||||||
|
build/
|
||||||
|
tests/
|
||||||
|
node_modules/
|
||||||
|
|
||||||
|
# node 覆盖率文件
|
||||||
|
coverage/
|
||||||
|
|
||||||
|
# 忽略文件
|
||||||
|
**/*-min.js
|
||||||
|
**/*.min.js
|
||||||
@@ -0,0 +1,17 @@
|
|||||||
|
module.exports = {
|
||||||
|
root: true,
|
||||||
|
env: {
|
||||||
|
node: true
|
||||||
|
},
|
||||||
|
'extends': [
|
||||||
|
'plugin:vue/essential',
|
||||||
|
'@vue/standard'
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||||
|
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||||
|
},
|
||||||
|
parserOptions: {
|
||||||
|
parser: 'babel-eslint'
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,20 @@
|
|||||||
|
.DS_Store
|
||||||
|
node_modules
|
||||||
|
/dist
|
||||||
|
|
||||||
|
# Log files
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw*
|
||||||
|
|
||||||
|
# d2admin
|
||||||
|
dev/design
|
||||||
@@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
plugins: {
|
||||||
|
autoprefixer: {}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
MIT License
|
||||||
|
|
||||||
|
Copyright (c) 2018 李杨
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
||||||
@@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
presets: [
|
||||||
|
'@vue/app'
|
||||||
|
]
|
||||||
|
}
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
#!/usr/bin/env sh
|
||||||
|
|
||||||
|
# 确保脚本抛出遇到的错误
|
||||||
|
set -e
|
||||||
|
|
||||||
|
# 生成静态文件
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
# 进入生成的文件夹
|
||||||
|
cd dist
|
||||||
|
|
||||||
|
# 如果是发布到自定义域名
|
||||||
|
# echo 'www.example.com' > CNAME
|
||||||
|
|
||||||
|
git init
|
||||||
|
git add -A
|
||||||
|
git commit -m 'deploy'
|
||||||
|
|
||||||
|
# 如果发布到 https://<USERNAME>.github.io
|
||||||
|
# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master
|
||||||
|
|
||||||
|
# 如果发布到 https://<USERNAME>.github.io/<REPO>
|
||||||
|
git push -f git@gitee.com:fairyever/d2-admin-start-kit-preview.git master
|
||||||
|
|
||||||
|
cd -
|
||||||
|
|
||||||
|
echo "publish to https://fairyever.gitee.io/d2-admin-start-kit-preview/#/index"
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
module.exports = {
|
||||||
|
moduleFileExtensions: [
|
||||||
|
'js',
|
||||||
|
'jsx',
|
||||||
|
'json',
|
||||||
|
'vue'
|
||||||
|
],
|
||||||
|
transform: {
|
||||||
|
'^.+\\.vue$': 'vue-jest',
|
||||||
|
'.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
|
||||||
|
'^.+\\.jsx?$': 'babel-jest'
|
||||||
|
},
|
||||||
|
moduleNameMapper: {
|
||||||
|
'^@/(.*)$': '<rootDir>/src/$1'
|
||||||
|
},
|
||||||
|
snapshotSerializers: [
|
||||||
|
'jest-serializer-vue'
|
||||||
|
],
|
||||||
|
testMatch: [
|
||||||
|
'**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
|
||||||
|
],
|
||||||
|
testURL: 'http://localhost/'
|
||||||
|
}
|
||||||
@@ -0,0 +1,80 @@
|
|||||||
|
{
|
||||||
|
"name": "d2-admin",
|
||||||
|
"version": "1.2.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"serve": "vue-cli-service serve --open",
|
||||||
|
"start": "vue-cli-service serve --open",
|
||||||
|
"dev": "vue-cli-service serve --open",
|
||||||
|
"build": "vue-cli-service build",
|
||||||
|
"lint": "vue-cli-service lint --fix",
|
||||||
|
"test:unit": "vue-cli-service test:unit",
|
||||||
|
"doc:dev": "vuepress dev docs",
|
||||||
|
"doc:build": "vuepress build docs"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"axios": "^0.17.1",
|
||||||
|
"babel-polyfill": "^6.26.0",
|
||||||
|
"better-scroll": "^1.12.1",
|
||||||
|
"clipboard-polyfill": "^2.4.1",
|
||||||
|
"countup.js": "^1.9.3",
|
||||||
|
"dayjs": "^1.6.7",
|
||||||
|
"echarts": "^4.1.0",
|
||||||
|
"element-ui": "^2.4.4",
|
||||||
|
"file-saver": "^1.3.3",
|
||||||
|
"flex.css": "^1.1.7",
|
||||||
|
"github-markdown-css": "^2.10.0",
|
||||||
|
"highlight.js": "^9.12.0",
|
||||||
|
"js-cookie": "^2.2.0",
|
||||||
|
"lodash": "^4.17.10",
|
||||||
|
"lowdb": "^1.0.0",
|
||||||
|
"marked": "^0.3.9",
|
||||||
|
"mockjs": "^1.0.1-beta3",
|
||||||
|
"papaparse": "^4.3.6",
|
||||||
|
"particles.js": "^2.0.0",
|
||||||
|
"quill": "^1.3.4",
|
||||||
|
"screenfull": "^3.3.2",
|
||||||
|
"simplemde": "^1.11.2",
|
||||||
|
"ua-parser-js": "^0.7.18",
|
||||||
|
"v-charts": "^1.17.6",
|
||||||
|
"v-contextmenu": "^2.7.0",
|
||||||
|
"vue": "^2.5.17",
|
||||||
|
"vue-grid-layout": "^2.1.11",
|
||||||
|
"vue-i18n": "^7.4.2",
|
||||||
|
"vue-json-tree-view": "^2.1.4",
|
||||||
|
"vue-router": "^3.0.1",
|
||||||
|
"vue-splitpane": "^1.0.2",
|
||||||
|
"vuex": "^3.0.1",
|
||||||
|
"xlsx": "^0.12.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@kazupon/vue-i18n-loader": "^0.3.0",
|
||||||
|
"@vue/cli-plugin-babel": "^3.0.0",
|
||||||
|
"@vue/cli-plugin-eslint": "^3.0.0",
|
||||||
|
"@vue/cli-plugin-unit-jest": "^3.0.0",
|
||||||
|
"@vue/cli-service": "^3.0.0",
|
||||||
|
"@vue/eslint-config-standard": "^3.0.0",
|
||||||
|
"@vue/test-utils": "^1.0.0-beta.20",
|
||||||
|
"babel-core": "7.0.0-bridge.0",
|
||||||
|
"babel-jest": "^23.0.1",
|
||||||
|
"lint-staged": "^7.2.0",
|
||||||
|
"node-sass": "^4.9.0",
|
||||||
|
"sass-loader": "^7.0.1",
|
||||||
|
"svg-sprite-loader": "^3.8.0",
|
||||||
|
"text-loader": "0.0.1",
|
||||||
|
"vue-template-compiler": "^2.5.17"
|
||||||
|
},
|
||||||
|
"gitHooks": {
|
||||||
|
"pre-commit": "lint-staged"
|
||||||
|
},
|
||||||
|
"lint-staged": {
|
||||||
|
"*.js": [
|
||||||
|
"vue-cli-service lint",
|
||||||
|
"git add"
|
||||||
|
],
|
||||||
|
"*.vue": [
|
||||||
|
"vue-cli-service lint",
|
||||||
|
"git add"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 359 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 48 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 20 KiB |
@@ -0,0 +1,180 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
|
<link rel="icon" href="<%= BASE_URL %>icon.ico">
|
||||||
|
<title><%= VUE_APP_TITLE %></title>
|
||||||
|
<style>
|
||||||
|
html, body, #app {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
.d2-app-loading-group {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
background: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.15) 100%), radial-gradient(at top center, rgba(255,255,255,0.40) 0%, rgba(0,0,0,0.40) 120%) #989898;
|
||||||
|
background-blend-mode: multiply,multiply;
|
||||||
|
}
|
||||||
|
.d2-app-loading-title {
|
||||||
|
color: #FFF;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-top: 40px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
letter-spacing: 0.2em;
|
||||||
|
}
|
||||||
|
.d2-app-loading-sub-title {
|
||||||
|
color: #FFF;
|
||||||
|
font-size: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.d2-app-loading-sub-info {
|
||||||
|
color: #FFF;
|
||||||
|
font-size: 10px;
|
||||||
|
opacity: .8;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
.d2-app-loading-btn {
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 1;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #fff;
|
||||||
|
border: 1px solid #dcdfe6;
|
||||||
|
border-color: #dcdfe6;
|
||||||
|
color: #606266;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
text-align: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
outline: none;
|
||||||
|
margin: 0;
|
||||||
|
transition: .1s;
|
||||||
|
font-weight: 500;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
padding: 12px 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
border-radius: 4px;
|
||||||
|
/* 圆角 */
|
||||||
|
padding: 7px 15px;
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.d2-app-loading-grid {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.d2-app-loading-grid .d2-app-loading {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background-color: #FFF;
|
||||||
|
float: left;
|
||||||
|
-webkit-animation: d2-app-loading-grid-scale-delay 1.3s infinite ease-in-out;
|
||||||
|
animation: d2-app-loading-grid-scale-delay 1.3s infinite ease-in-out;
|
||||||
|
}
|
||||||
|
.d2-app-loading-grid .d2-app-loading1 {
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
-webkit-animation-delay: 0.2s;
|
||||||
|
animation-delay: 0.2s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading2 {
|
||||||
|
-webkit-animation-delay: 0.3s;
|
||||||
|
animation-delay: 0.3s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading3 {
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
-webkit-animation-delay: 0.4s;
|
||||||
|
animation-delay: 0.4s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading4 {
|
||||||
|
-webkit-animation-delay: 0.1s;
|
||||||
|
animation-delay: 0.1s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading5 {
|
||||||
|
-webkit-animation-delay: 0.2s;
|
||||||
|
animation-delay: 0.2s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading6 {
|
||||||
|
-webkit-animation-delay: 0.3s;
|
||||||
|
animation-delay: 0.3s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading7 {
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
-webkit-animation-delay: 0s;
|
||||||
|
animation-delay: 0s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading8 {
|
||||||
|
-webkit-animation-delay: 0.1s;
|
||||||
|
animation-delay: 0.1s; }
|
||||||
|
.d2-app-loading-grid .d2-app-loading9 {
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
-webkit-animation-delay: 0.2s;
|
||||||
|
animation-delay: 0.2s; }
|
||||||
|
|
||||||
|
@-webkit-keyframes d2-app-loading-grid-scale-delay {
|
||||||
|
0%, 70%, 100% {
|
||||||
|
-webkit-transform: scale3D(1, 1, 1);
|
||||||
|
transform: scale3D(1, 1, 1);
|
||||||
|
} 35% {
|
||||||
|
-webkit-transform: scale3D(0, 0, 1);
|
||||||
|
transform: scale3D(0, 0, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes d2-app-loading-grid-scale-delay {
|
||||||
|
0%, 70%, 100% {
|
||||||
|
-webkit-transform: scale3D(1, 1, 1);
|
||||||
|
transform: scale3D(1, 1, 1);
|
||||||
|
} 35% {
|
||||||
|
-webkit-transform: scale3D(0, 0, 1);
|
||||||
|
transform: scale3D(0, 0, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script>
|
||||||
|
// 感谢您使用 D2Admin
|
||||||
|
// D2Admin 完全开源免费,并且长期更新维护
|
||||||
|
// 下面的百度统计代码不会拖慢您的应用速度也不会占用多少网络带宽,我们只是想统计一下我们的用户量
|
||||||
|
// 所以希望您不要删除我们的统计代码,让我们知道有更多人的在使用,给我们继续开发的动力
|
||||||
|
var _hmt = _hmt || [];
|
||||||
|
(function() {
|
||||||
|
var hm = document.createElement("script");
|
||||||
|
hm.src = "https://hm.baidu.com/hm.js?de358376fd85791edd2acd3049956aa3";
|
||||||
|
var s = document.getElementsByTagName("script")[0];
|
||||||
|
s.parentNode.insertBefore(hm, s);
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
<script src="./script/ua-parser.min.js"></script>
|
||||||
|
<script src="./script/ua.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<noscript>
|
||||||
|
<strong>We're sorry but d2-admin-start-kit-cli3 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||||
|
</noscript>
|
||||||
|
<div id="app">
|
||||||
|
<div class="d2-app-loading-group">
|
||||||
|
<div class="d2-app-loading-grid">
|
||||||
|
<div class="d2-app-loading d2-app-loading1"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading2"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading3"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading4"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading5"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading6"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading7"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading8"></div>
|
||||||
|
<div class="d2-app-loading d2-app-loading9"></div>
|
||||||
|
</div>
|
||||||
|
<div class="d2-app-loading-title">加载中</div>
|
||||||
|
<div class="d2-app-loading-sub-title">欢迎使用 D2Admin 进行你的开发,初次加载会比较慢,请耐心等待</div>
|
||||||
|
<div class="d2-app-loading-sub-info">如果很久很久都没有加载成功,请清空缓存重新加载页面</div>
|
||||||
|
<div style="margin-top: 10px;">
|
||||||
|
<a class="d2-app-loading-btn" href="https://github.com/d2-projects/d2-admin" target="blank">Github仓库</a>
|
||||||
|
<a class="d2-app-loading-btn" href="http://d2admin.fairyever.com/zh/" target="blank">中文文档</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- built files will be auto injected -->
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<title>提示信息</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>请不要使用手机浏览</h1>
|
||||||
|
<!-- 请自行完善此页面 -->
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
# 一级标题
|
||||||
|
|
||||||
|
| ID | Name | Email |
|
||||||
|
| --- | --- | --- |
|
||||||
|
| 0001 | FairyEver | 1711467488@qq.com |
|
||||||
|
|
||||||
|
```
|
||||||
|
alert('Hello World')
|
||||||
|
```
|
||||||
|
|
||||||
|
一般引用
|
||||||
|
|
||||||
|
> 引用文字
|
||||||
|
|
||||||
|
分享一个我很早前的一副设计作品 [in Lofter](http://fairyever.lofter.com/post/16ff00_6796fe8) 借此演示百度云链接的显示优化
|
||||||
|
|
||||||
|
> https://pan.baidu.com/s/1kW6uUwB
|
||||||
|
|
||||||
|
设计源文件
|
||||||
|
|
||||||
|
> 链接: https://pan.baidu.com/s/1ggFW21l 密码: 877y
|
||||||
|
|
||||||
|
[https://github.com/d2-projects](https://github.com/d2-projects)
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
|
||||||
|
var parser = new UAParser()
|
||||||
|
|
||||||
|
var uaResult = parser.getResult()
|
||||||
|
|
||||||
|
if (uaResult.device.type === 'mobile') {
|
||||||
|
window.location.href = './is-mobile.html'
|
||||||
|
}
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
<template>
|
||||||
|
<div id="app">
|
||||||
|
<router-view/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'app'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@import '~@/assets/style/public-class.scss';
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
// 过渡动画 横向渐变
|
||||||
|
.fade-transverse-leave-active,
|
||||||
|
.fade-transverse-enter-active {
|
||||||
|
transition: all .5s;
|
||||||
|
}
|
||||||
|
.fade-transverse-enter {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(-30px);
|
||||||
|
}
|
||||||
|
.fade-transverse-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(30px);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 过渡动画 缩放渐变
|
||||||
|
.fade-scale-leave-active,
|
||||||
|
.fade-scale-enter-active {
|
||||||
|
transition: all .5s;
|
||||||
|
}
|
||||||
|
.fade-scale-enter {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale(1.2);
|
||||||
|
}
|
||||||
|
.fade-scale-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale(0.8);
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
// 优化显示
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
margin: 0px;
|
||||||
|
height: 100%;
|
||||||
|
font-family: "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif;
|
||||||
|
#app {
|
||||||
|
@extend %full;
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,20 @@
|
|||||||
|
// element 样式补丁
|
||||||
|
|
||||||
|
.el-card {
|
||||||
|
&.is-always-shadow {
|
||||||
|
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
|
||||||
|
}
|
||||||
|
&.is-hover-shadow {
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-menu--horizontal {
|
||||||
|
border-bottom: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-tabs__item:focus.is-active.is-focus:not(:active) {
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
// markdown 样式补丁
|
||||||
|
|
||||||
|
.markdown-body {
|
||||||
|
ul {
|
||||||
|
list-style: disc;
|
||||||
|
}
|
||||||
|
h1, h2 {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,5 @@
|
|||||||
|
.tree-view-wrapper.tree-view-small {
|
||||||
|
.tree-view-item {
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
// vue-splitpane 样式补丁
|
||||||
|
|
||||||
|
.vue-grid-item {
|
||||||
|
&.vue-grid-placeholder {
|
||||||
|
border: 1px solid $color-border-1;
|
||||||
|
background-color: rgba(#FFF, .3);
|
||||||
|
opacity: 1;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
// vue-splitpane 样式补丁
|
||||||
|
|
||||||
|
@import '~@/assets/style/unit/color.scss';
|
||||||
|
|
||||||
|
.splitter-pane-resizer {
|
||||||
|
background-color: $color-border-1 !important;
|
||||||
|
opacity: 1 !important;
|
||||||
|
}
|
||||||
@@ -0,0 +1,73 @@
|
|||||||
|
@import 'public';
|
||||||
|
|
||||||
|
// 补丁 base
|
||||||
|
@import '~@/assets/style/fixed/base.scss';
|
||||||
|
// 补丁 element
|
||||||
|
@import '~@/assets/style/fixed/element.scss';
|
||||||
|
// 补丁 markdown
|
||||||
|
@import '~@/assets/style/fixed/markdown.scss';
|
||||||
|
// 补丁 vue-splitpane
|
||||||
|
@import '~@/assets/style/fixed/vue-splitpane.scss';
|
||||||
|
// 补丁 vue-grid-layout
|
||||||
|
@import '~@/assets/style/fixed/vue-grid-layout.scss';
|
||||||
|
// 补丁 tree-view
|
||||||
|
@import '~@/assets/style/fixed/tree-view.scss';
|
||||||
|
|
||||||
|
// 动画
|
||||||
|
@import '~@/assets/style/animate/vue-transition.scss';
|
||||||
|
|
||||||
|
// 在这里写公用的class
|
||||||
|
// 注意 这个文件里只写class
|
||||||
|
// mixin等内容请在 public.scss 里书写
|
||||||
|
|
||||||
|
// 文字相关
|
||||||
|
.#{$prefix}-text-center {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 浮动相关
|
||||||
|
.#{$prefix}-fl {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.#{$prefix}-fr {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.#{$prefix}-clearfix:before,
|
||||||
|
.#{$prefix}-clearfix:after {
|
||||||
|
display: table;
|
||||||
|
content: "";
|
||||||
|
}
|
||||||
|
.#{$prefix}-clearfix:after {
|
||||||
|
clear: both
|
||||||
|
}
|
||||||
|
|
||||||
|
// 边距相关
|
||||||
|
$sizes: (0, 5, 10, 15, 20);
|
||||||
|
|
||||||
|
@for $index from 1 to 6 {
|
||||||
|
.#{$prefix}-m-#{nth($sizes, $index)} { margin: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-mt-#{nth($sizes, $index)} { margin-top: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-mr-#{nth($sizes, $index)} { margin-right: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-mb-#{nth($sizes, $index)} { margin-bottom: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-ml-#{nth($sizes, $index)} { margin-left: #{nth($sizes, $index)}px !important; }
|
||||||
|
|
||||||
|
.#{$prefix}-p-#{nth($sizes, $index)} { padding: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-pt-#{nth($sizes, $index)} { padding-top: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-pr-#{nth($sizes, $index)} { padding-right: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-pb-#{nth($sizes, $index)} { padding-bottom: #{nth($sizes, $index)}px !important; }
|
||||||
|
.#{$prefix}-pl-#{nth($sizes, $index)} { padding-left: #{nth($sizes, $index)}px !important; }
|
||||||
|
}
|
||||||
|
|
||||||
|
// 快速使用
|
||||||
|
|
||||||
|
.#{$prefix}-m { margin: 20px !important; }
|
||||||
|
.#{$prefix}-mt { margin-top: 20px !important; }
|
||||||
|
.#{$prefix}-mr { margin-right: 20px !important; }
|
||||||
|
.#{$prefix}-mb { margin-bottom: 20px !important; }
|
||||||
|
.#{$prefix}-ml { margin-left: 20px !important; }
|
||||||
|
|
||||||
|
.#{$prefix}-p { padding: 20px !important; }
|
||||||
|
.#{$prefix}-pt { padding-top: 20px !important; }
|
||||||
|
.#{$prefix}-pr { padding-right: 20px !important; }
|
||||||
|
.#{$prefix}-pb { padding-bottom: 20px !important; }
|
||||||
|
.#{$prefix}-pl { padding-left: 20px !important; }
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
@import '~@/assets/style/unit/color.scss';
|
||||||
|
|
||||||
|
// 工具类名统一前缀
|
||||||
|
$prefix: d2;
|
||||||
|
|
||||||
|
// 禁止用户选中 鼠标变为手形
|
||||||
|
%unable-select {
|
||||||
|
user-select: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 填满父元素
|
||||||
|
// 组要父元素 position: relative | absolute;
|
||||||
|
%full {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// flex 垂直水平居中
|
||||||
|
%flex-center-row {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
%flex-center-col {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 将元素模拟成卡片外观
|
||||||
|
%card {
|
||||||
|
border: 1px solid #dddee1;
|
||||||
|
border-color: #e9eaec;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'd2';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #ebf1f6;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, 0);
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: rgba(#FFF, 1);
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid #cfd7e5;
|
||||||
|
$theme-container-border-outer: 1px solid #cfd7e5;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: $color-text-normal;
|
||||||
|
$theme-multiple-page-control-color-active: #2f74ff;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-border-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFF;
|
||||||
|
$theme-multiple-page-control-background-color: rgba(#000, .03);
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #293849;
|
||||||
|
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: $color-text-normal;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: #2f74ff;
|
||||||
|
$theme-header-item-background-color-hover: rgba(#FFF, .5);
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: #2f74ff;
|
||||||
|
$theme-header-item-background-color-focus: rgba(#FFF, .5);
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: #2f74ff;
|
||||||
|
$theme-header-item-background-color-active: rgba(#FFF, .5);
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: $color-text-normal;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: #2f74ff;
|
||||||
|
$theme-aside-item-background-color-hover: rgba(#FFF, .5);
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: #2f74ff;
|
||||||
|
$theme-aside-item-background-color-focus: rgba(#FFF, .5);
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: #2f74ff;
|
||||||
|
$theme-aside-item-background-color-active: rgba(#FFF, .5);
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: $color-text-normal;
|
||||||
|
$theme-aside-menu-empty-text-color: $color-text-normal;
|
||||||
|
$theme-aside-menu-empty-background-color: rgba(#000, .03);
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: $color-text-main;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: $color-text-main;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'line';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #f8f8f9;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, 0);
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: rgba(#FFF, .8);
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid $color-border-2;
|
||||||
|
$theme-container-border-outer: 1px solid #cfd7e5;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: #FFF;
|
||||||
|
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-border-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFF;
|
||||||
|
$theme-multiple-page-control-background-color: #cfd7e5;
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #293849;
|
||||||
|
$theme-menu-item-background-color-hover: #EFEFEF;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: $color-text-normal;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: $color-text-main;
|
||||||
|
$theme-header-item-background-color-hover: rgba(#000, .02);
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: $color-text-main;
|
||||||
|
$theme-header-item-background-color-focus: rgba(#000, .02);
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: $color-text-main;
|
||||||
|
$theme-header-item-background-color-active: rgba(#000, .03);
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: $color-text-normal;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: $color-text-main;
|
||||||
|
$theme-aside-item-background-color-hover: rgba(#000, .02);
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: $color-text-main;
|
||||||
|
$theme-aside-item-background-color-focus: rgba(#000, .02);
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: $color-text-main;
|
||||||
|
$theme-aside-item-background-color-active: rgba(#000, .03);
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: $color-text-normal;
|
||||||
|
$theme-aside-menu-empty-text-color: $color-text-normal;
|
||||||
|
$theme-aside-menu-empty-background-color: rgba(#000, .03);
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: $color-text-main;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: $color-text-main;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
@import '~@/assets/style/public.scss';
|
||||||
|
@import '~@/assets/style/theme/theme-base.scss';
|
||||||
|
|
||||||
|
@import '~@/assets/style/theme/d2/index.scss';
|
||||||
|
@import '~@/assets/style/theme/line/index.scss';
|
||||||
|
@import '~@/assets/style/theme/star/index.scss';
|
||||||
|
@import '~@/assets/style/theme/tomorrow-night-blue/index.scss';
|
||||||
|
@import '~@/assets/style/theme/violet/index.scss';
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'star';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #EFF4F8;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, .3);
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: rgba(#FFF, .9);
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid $color-border-1;
|
||||||
|
$theme-container-border-outer: 1px solid #114450;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: #FFF;
|
||||||
|
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||||
|
$theme-multiple-page-control-border-color: #114450;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFF;
|
||||||
|
$theme-multiple-page-control-background-color: rgba(#FFF, .5);
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #293849;
|
||||||
|
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: #FFF;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: #FFF;
|
||||||
|
$theme-header-item-background-color-hover: rgba(#000, .2);
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: #FFF;
|
||||||
|
$theme-header-item-background-color-focus: rgba(#000, .2);
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: #FFF;
|
||||||
|
$theme-header-item-background-color-active: rgba(#000, .3);
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: #FFF;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: #FFF;
|
||||||
|
$theme-aside-item-background-color-hover: rgba(#000, .2);
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: #FFF;
|
||||||
|
$theme-aside-item-background-color-focus: rgba(#000, .2);
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: #FFF;
|
||||||
|
$theme-aside-item-background-color-active: rgba(#000, .3);
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: #FFF;
|
||||||
|
$theme-aside-menu-empty-text-color: #FFF;
|
||||||
|
$theme-aside-menu-empty-background-color: rgba(#FFF, .2);
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: #FFF;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: #FFF;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: rgba(#FFF, .3);
|
||||||
@@ -0,0 +1,405 @@
|
|||||||
|
// 减小弹出菜单的项目高度
|
||||||
|
.el-menu--popup {
|
||||||
|
.el-menu-item {
|
||||||
|
height: 36px;
|
||||||
|
line-height: 36px;
|
||||||
|
}
|
||||||
|
.el-submenu__title {
|
||||||
|
height: 36px;
|
||||||
|
line-height: 36px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 整体框架结构
|
||||||
|
.d2-layout-header-aside-group {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
min-width: 900px;
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
// 背景上面的半透明遮罩
|
||||||
|
.d2-layout-header-aside-mask {
|
||||||
|
@extend %full;
|
||||||
|
}
|
||||||
|
// 内容层
|
||||||
|
.d2-layout-header-aside-content {
|
||||||
|
@extend %full;
|
||||||
|
$d2-theme-header-height: 60px;
|
||||||
|
.d2-theme-header {
|
||||||
|
height: $d2-theme-header-height;
|
||||||
|
}
|
||||||
|
.d2-theme-container {
|
||||||
|
.d2-theme-container-aside {
|
||||||
|
transition: width .3s;
|
||||||
|
position: relative;
|
||||||
|
.d2-layout-header-aside-menu-side {
|
||||||
|
@extend %full;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-theme-container-main {
|
||||||
|
padding: 0px;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-theme-container-main-body {
|
||||||
|
flex-grow: 1;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 主题公用
|
||||||
|
.d2-layout-header-aside-group {
|
||||||
|
&.grayMode {
|
||||||
|
-webkit-filter: grayscale(100%);
|
||||||
|
-moz-filter: grayscale(100%);
|
||||||
|
-ms-filter: grayscale(100%);
|
||||||
|
-o-filter: grayscale(100%);
|
||||||
|
filter: grayscale(100%);
|
||||||
|
filter: gray;
|
||||||
|
}
|
||||||
|
// 主体
|
||||||
|
.d2-layout-header-aside-content {
|
||||||
|
// [布局] 顶栏
|
||||||
|
.d2-theme-header {
|
||||||
|
// logo区域
|
||||||
|
.logo-group {
|
||||||
|
transition: width .3s;
|
||||||
|
float: left;
|
||||||
|
text-align: center;
|
||||||
|
img {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 折叠侧边栏切换按钮
|
||||||
|
.toggle-aside-btn {
|
||||||
|
float: left;
|
||||||
|
height: 60px;
|
||||||
|
width: 60px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
@extend %unable-select;
|
||||||
|
i {
|
||||||
|
font-size: 20px;
|
||||||
|
margin-top: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [菜单] 顶栏
|
||||||
|
.el-menu {
|
||||||
|
float: left;
|
||||||
|
border-bottom: none;
|
||||||
|
background-color: transparent;
|
||||||
|
%header-menu-item {
|
||||||
|
@extend %unable-select;
|
||||||
|
i.fa {
|
||||||
|
font-size: 16px;
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-menu-item {
|
||||||
|
@extend %header-menu-item;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.el-submenu {
|
||||||
|
@extend %header-menu-item;
|
||||||
|
.el-submenu__title {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 顶栏右侧的按钮
|
||||||
|
.d2-header-right {
|
||||||
|
float: right;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.btn-text {
|
||||||
|
padding: 14px 12px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin: 0px !important;
|
||||||
|
margin-left: 10px !important;
|
||||||
|
}
|
||||||
|
.el-dropdown {
|
||||||
|
@extend %unable-select;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [布局] 顶栏下面
|
||||||
|
.d2-theme-container {
|
||||||
|
// 侧边栏
|
||||||
|
.d2-theme-container-aside {
|
||||||
|
%d2-theme-container-aside-menu-icon {
|
||||||
|
width: 20px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
// [菜单] 正常状态
|
||||||
|
.el-menu {
|
||||||
|
@extend %unable-select;
|
||||||
|
background-color: transparent;
|
||||||
|
border-right: none;
|
||||||
|
.el-menu-item {
|
||||||
|
i {
|
||||||
|
@extend %d2-theme-container-aside-menu-icon;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-submenu {
|
||||||
|
@extend %unable-select;
|
||||||
|
.el-submenu__title {
|
||||||
|
i {
|
||||||
|
@extend %d2-theme-container-aside-menu-icon;
|
||||||
|
}
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
margin-top: -10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 菜单为空的时候显示的信息
|
||||||
|
.d2-layout-header-aside-menu-empty {
|
||||||
|
height: 160px;
|
||||||
|
margin: 10px;
|
||||||
|
margin-top: 0px;
|
||||||
|
border-radius: 4px;
|
||||||
|
@extend %unable-select;
|
||||||
|
i {
|
||||||
|
font-size: 30px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [菜单] 折叠状态
|
||||||
|
.el-menu--collapse {
|
||||||
|
background-color: transparent;
|
||||||
|
.el-submenu__title {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 右下 主体
|
||||||
|
.d2-theme-container-main {
|
||||||
|
// 主体部分分为多页面控制器 和主体
|
||||||
|
.d2-theme-container-main-header {
|
||||||
|
// 多页面控制器
|
||||||
|
.d2-multiple-page-control-group {
|
||||||
|
padding-right: 20px;
|
||||||
|
.d2-multiple-page-control-content {
|
||||||
|
overflow: auto;
|
||||||
|
position: relative;
|
||||||
|
.d2-multiple-page-control-content-inner {
|
||||||
|
.d2-multiple-page-control {
|
||||||
|
.el-tabs__header.is-top {
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
.el-tabs__nav {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-multiple-page-control-btn {
|
||||||
|
position: relative;
|
||||||
|
bottom: -1px;
|
||||||
|
.el-dropdown {
|
||||||
|
.el-button-group {
|
||||||
|
.el-button:first-child {
|
||||||
|
border-bottom-left-radius: 0px;
|
||||||
|
}
|
||||||
|
.el-button:last-child {
|
||||||
|
border-bottom-right-radius: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 主体
|
||||||
|
.d2-theme-container-main-body {
|
||||||
|
// 布局组件
|
||||||
|
.container-component {
|
||||||
|
@extend %full;
|
||||||
|
overflow: hidden;
|
||||||
|
// 填充式布局组件
|
||||||
|
.d2-container-full {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-full__header {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.d2-container-full__body {
|
||||||
|
flex-grow: 1;
|
||||||
|
padding: 20px 20px;
|
||||||
|
overflow: auto;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.d2-container-full__footer {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 填充式布局组件 - 滚动优化
|
||||||
|
.d2-container-full-bs {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-full-bs__header {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.d2-container-full-bs__body {
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
.d2-container-full-bs__body-wrapper-inner {
|
||||||
|
padding: 20px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-container-full-bs__footer {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 隐形布局组件
|
||||||
|
.d2-container-ghost {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-ghost__header {
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
.d2-container-ghost__body {
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: auto;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.d2-container-ghost__footer {
|
||||||
|
padding: 20px;
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 隐形布局组件 - 滚动优化
|
||||||
|
.d2-container-ghost-bs {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-ghost-bs__header {
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
.d2-container-ghost-bs__body {
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.d2-container-ghost-bs__footer {
|
||||||
|
padding: 20px;
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 卡片式布局组件
|
||||||
|
.d2-container-card {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-card__header {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.d2-container-card__body {
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: auto;
|
||||||
|
.d2-container-card__body-card {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-container-card__footer {
|
||||||
|
padding: 20px;
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 卡片式布局组件 - 滚动优化
|
||||||
|
.d2-container-card-bs {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 20px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-card-bs__header {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.d2-container-card-bs__body {
|
||||||
|
position: relative;
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
.d2-container-card-bs__body-wrapper-inner {
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
.d2-container-card-bs__body-card {
|
||||||
|
position: relative;
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-container-card-bs__footer {
|
||||||
|
padding: 20px;
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,393 @@
|
|||||||
|
// 每个主题特有的设置
|
||||||
|
.theme-#{$theme-name} {
|
||||||
|
|
||||||
|
.el-card {
|
||||||
|
&.d2-card {
|
||||||
|
border: $theme-container-border-outer;
|
||||||
|
.el-card__header {
|
||||||
|
border-bottom: $theme-container-border-outer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 背景图片和遮罩
|
||||||
|
.d2-layout-header-aside-group {
|
||||||
|
background-color: $theme-bg-color;
|
||||||
|
.d2-layout-header-aside-mask {
|
||||||
|
background: $theme-bg-mask;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 菜单项目
|
||||||
|
@mixin theme-menu-hover-style {
|
||||||
|
color: $theme-menu-item-color-hover;
|
||||||
|
i.fa {
|
||||||
|
color: $theme-menu-item-color-hover;
|
||||||
|
}
|
||||||
|
background: $theme-menu-item-background-color-hover;
|
||||||
|
}
|
||||||
|
%el-menu-icon {
|
||||||
|
i {
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 5px;
|
||||||
|
svg {
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-submenu__title {
|
||||||
|
@extend %unable-select;
|
||||||
|
@extend %el-menu-icon;
|
||||||
|
}
|
||||||
|
.el-menu-item {
|
||||||
|
@extend %unable-select;
|
||||||
|
@extend %el-menu-icon;
|
||||||
|
}
|
||||||
|
.el-submenu__title:hover {
|
||||||
|
@include theme-menu-hover-style;
|
||||||
|
}
|
||||||
|
.el-menu-item:hover {
|
||||||
|
@include theme-menu-hover-style;
|
||||||
|
}
|
||||||
|
.el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
|
||||||
|
@include theme-menu-hover-style;
|
||||||
|
}
|
||||||
|
.el-menu--horizontal .el-menu .el-submenu__title:hover {
|
||||||
|
@include theme-menu-hover-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 顶栏
|
||||||
|
.d2-theme-header {
|
||||||
|
// 切换按钮
|
||||||
|
.toggle-aside-btn {
|
||||||
|
i {
|
||||||
|
color: $theme-header-item-color;
|
||||||
|
background: $theme-header-item-background-color;
|
||||||
|
&:hover {
|
||||||
|
color: $theme-header-item-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 顶栏菜单
|
||||||
|
.el-menu {
|
||||||
|
.el-menu-item {
|
||||||
|
transition: border-top-color 0s;
|
||||||
|
color: $theme-header-item-color;
|
||||||
|
background: $theme-header-item-background-color;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
&:hover {
|
||||||
|
color: $theme-header-item-color-hover;
|
||||||
|
background: $theme-header-item-background-color-hover;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
}
|
||||||
|
&:focus {
|
||||||
|
color: $theme-header-item-color-focus;
|
||||||
|
background: $theme-header-item-background-color-focus;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
}
|
||||||
|
&.is-active {
|
||||||
|
color: $theme-header-item-color-active;
|
||||||
|
background: $theme-header-item-background-color-active;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-submenu {
|
||||||
|
.el-submenu__title {
|
||||||
|
transition: border-top-color 0s;
|
||||||
|
color: $theme-header-item-color;
|
||||||
|
background: $theme-header-item-background-color;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
color: $theme-header-item-color;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: $theme-header-item-color-hover;
|
||||||
|
background: $theme-header-item-background-color-hover;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
color: $theme-header-item-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:focus {
|
||||||
|
color: $theme-header-item-color-focus;
|
||||||
|
background: $theme-header-item-background-color-focus;
|
||||||
|
i.fa { color: inherit; }
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
color: $theme-header-item-color-focus;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 顶栏右侧
|
||||||
|
.d2-header-right {
|
||||||
|
.btn-text {
|
||||||
|
color: $theme-header-item-color;
|
||||||
|
&.can-hover {
|
||||||
|
&:hover {
|
||||||
|
color: $theme-header-item-color-hover;
|
||||||
|
background: $theme-header-item-background-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [布局] 顶栏下面
|
||||||
|
.d2-theme-container {
|
||||||
|
// 侧边栏
|
||||||
|
.d2-theme-container-aside {
|
||||||
|
// 菜单为空的时候显示的信息
|
||||||
|
.d2-layout-header-aside-menu-empty {
|
||||||
|
background: $theme-aside-menu-empty-background-color;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-menu-empty-icon-color;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
color: $theme-aside-menu-empty-text-color;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
background: $theme-aside-menu-empty-background-color-hover;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-menu-empty-icon-color-hover;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
color: $theme-aside-menu-empty-text-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [菜单] 正常状态
|
||||||
|
.el-menu {
|
||||||
|
.el-menu-item {
|
||||||
|
color: $theme-aside-item-color;
|
||||||
|
background: $theme-aside-item-background-color;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: $theme-aside-item-color-hover;
|
||||||
|
background: $theme-aside-item-background-color-hover;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:focus {
|
||||||
|
color: $theme-aside-item-color-focus;
|
||||||
|
background: $theme-aside-item-background-color-focus;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color-focus;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.is-active {
|
||||||
|
color: $theme-aside-item-color-active;
|
||||||
|
background: $theme-aside-item-background-color-active;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color-active;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-submenu {
|
||||||
|
.el-submenu__title {
|
||||||
|
color: $theme-aside-item-color;
|
||||||
|
background: $theme-aside-item-background-color;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color;
|
||||||
|
}
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
color: $theme-aside-item-color;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: $theme-aside-item-color-hover;
|
||||||
|
background: $theme-aside-item-background-color-hover;
|
||||||
|
i {
|
||||||
|
color: $theme-aside-item-color-hover;
|
||||||
|
}
|
||||||
|
.el-submenu__icon-arrow {
|
||||||
|
color: $theme-aside-item-color-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-theme-container-main {
|
||||||
|
// 主体部分分为多页面控制器 和主体
|
||||||
|
.d2-theme-container-main-header {
|
||||||
|
// 多页面控制器
|
||||||
|
.d2-multiple-page-control {
|
||||||
|
.el-tabs__header.is-top {
|
||||||
|
border-bottom-color: $theme-multiple-page-control-border-color;
|
||||||
|
}
|
||||||
|
.el-tabs__nav {
|
||||||
|
border-color: $theme-multiple-page-control-border-color;
|
||||||
|
.el-tabs__item {
|
||||||
|
@extend %unable-select;
|
||||||
|
color: $theme-multiple-page-control-color;
|
||||||
|
background-color: $theme-multiple-page-control-background-color;
|
||||||
|
border-left-color: $theme-multiple-page-control-border-color;
|
||||||
|
&:first-child {
|
||||||
|
border-left: none;
|
||||||
|
&:hover {
|
||||||
|
padding: 0px 20px;
|
||||||
|
}
|
||||||
|
.el-icon-close {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-tabs__item.is-active {
|
||||||
|
color: $theme-multiple-page-control-color-active;
|
||||||
|
background-color: $theme-multiple-page-control-background-color-active;
|
||||||
|
border-bottom-color: $theme-multiple-page-control-border-color-active;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
%el-tabs__nav {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.el-tabs__nav-prev {
|
||||||
|
@extend %el-tabs__nav;
|
||||||
|
color: $theme-multiple-page-control-nav-prev-color;
|
||||||
|
}
|
||||||
|
.el-tabs__nav-next {
|
||||||
|
@extend %el-tabs__nav;
|
||||||
|
color: $theme-multiple-page-control-nav-next-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 多页控制器的关闭控制
|
||||||
|
.d2-multiple-page-control-btn {
|
||||||
|
.el-dropdown {
|
||||||
|
.el-button-group {
|
||||||
|
.el-button {
|
||||||
|
border-color: $theme-multiple-page-control-border-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 主体
|
||||||
|
.d2-theme-container-main-body {
|
||||||
|
// 布局组件
|
||||||
|
.container-component {
|
||||||
|
// [组件]
|
||||||
|
// d2-container-full 填充型
|
||||||
|
.d2-container-full {
|
||||||
|
border: $theme-container-border-outer;
|
||||||
|
border-top: none;
|
||||||
|
border-bottom: none;
|
||||||
|
.d2-container-full__header {
|
||||||
|
border-bottom: $theme-container-border-inner;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-full__body {
|
||||||
|
background: $theme-container-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-full__footer {
|
||||||
|
border-top: $theme-container-border-inner;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [组件]
|
||||||
|
// d2-container-full-bs 填充型 滚动优化
|
||||||
|
.d2-container-full-bs {
|
||||||
|
border: $theme-container-border-outer;
|
||||||
|
border-top: none;
|
||||||
|
border-bottom: none;
|
||||||
|
.d2-container-full-bs__header {
|
||||||
|
border-bottom: $theme-container-border-inner;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-full-bs__body {
|
||||||
|
background: $theme-container-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-full-bs__footer {
|
||||||
|
border-top: $theme-container-border-inner;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [组件]
|
||||||
|
// d2-container-ghost 隐形布局组件
|
||||||
|
.d2-container-ghost {
|
||||||
|
.d2-container-ghost__header {
|
||||||
|
border-bottom: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-ghost__footer {
|
||||||
|
border-top: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [组件]
|
||||||
|
// d2-container-ghost-bs 隐形布局组件 滚动优化
|
||||||
|
.d2-container-ghost-bs {
|
||||||
|
.d2-container-ghost-bs__header {
|
||||||
|
border-bottom: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-ghost-bs__footer {
|
||||||
|
border-top: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [组件]
|
||||||
|
// d2-container-card 卡片型
|
||||||
|
.d2-container-card {
|
||||||
|
.d2-container-card__header {
|
||||||
|
border-bottom: $theme-container-border-inner;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-card__body {
|
||||||
|
.d2-container-card__body-card {
|
||||||
|
background: $theme-container-background-color;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
border-bottom: $theme-container-border-outer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-container-card__footer {
|
||||||
|
border-top: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// [组件]
|
||||||
|
// d2-container-card-bs 卡片型 滚动优化
|
||||||
|
.d2-container-card-bs {
|
||||||
|
.d2-container-card-bs__header {
|
||||||
|
border-bottom: $theme-container-border-inner;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
.d2-container-card-bs__body {
|
||||||
|
.d2-container-card-bs__body-card {
|
||||||
|
background: $theme-container-background-color;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
border-bottom: $theme-container-border-outer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d2-container-card-bs__footer {
|
||||||
|
border-top: $theme-container-border-outer;
|
||||||
|
border-left: $theme-container-border-outer;
|
||||||
|
border-right: $theme-container-border-outer;
|
||||||
|
background: $theme-container-header-footer-background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'tomorrow-night-blue';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #002253;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, 0);
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: rgba(#FFF, 1);
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid $color-border-1;
|
||||||
|
$theme-container-border-outer: 1px solid #002253;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: #FFF;
|
||||||
|
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||||
|
$theme-multiple-page-control-border-color: #002253;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFF;
|
||||||
|
$theme-multiple-page-control-background-color: rgba(#FFF, .2);
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #293849;
|
||||||
|
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: #FF929A;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: #FFEBA4;
|
||||||
|
$theme-header-item-background-color-hover: rgba(#FFF, .05);
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: #FFB870;
|
||||||
|
$theme-header-item-background-color-focus: rgba(#FFF, .05);
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: #FFB870;
|
||||||
|
$theme-header-item-background-color-active: rgba(#FFF, .05);
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: #FF929A;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: #FFEBA4;
|
||||||
|
$theme-aside-item-background-color-hover: rgba(#FFF, .05);
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: #FFB870;
|
||||||
|
$theme-aside-item-background-color-focus: rgba(#FFF, .05);
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: #FFB870;
|
||||||
|
$theme-aside-item-background-color-active: rgba(#FFF, .05);
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: #FFB870;
|
||||||
|
$theme-aside-menu-empty-text-color: #FFB870;
|
||||||
|
$theme-aside-menu-empty-background-color: rgba(#FFF, .1);
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: #FFEBA4;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: #FFEBA4;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: rgba(#FFF, .2);
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
|
|
||||||
|
.theme-#{$theme-name} {
|
||||||
|
.d2-layout-header-aside-group {
|
||||||
|
background: #bc00e3;
|
||||||
|
background: linear-gradient(120deg, #bc00e3 0%, #4EFFFB 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'violet';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #000;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, 0);
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: #FFF;
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid $color-border-2;
|
||||||
|
$theme-container-border-outer: 1px solid #8C40E2;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: #FFF;
|
||||||
|
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||||
|
$theme-multiple-page-control-border-color: #8C40E2;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFF;
|
||||||
|
$theme-multiple-page-control-background-color: rgba(#FFF, .3);
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #293849;
|
||||||
|
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: #FFF;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: #FFF;
|
||||||
|
$theme-header-item-background-color-hover: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: #FFF;
|
||||||
|
$theme-header-item-background-color-focus: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: #FFF;
|
||||||
|
$theme-header-item-background-color-active: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: #FFF;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: #FFF;
|
||||||
|
$theme-aside-item-background-color-hover: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: #FFF;
|
||||||
|
$theme-aside-item-background-color-focus: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: #FFF;
|
||||||
|
$theme-aside-item-background-color-active: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: #FFF;
|
||||||
|
$theme-aside-menu-empty-text-color: #FFF;
|
||||||
|
$theme-aside-menu-empty-background-color: rgba(#000, .1);
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: #FFF;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: #FFF;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: rgba(#000, .15);
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
// 主色
|
||||||
|
$color-primary: #409EFF;
|
||||||
|
|
||||||
|
// 辅助色
|
||||||
|
$color-info: #909399;
|
||||||
|
$color-success: #67C23A;
|
||||||
|
$color-warning: #E6A23C;
|
||||||
|
$color-danger: #F56C6C;
|
||||||
|
|
||||||
|
// 文字
|
||||||
|
$color-text-main: #303133;
|
||||||
|
$color-text-normal: #606266;
|
||||||
|
$color-text-sub: #909399;
|
||||||
|
$color-text-placehoder: #C0C4CC;
|
||||||
|
|
||||||
|
// 边框
|
||||||
|
$color-border-1: #DCDFE6;
|
||||||
|
$color-border-2: #E4E7ED;
|
||||||
|
$color-border-3: #EBEEF5;
|
||||||
|
$color-border-4: #F2F6FC;
|
||||||
|
|
||||||
|
// 背景
|
||||||
|
$color-bg: #f8f8f9;
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 1024C229.7 1024 0 794.3 0 512S229.7 0 512 0s512 229.7 512 512-229.7 512-512 512z m0-938.7C276.7 85.3 85.3 276.7 85.3 512S276.7 938.7 512 938.7 938.7 747.3 938.7 512 747.3 85.3 512 85.3z" fill="#3688FF" /><path d="M682.7 554.7H341.3c-23.6 0-42.7-19.1-42.7-42.7s19.1-42.7 42.7-42.7h341.3c23.6 0 42.7 19.1 42.7 42.7s-19.1 42.7-42.6 42.7z" fill="#5F6379" /><path d="M512 725.3c-23.6 0-42.7-19.1-42.7-42.7V341.3c0-23.6 19.1-42.7 42.7-42.7s42.7 19.1 42.7 42.7v341.3c0 23.6-19.1 42.7-42.7 42.7z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 784 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 896c-223.5 0-405.3-181.8-405.3-405.3S288.5 85.3 512 85.3s405.3 181.8 405.3 405.3S735.5 896 512 896z m0-725.3c-176.4 0-320 143.5-320 320s143.6 320 320 320 320-143.5 320-320-143.6-320-320-320z" fill="#3688FF" /><path d="M922.6 249.6c-13.7 0-27.1-6.6-35.4-18.8-15.3-22.6-32.8-43.9-52.1-63.2-19.3-19.3-40.6-36.9-63.2-52.1-19.5-13.2-24.6-39.7-11.5-59.2 13.2-19.5 39.7-24.6 59.2-11.5 27.1 18.3 52.6 39.4 75.7 62.5s44.2 48.6 62.5 75.7c13.2 19.5 8.1 46.1-11.5 59.2-7.2 5-15.5 7.4-23.7 7.4zM101.4 249.6c-8.2 0-16.5-2.4-23.8-7.3-19.5-13.2-24.7-39.7-11.5-59.2 18.3-27.1 39.4-52.6 62.5-75.7s48.6-44.1 75.7-62.5c19.5-13.2 46.1-8 59.3 11.5 13.2 19.5 8.1 46-11.5 59.2-22.6 15.3-43.9 32.8-63.2 52.1-19.3 19.3-36.8 40.5-52.1 63.2-8.2 12.1-21.7 18.7-35.4 18.7zM138.6 970.7c-8.6 0-17.3-2.6-24.8-7.9-19.2-13.7-23.6-40.4-9.9-59.5l53.3-74.7c13.7-19.2 40.3-23.6 59.5-9.9 19.2 13.7 23.6 40.4 9.9 59.5l-53.3 74.7c-8.2 11.6-21.4 17.8-34.7 17.8zM885.4 970.7c-13.3 0-26.4-6.2-34.8-17.9l-53.3-74.7c-13.7-19.2-9.3-45.8 9.9-59.5 19.2-13.7 45.8-9.2 59.5 9.9l53.3 74.7c13.7 19.2 9.3 45.8-9.9 59.5-7.5 5.4-16.2 8-24.7 8zM512 554.7c-7.2 0-14.5-1.8-21-5.5-13.4-7.6-21.6-21.8-21.6-37.1V384c0-23.6 19.1-42.7 42.7-42.7s42.7 19.1 42.7 42.7v52.6l42.1-25.2c20.2-12.1 46.4-5.6 58.5 14.6 12.1 20.2 5.6 46.4-14.6 58.5l-106.7 64c-6.9 4.1-14.5 6.2-22.1 6.2z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M899.9 938.7H124.1C55.7 938.7 0 883 0 814.6V273.4C0 205 55.7 149.3 124.1 149.3h68.7l85.3-106.7h467.7l85.3 106.7h68.7c68.4 0 124.1 55.7 124.1 124.1v541.1c0.1 68.5-55.6 124.2-124 124.2z m-775.8-704c-21.4 0-38.8 17.4-38.8 38.8v541.1c0 21.4 17.4 38.8 38.8 38.8h775.8c21.4 0 38.8-17.4 38.8-38.8V273.4c0-21.4-17.4-38.8-38.8-38.8H790.2L704.8 128H319.2l-85.3 106.7H124.1z" fill="#3688FF" /><path d="M512 768c-117.6 0-213.3-95.7-213.3-213.3S394.4 341.3 512 341.3 725.3 437 725.3 554.7 629.6 768 512 768z m0-341.3c-70.6 0-128 57.4-128 128s57.4 128 128 128 128-57.4 128-128-57.4-128-128-128z" fill="#5F6379" /><path d="M810.7 341.3m-42.7 0a42.7 42.7 0 1 0 85.4 0 42.7 42.7 0 1 0-85.4 0Z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 967 B |
@@ -0,0 +1,13 @@
|
|||||||
|
|
||||||
|
<svg width="60px" height="54px" viewBox="0 0 60 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<desc>D2Admin</desc>
|
||||||
|
<defs></defs>
|
||||||
|
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||||
|
<g id="logo-no-shadow" transform="translate(-3.000000, -3.000000)">
|
||||||
|
<path d="M44.2833805,33.4299717 L6.05798302,56.3652102 C4.16366196,57.5018028 1.70662094,56.8875426 0.570028297,54.9932215 C0.197031333,54.3715599 8.87839274e-17,53.6602143 0,52.9352385 L-4.4408921e-16,7.06476152 C-7.1463071e-16,4.85562252 1.790861,3.06476152 4,3.06476152 C4.72497578,3.06476152 5.43632142,3.26179285 6.05798302,3.63478981 L44.2833805,26.5700283 C46.1777016,27.7066209 46.7919618,30.163662 45.6553692,32.057983 C45.3175701,32.6209814 44.8463789,33.0921727 44.2833805,33.4299717 Z" id="Triangle-Copy" fill="#35495E" transform="translate(25.000000, 30.000000) rotate(-180.000000) translate(-25.000000, -30.000000) "></path>
|
||||||
|
<path d="M60.2833805,33.4299717 L22.057983,56.3652102 C20.163662,57.5018028 17.7066209,56.8875426 16.5700283,54.9932215 C16.1970313,54.3715599 16,53.6602143 16,52.9352385 L16,7.06476152 C16,4.85562252 17.790861,3.06476152 20,3.06476152 C20.7249758,3.06476152 21.4363214,3.26179285 22.057983,3.63478981 L60.2833805,26.5700283 C62.1777016,27.7066209 62.7919618,30.163662 61.6553692,32.057983 C61.3175701,32.6209814 60.8463789,33.0921727 60.2833805,33.4299717 Z" id="Triangle" fill="#409EFF"></path>
|
||||||
|
<path d="M42.4688663,31.7973091 L24.0289915,42.8612339 C23.081831,43.4295303 21.8533105,43.1224001 21.2850141,42.1752396 C21.0985157,41.8644088 21,41.508736 21,41.1462481 L21,19.0183984 C21,17.9138289 21.8954305,17.0183984 23,17.0183984 C23.3624879,17.0183984 23.7181607,17.116914 24.0289915,17.3034125 L42.4688663,28.3673374 C43.4160268,28.9356337 43.7231569,30.1641542 43.1548606,31.1113147 C42.9859611,31.3928139 42.7503655,31.6284096 42.4688663,31.7973091 Z" id="Triangle-Copy" fill="#FFFFFF" transform="translate(31.000000, 30.082670) rotate(-180.000000) translate(-31.000000, -30.082670) "></path>
|
||||||
|
<path d="M37.5708451,30.8574929 L30.5144958,35.0913025 C30.0409155,35.3754507 29.4266552,35.2218856 29.1425071,34.7483054 C29.0492578,34.59289 29,34.4150536 29,34.2338096 L29,25.7661904 C29,25.2139056 29.4477153,24.7661904 30,24.7661904 C30.1812439,24.7661904 30.3590804,24.8154482 30.5144958,24.9086975 L37.5708451,29.1425071 C38.0444254,29.4266552 38.1979905,30.0409155 37.9138423,30.5144958 C37.8293925,30.6552454 37.7115947,30.7730432 37.5708451,30.8574929 Z" id="Triangle" fill="#409EFF"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 1024C229.7 1024 0 794.3 0 512S229.7 0 512 0s512 229.7 512 512-229.7 512-512 512z m0-938.7C276.7 85.3 85.3 276.7 85.3 512S276.7 938.7 512 938.7 938.7 747.3 938.7 512 747.3 85.3 512 85.3z" fill="#3688FF" /><path d="M640 682.7c-9.6 0-19.3-3.2-27.3-9.9l-128-106.7c-9.7-8.1-15.4-20.1-15.4-32.8V384c0-23.6 19.1-42.7 42.7-42.7s42.7 19.1 42.7 42.7v129.4l112.6 93.9c18.1 15.1 20.5 42 5.5 60.1-8.5 10-20.6 15.3-32.8 15.3z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 708 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M192 938.7H87.9c-48.4 0-87.9-39.5-87.9-88V386.6c0-48.5 39.5-87.9 87.9-87.9h125.4c11.6 0 22.7 4.7 30.8 13.1 8 8.4 12.3 19.6 11.9 31.2l-21.3 554.7c-0.9 22.8-19.8 41-42.7 41zM87.9 384c-1.4 0-2.6 1.2-2.6 2.6v464.1c0 1.4 1.2 2.6 2.6 2.6h63L169 384H87.9z" fill="#5F6379" /><path d="M810.4 938.7H275.7l24.6-640H418l72-201.8C510.7 38.9 566 0 627.5 0c42.4 0 82.6 18.4 110.3 50.4S778 124.8 772 166.7l-18.9 132h142.6c70.7 0 128.2 57.5 128.2 128.2l-1 9.3-84.4 379.4c-2.6 68.3-59.1 123.1-128.1 123.1z m-446.1-85.4h446.1c23.6 0 42.9-19.2 42.9-42.9l1-9.3L938.5 423c-2-21.8-20.4-39-42.7-39h-241l32.8-229.4c2.5-17.7-2.5-34.8-14.2-48.3s-28-20.9-45.9-20.9c-25.6 0-48.5 16.2-57.1 40.3L478.1 384h-95.7l-18.1 469.3z" fill="#3688FF" /></svg>
|
||||||
|
After Width: | Height: | Size: 985 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="199.80px" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#333333" d="M512.8 977.4c-26.1 0-50.1-7.3-71.5-21.7C323.5 897 0 675.3 0 400.5 0 212 153.4 58.6 341.9 58.6c60.5 0 119 15.8 170.9 45.9 51.9-30.1 110.5-45.9 170.9-45.9 188.5 0 341.9 153.4 341.9 341.9 0 274.8-323.5 496.6-441.3 555.2-21.4 14.4-45.4 21.7-71.5 21.7zM341.9 144.1c-141.4 0-256.4 115-256.4 256.4 0 117.2 80.6 225.2 148.2 295.1 86.1 89 187.5 155.2 248.1 184.8l6.1 3.7c15.1 10.8 34.6 10.8 49.7 0l6.1-3.7C604.4 850.7 705.8 784.6 791.8 695.6c67.6-69.9 148.2-177.8 148.2-295.1 0-141.4-115-256.4-256.4-256.4-52.6 0-103.2 16-146.5 46.1L512.8 207.3l-24.5-17.1c-43.2-30.2-93.9-46.1-146.4-46.1z" /></svg>
|
||||||
|
After Width: | Height: | Size: 872 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M277.3 469.3m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#5F6379" /><path d="M344.7 978.2c-5.2 0-10.4-0.8-15.5-2.5-13.8-4.5-24.8-14.8-30.4-28.1l-39.3-94.2H128.3C57.5 853.3 0 795.8 0 725.1V213.6C0 142.9 57.5 85.3 128.3 85.3h767.5c70.7 0 128.3 57.5 128.3 128.3v511.5c0 70.7-57.5 128.3-128.3 128.3H566.5L370.2 971.1c-7.7 4.7-16.6 7.1-25.5 7.1z m-18.3-80.3s-0.1 0 0 0zM128.3 170.7c-23.7 0-42.9 19.3-42.9 42.9v511.5c0 23.7 19.3 42.9 42.9 42.9h188.2l45.3 108.7L542.9 768h352.9c23.7 0 42.9-19.3 42.9-42.9V213.6c0-23.7-19.3-42.9-42.9-42.9H128.3z" fill="#3688FF" /><path d="M512 469.3m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#5F6379" /><path d="M746.7 469.3m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 999 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 128c-23.6 0-42.7-19.1-42.7-42.7V42.7C469.3 19.1 488.4 0 512 0s42.7 19.1 42.7 42.7v42.7c0 23.5-19.1 42.6-42.7 42.6zM512 1024c-61.8 0-122.3-10.5-179.9-31.1-22.2-7.9-33.7-32.4-25.8-54.6 8-22.2 32.3-33.8 54.6-25.8 98.4 35.3 209.2 34.6 307.1-1.8 22.1-8.2 46.6 3 54.9 25.1 8.2 22.1-3 46.6-25.1 54.9-59.5 22.1-121.9 33.3-185.8 33.3z" fill="#5F6379" /><path d="M845 874.7H179c-75.2 0-136.4-61.2-136.4-136.4v-4.6c0-57.1 34.7-106 85.3-126.1V426.7c0-211.7 172.3-384 384-384s384 172.3 384 384v180.9c50.6 20.1 85.3 69 85.3 126.1v4.6c0.1 75.2-61 136.4-136.2 136.4zM512 128c-164.7 0-298.7 134-298.7 298.7v253.2l-38.9 3.5c-26.5 2.4-46.5 24-46.5 50.3v4.6c0 28.1 22.9 51 51 51h666c28.1 0 51-22.9 51-51v-4.6c0-26.3-20-48-46.5-50.3l-38.9-3.5V426.7C810.7 262 676.7 128 512 128z" fill="#3688FF" /></svg>
|
||||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M492.5 917.7c-247 0-447.9-200.9-447.9-447.9s200.9-448 447.9-448 447.9 200.9 447.9 447.9-200.9 448-447.9 448z m0-810.6c-200 0-362.6 162.7-362.6 362.6s162.7 362.6 362.6 362.6 362.6-162.7 362.6-362.6-162.6-362.6-362.6-362.6z" fill="#3688FF" /><path d="M951.1 971c-10.9 0-21.8-4.2-30.2-12.5l-96-96c-16.7-16.7-16.7-43.7 0-60.3 16.6-16.7 43.7-16.7 60.3 0l96 96c16.7 16.7 16.7 43.7 0 60.3-8.2 8.4-19.2 12.5-30.1 12.5z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 702 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M811.3 938.7H217.5c-71.5 0-129.8-58.2-129.8-129.8V215.1c0-71.6 58.2-129.8 129.8-129.8h296.9c23.6 0 42.7 19.1 42.7 42.7s-19.1 42.7-42.7 42.7H217.5c-24.5 0-44.4 19.9-44.4 44.4v593.8c0 24.5 19.9 44.4 44.4 44.4h593.8c24.5 0 44.4-19.9 44.4-44.4V512c0-23.6 19.1-42.7 42.7-42.7S941 488.4 941 512v296.9c0 71.6-58.2 129.8-129.7 129.8z" fill="#3688FF" /><path d="M898.4 405.3c-23.6 0-42.7-19.1-42.7-42.7V212.9c0-23.3-19-42.3-42.3-42.3H663.7c-23.6 0-42.7-19.1-42.7-42.7s19.1-42.7 42.7-42.7h149.7c70.4 0 127.6 57.2 127.6 127.6v149.7c0 23.7-19.1 42.8-42.6 42.8z" fill="#5F6379" /><path d="M373.6 712.6c-10.9 0-21.8-4.2-30.2-12.5-16.7-16.7-16.7-43.7 0-60.3L851.2 132c16.7-16.7 43.7-16.7 60.3 0 16.7 16.7 16.7 43.7 0 60.3L403.8 700.1c-8.4 8.3-19.3 12.5-30.2 12.5z" fill="#5F6379" /></svg>
|
||||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#333333" d="M761.2 942.8c-8.9 0-17.9-1.8-26.5-5.4l-220.7-93-220.7 93c-22.1 9.3-46.8 6.4-66.2-7.6-19.4-14.1-29.8-36.7-27.7-60.6l20.2-238.7L62.9 449.2c-15.7-18.1-20.6-42.5-13.2-65.3 7.4-22.8 25.7-39.6 49.1-45.1L332 284.3l123.9-205c12.4-20.5 34.1-32.7 58-32.7 24 0 45.7 12.2 58.1 32.7l123.9 205 233.2 54.5c23.3 5.5 41.7 22.3 49.1 45.1 7.4 22.8 2.5 47.2-13.2 65.3L808.4 630.4l20.2 238.7c2 23.9-8.3 46.5-27.7 60.6-11.8 8.6-25.7 13-39.7 13.1zM146.4 415.3L289 580.2c11.9 13.7 17.8 32 16.3 50.1l-18.4 217.2 200.8-84.6c16.8-7 35.9-7 52.6 0l200.9 84.6-18.4-217.2c-1.5-18.1 4.4-36.4 16.3-50.1l142.5-164.9-212.2-49.6c-17.7-4.1-33.2-15.4-42.6-31L514 148.3 401.2 334.8c-9.4 15.6-24.9 26.8-42.6 31l-212.2 49.5z m553.3-124.7h0.2-0.2z" /></svg>
|
||||||
|
After Width: | Height: | Size: 998 B |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 661.3c-117.6 0-213.3-95.7-213.3-213.3S394.4 234.7 512 234.7 725.3 330.4 725.3 448 629.6 661.3 512 661.3z m0-341.3c-70.6 0-128 57.4-128 128s57.4 128 128 128 128-57.4 128-128-57.4-128-128-128z" fill="#5F6379" /><path d="M837 862.9c-15.7 0-30.8-8.7-38.2-23.7C744.3 729.5 634.4 661.3 512 661.3s-232.3 68.1-286.8 177.9c-10.5 21.1-36.1 29.7-57.2 19.2s-29.7-36.1-19.2-57.2C217.8 662.3 357 576 512 576s294.2 86.3 363.2 225.2c10.5 21.1 1.9 46.7-19.2 57.2-6.1 3-12.6 4.5-19 4.5z" fill="#5F6379" /><path d="M512 1002.7c-270.6 0-490.7-220.1-490.7-490.7S241.4 21.3 512 21.3s490.7 220.1 490.7 490.7-220.1 490.7-490.7 490.7z m0-896c-223.5 0-405.3 181.8-405.3 405.3S288.5 917.3 512 917.3 917.3 735.5 917.3 512 735.5 106.7 512 106.7z" fill="#3688FF" /></svg>
|
||||||
|
After Width: | Height: | Size: 1013 B |
@@ -0,0 +1,7 @@
|
|||||||
|
import Vue from 'vue'
|
||||||
|
|
||||||
|
const requireAll = requireContext => requireContext.keys().map(requireContext)
|
||||||
|
const req = require.context('./icons', false, /\.svg$/)
|
||||||
|
const iconMap = requireAll(req)
|
||||||
|
|
||||||
|
Vue.prototype.$IconSvg = iconMap.map(e => e.default.id.slice(3))
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-card-bs">
|
||||||
|
<div v-if="$slots.header" class="d2-container-card-bs__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-card-bs__body" ref="wrapper">
|
||||||
|
<div class="d2-container-card-bs__body-wrapper-inner">
|
||||||
|
<div class="d2-container-card-bs__body-card">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-card-bs__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import bs from './mixins/bs'
|
||||||
|
export default {
|
||||||
|
name: 'd2-container-card-bs',
|
||||||
|
mixins: [
|
||||||
|
bs
|
||||||
|
]
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-card">
|
||||||
|
<div v-if="$slots.header" class="d2-container-card__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-card__body">
|
||||||
|
<div class="d2-container-card__body-card">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-card__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'd2-container-card'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,25 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-full-bs">
|
||||||
|
<div v-if="$slots.header" class="d2-container-full-bs__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-full-bs__body" ref="wrapper">
|
||||||
|
<div class="d2-container-full-bs__body-wrapper-inner">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-full-bs__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import bs from './mixins/bs'
|
||||||
|
export default {
|
||||||
|
name: 'd2-container-card-bs',
|
||||||
|
mixins: [
|
||||||
|
bs
|
||||||
|
]
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-full">
|
||||||
|
<div v-if="$slots.header" class="d2-container-full__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-full__body">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-full__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'd2-container-full'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-ghost-bs">
|
||||||
|
<div v-if="$slots.header" class="d2-container-ghost-bs__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-ghost-bs__body" ref="wrapper">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-ghost-bs__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import bs from './mixins/bs'
|
||||||
|
export default {
|
||||||
|
name: 'd2-container-card-bs',
|
||||||
|
mixins: [
|
||||||
|
bs
|
||||||
|
]
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
<template>
|
||||||
|
<div class="d2-container-ghost">
|
||||||
|
<div v-if="$slots.header" class="d2-container-ghost__header" ref="header">
|
||||||
|
<slot name="header"/>
|
||||||
|
</div>
|
||||||
|
<div class="d2-container-ghost__body">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
<div v-if="$slots.footer" class="d2-container-ghost__footer" ref="footer">
|
||||||
|
<slot name="footer"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,41 @@
|
|||||||
|
import BScroll from 'better-scroll'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
betterScrollOptions: {
|
||||||
|
type: Object,
|
||||||
|
required: false,
|
||||||
|
default: () => ({})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
BS: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.scrollInit()
|
||||||
|
},
|
||||||
|
beforeDestroy () {
|
||||||
|
this.scrollDestroy()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
scrollInit () {
|
||||||
|
this.BS = new BScroll(this.$refs.wrapper, Object.assign({
|
||||||
|
mouseWheel: true,
|
||||||
|
scrollbar: {
|
||||||
|
fade: true,
|
||||||
|
interactive: false
|
||||||
|
}
|
||||||
|
}, this.betterScrollOptions))
|
||||||
|
},
|
||||||
|
scrollDestroy () {
|
||||||
|
// https://github.com/d2-projects/d2-admin/issues/75
|
||||||
|
try {
|
||||||
|
this.BS.destroy()
|
||||||
|
} catch (e) {
|
||||||
|
delete this.BS
|
||||||
|
this.BS = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,75 @@
|
|||||||
|
<template>
|
||||||
|
<div class="container-component" ref="container">
|
||||||
|
<!-- [card] 卡片容器 -->
|
||||||
|
<d2-container-card v-if="type === 'card' && !betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-card>
|
||||||
|
<!-- [card] 卡片容器 滚动优化 -->
|
||||||
|
<d2-container-card-bs v-bind="$attrs" v-if="type === 'card' && betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-card-bs>
|
||||||
|
<!-- [ghost] 隐形容器 -->
|
||||||
|
<d2-container-ghost v-if="type === 'ghost' && !betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-ghost>
|
||||||
|
<!-- [ghost] 隐形容器 滚动优化 -->
|
||||||
|
<d2-container-ghost-bs v-bind="$attrs" v-if="type === 'ghost' && betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-ghost-bs>
|
||||||
|
<!-- [container-full] 填充 -->
|
||||||
|
<d2-container-full v-if="type === 'full' && !betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-full>
|
||||||
|
<!-- [container-full-bs] 填充 滚动优化 -->
|
||||||
|
<d2-container-full-bs v-bind="$attrs" v-if="type === 'full' && betterScroll">
|
||||||
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
|
<slot/>
|
||||||
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
|
</d2-container-full-bs>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// 组件
|
||||||
|
import d2ContainerFull from './components/d2-container-full.vue'
|
||||||
|
import d2ContainerFullBs from './components/d2-container-full-bs.vue'
|
||||||
|
import d2ContainerGhost from './components/d2-container-ghost.vue'
|
||||||
|
import d2ContainerGhostBs from './components/d2-container-ghost-bs.vue'
|
||||||
|
import d2ContainerCard from './components/d2-container-card.vue'
|
||||||
|
import d2ContainerCardBs from './components/d2-container-card-bs.vue'
|
||||||
|
export default {
|
||||||
|
name: 'd2-container',
|
||||||
|
components: {
|
||||||
|
'd2-container-full': d2ContainerFull,
|
||||||
|
'd2-container-full-bs': d2ContainerFullBs,
|
||||||
|
'd2-container-ghost': d2ContainerGhost,
|
||||||
|
'd2-container-ghost-bs': d2ContainerGhostBs,
|
||||||
|
'd2-container-card': d2ContainerCard,
|
||||||
|
'd2-container-card-bs': d2ContainerCardBs
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
// 容器样式
|
||||||
|
type: {
|
||||||
|
type: String,
|
||||||
|
required: false,
|
||||||
|
default: 'full'
|
||||||
|
},
|
||||||
|
// 滚动优化
|
||||||
|
betterScroll: {
|
||||||
|
type: Boolean,
|
||||||
|
required: false,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,103 @@
|
|||||||
|
<template>
|
||||||
|
<span></span>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import CountUp from 'countup.js'
|
||||||
|
export default {
|
||||||
|
name: 'd2-count-up',
|
||||||
|
props: {
|
||||||
|
start: {
|
||||||
|
type: Number,
|
||||||
|
required: false,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
end: {
|
||||||
|
type: Number,
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
decimals: {
|
||||||
|
type: Number,
|
||||||
|
required: false,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
duration: {
|
||||||
|
type: Number,
|
||||||
|
required: false,
|
||||||
|
default: 2
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
type: Object,
|
||||||
|
required: false,
|
||||||
|
default () {
|
||||||
|
return {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
callback: {
|
||||||
|
type: Function,
|
||||||
|
required: false,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
c: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
end (value) {
|
||||||
|
if (this.c && this.c.update) {
|
||||||
|
this.c.update(value)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.init()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
init () {
|
||||||
|
if (!this.c) {
|
||||||
|
this.c = new CountUp(
|
||||||
|
this.$el,
|
||||||
|
this.start,
|
||||||
|
this.end,
|
||||||
|
this.decimals,
|
||||||
|
this.duration,
|
||||||
|
this.options
|
||||||
|
)
|
||||||
|
this.c.start(() => {
|
||||||
|
this.callback(this.c)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
destroy () {
|
||||||
|
this.c = null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
beforeDestroy () {
|
||||||
|
this.destroy()
|
||||||
|
},
|
||||||
|
start (callback) {
|
||||||
|
if (this.c && this.c.start) {
|
||||||
|
this.c.start(() => {
|
||||||
|
callback && callback(this.c)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
pauseResume () {
|
||||||
|
if (this.c && this.c.pauseResume) {
|
||||||
|
this.c.pauseResume()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
reset () {
|
||||||
|
if (this.c && this.c.reset) {
|
||||||
|
this.c.reset()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
update (newEndVal) {
|
||||||
|
if (this.c && this.c.update) {
|
||||||
|
this.c.update(newEndVal)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,52 @@
|
|||||||
|
<template>
|
||||||
|
<pre class="d2-highlight" v-html="highlightHTML"></pre>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// https://highlightjs.org/usage/
|
||||||
|
// http://highlightjs.readthedocs.io/en/latest/api.html#configure-options
|
||||||
|
import './styles/atom-one-light.css'
|
||||||
|
import htmlFormat from './libs/htmlFormat'
|
||||||
|
import highlight from 'highlight.js'
|
||||||
|
export default {
|
||||||
|
name: 'd2-highlight',
|
||||||
|
props: {
|
||||||
|
code: {
|
||||||
|
type: String,
|
||||||
|
required: false,
|
||||||
|
default: `console.log('you lost code prop')`
|
||||||
|
},
|
||||||
|
formatHtml: {
|
||||||
|
type: Boolean,
|
||||||
|
required: false,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
highlightHTML: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.highlight()
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
code () {
|
||||||
|
this.highlight()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
highlight () {
|
||||||
|
const code = this.formatHtml ? htmlFormat(this.code) : this.code
|
||||||
|
this.highlightHTML = highlight.highlightAuto(code).value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.d2-highlight {
|
||||||
|
margin: 0px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,365 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
|
||||||
|
// 功能
|
||||||
|
// 将HTML字符串格式化
|
||||||
|
|
||||||
|
const format = (function() {
|
||||||
|
function style_html(html_source, indent_size, indent_character, max_char) {
|
||||||
|
var Parser, multi_parser;
|
||||||
|
function Parser() {
|
||||||
|
this.pos = 0;
|
||||||
|
this.token = '';
|
||||||
|
this.current_mode = 'CONTENT';
|
||||||
|
this.tags = {
|
||||||
|
parent: 'parent1',
|
||||||
|
parentcount: 1,
|
||||||
|
parent1: ''
|
||||||
|
};
|
||||||
|
this.tag_type = '';
|
||||||
|
this.token_text = this.last_token = this.last_text = this.token_type = '';
|
||||||
|
this.Utils = {
|
||||||
|
whitespace: "\n\r\t ".split(''),
|
||||||
|
single_token: 'br,input,link,meta,!doctype,basefont,base,area,hr,wbr,param,img,isindex,?xml,embed'.split(','),
|
||||||
|
extra_liners: 'head,body,/html'.split(','),
|
||||||
|
in_array: function(what, arr) {
|
||||||
|
for (var i = 0; i < arr.length; i++) {
|
||||||
|
if (what === arr[i]) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.get_content = function() {
|
||||||
|
var char = '';
|
||||||
|
var content = [];
|
||||||
|
var space = false;
|
||||||
|
while (this.input.charAt(this.pos) !== '<') {
|
||||||
|
if (this.pos >= this.input.length) {
|
||||||
|
return content.length ? content.join('') : ['', 'TK_EOF'];
|
||||||
|
}
|
||||||
|
char = this.input.charAt(this.pos);
|
||||||
|
this.pos++;
|
||||||
|
this.line_char_count++;
|
||||||
|
if (this.Utils.in_array(char, this.Utils.whitespace)) {
|
||||||
|
if (content.length) {
|
||||||
|
space = true;
|
||||||
|
}
|
||||||
|
this.line_char_count--;
|
||||||
|
continue;
|
||||||
|
} else if (space) {
|
||||||
|
if (this.line_char_count >= this.max_char) {
|
||||||
|
content.push('\n');
|
||||||
|
for (var i = 0; i < this.indent_level; i++) {
|
||||||
|
content.push(this.indent_string);
|
||||||
|
}
|
||||||
|
this.line_char_count = 0;
|
||||||
|
} else {
|
||||||
|
content.push(' ');
|
||||||
|
this.line_char_count++;
|
||||||
|
}
|
||||||
|
space = false;
|
||||||
|
}
|
||||||
|
content.push(char);
|
||||||
|
}
|
||||||
|
return content.length ? content.join('') : '';
|
||||||
|
}
|
||||||
|
this.get_script = function() {
|
||||||
|
var char = '';
|
||||||
|
var content = [];
|
||||||
|
var reg_match = new RegExp('\<\/script' + '\>', 'igm');
|
||||||
|
reg_match.lastIndex = this.pos;
|
||||||
|
var reg_array = reg_match.exec(this.input);
|
||||||
|
var end_script = reg_array ? reg_array.index: this.input.length;
|
||||||
|
while (this.pos < end_script) {
|
||||||
|
if (this.pos >= this.input.length) {
|
||||||
|
return content.length ? content.join('') : ['', 'TK_EOF'];
|
||||||
|
}
|
||||||
|
char = this.input.charAt(this.pos);
|
||||||
|
this.pos++;
|
||||||
|
content.push(char);
|
||||||
|
}
|
||||||
|
return content.length ? content.join('') : '';
|
||||||
|
}
|
||||||
|
this.record_tag = function(tag) {
|
||||||
|
if (this.tags[tag + 'count']) {
|
||||||
|
this.tags[tag + 'count']++;
|
||||||
|
this.tags[tag + this.tags[tag + 'count']] = this.indent_level;
|
||||||
|
} else {
|
||||||
|
this.tags[tag + 'count'] = 1;
|
||||||
|
this.tags[tag + this.tags[tag + 'count']] = this.indent_level;
|
||||||
|
}
|
||||||
|
this.tags[tag + this.tags[tag + 'count'] + 'parent'] = this.tags.parent;
|
||||||
|
this.tags.parent = tag + this.tags[tag + 'count'];
|
||||||
|
}
|
||||||
|
this.retrieve_tag = function(tag) {
|
||||||
|
if (this.tags[tag + 'count']) {
|
||||||
|
var temp_parent = this.tags.parent;
|
||||||
|
while (temp_parent) {
|
||||||
|
if (tag + this.tags[tag + 'count'] === temp_parent) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
temp_parent = this.tags[temp_parent + 'parent'];
|
||||||
|
}
|
||||||
|
if (temp_parent) {
|
||||||
|
this.indent_level = this.tags[tag + this.tags[tag + 'count']];
|
||||||
|
this.tags.parent = this.tags[temp_parent + 'parent'];
|
||||||
|
}
|
||||||
|
delete this.tags[tag + this.tags[tag + 'count'] + 'parent'];
|
||||||
|
delete this.tags[tag + this.tags[tag + 'count']];
|
||||||
|
if (this.tags[tag + 'count'] == 1) {
|
||||||
|
delete this.tags[tag + 'count'];
|
||||||
|
} else {
|
||||||
|
this.tags[tag + 'count']--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.get_tag = function() {
|
||||||
|
var char = '';
|
||||||
|
var content = [];
|
||||||
|
var space = false;
|
||||||
|
do {
|
||||||
|
if (this.pos >= this.input.length) {
|
||||||
|
return content.length ? content.join('') : ['', 'TK_EOF'];
|
||||||
|
}
|
||||||
|
char = this.input.charAt(this.pos);
|
||||||
|
this.pos++;
|
||||||
|
this.line_char_count++;
|
||||||
|
if (this.Utils.in_array(char, this.Utils.whitespace)) {
|
||||||
|
space = true;
|
||||||
|
this.line_char_count--;
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
if (char === "'" || char === '"') {
|
||||||
|
if (!content[1] || content[1] !== '!') {
|
||||||
|
char += this.get_unformatted(char);
|
||||||
|
space = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (char === '=') {
|
||||||
|
space = false;
|
||||||
|
}
|
||||||
|
if (content.length && content[content.length - 1] !== '=' && char !== '>' && space) {
|
||||||
|
if (this.line_char_count >= this.max_char) {
|
||||||
|
this.print_newline(false, content);
|
||||||
|
this.line_char_count = 0;
|
||||||
|
} else {
|
||||||
|
content.push(' ');
|
||||||
|
this.line_char_count++;
|
||||||
|
}
|
||||||
|
space = false;
|
||||||
|
}
|
||||||
|
content.push(char);
|
||||||
|
} while ( char !== '>');
|
||||||
|
var tag_complete = content.join('');
|
||||||
|
var tag_index;
|
||||||
|
if (tag_complete.indexOf(' ') != -1) {
|
||||||
|
tag_index = tag_complete.indexOf(' ');
|
||||||
|
} else {
|
||||||
|
tag_index = tag_complete.indexOf('>');
|
||||||
|
}
|
||||||
|
var tag_check = tag_complete.substring(1, tag_index).toLowerCase();
|
||||||
|
if (tag_complete.charAt(tag_complete.length - 2) === '/' || this.Utils.in_array(tag_check, this.Utils.single_token)) {
|
||||||
|
this.tag_type = 'SINGLE';
|
||||||
|
} else if (tag_check === 'script') {
|
||||||
|
this.record_tag(tag_check);
|
||||||
|
this.tag_type = 'SCRIPT';
|
||||||
|
} else if (tag_check === 'style') {
|
||||||
|
this.record_tag(tag_check);
|
||||||
|
this.tag_type = 'STYLE';
|
||||||
|
} else if (tag_check.charAt(0) === '!') {
|
||||||
|
if (tag_check.indexOf('[if') != -1) {
|
||||||
|
if (tag_complete.indexOf('!IE') != -1) {
|
||||||
|
var comment = this.get_unformatted('-->', tag_complete);
|
||||||
|
content.push(comment);
|
||||||
|
}
|
||||||
|
this.tag_type = 'START';
|
||||||
|
} else if (tag_check.indexOf('[endif') != -1) {
|
||||||
|
this.tag_type = 'END';
|
||||||
|
this.unindent();
|
||||||
|
} else if (tag_check.indexOf('[cdata[') != -1) {
|
||||||
|
var comment = this.get_unformatted(']]>', tag_complete);
|
||||||
|
content.push(comment);
|
||||||
|
this.tag_type = 'SINGLE';
|
||||||
|
} else {
|
||||||
|
var comment = this.get_unformatted('-->', tag_complete);
|
||||||
|
content.push(comment);
|
||||||
|
this.tag_type = 'SINGLE';
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (tag_check.charAt(0) === '/') {
|
||||||
|
this.retrieve_tag(tag_check.substring(1));
|
||||||
|
this.tag_type = 'END';
|
||||||
|
} else {
|
||||||
|
this.record_tag(tag_check);
|
||||||
|
this.tag_type = 'START';
|
||||||
|
}
|
||||||
|
if (this.Utils.in_array(tag_check, this.Utils.extra_liners)) {
|
||||||
|
this.print_newline(true, this.output);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return content.join('');
|
||||||
|
}
|
||||||
|
this.get_unformatted = function(delimiter, orig_tag) {
|
||||||
|
if (orig_tag && orig_tag.indexOf(delimiter) != -1) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
var char = '';
|
||||||
|
var content = '';
|
||||||
|
var space = true;
|
||||||
|
do {
|
||||||
|
char = this.input.charAt(this.pos);
|
||||||
|
this.pos++
|
||||||
|
if (this.Utils.in_array(char, this.Utils.whitespace)) {
|
||||||
|
if (!space) {
|
||||||
|
this.line_char_count--;
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
if (char === '\n' || char === '\r') {
|
||||||
|
content += '\n';
|
||||||
|
for (var i = 0; i < this.indent_level; i++) {
|
||||||
|
content += this.indent_string;
|
||||||
|
}
|
||||||
|
space = false;
|
||||||
|
this.line_char_count = 0;
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
content += char;
|
||||||
|
this.line_char_count++;
|
||||||
|
space = true;
|
||||||
|
|
||||||
|
} while ( content . indexOf ( delimiter ) == -1);
|
||||||
|
return content;
|
||||||
|
}
|
||||||
|
this.get_token = function() {
|
||||||
|
var token;
|
||||||
|
if (this.last_token === 'TK_TAG_SCRIPT') {
|
||||||
|
var temp_token = this.get_script();
|
||||||
|
if (typeof temp_token !== 'string') {
|
||||||
|
return temp_token;
|
||||||
|
}
|
||||||
|
//token = js_beautify(temp_token, this.indent_size, this.indent_character, this.indent_level);
|
||||||
|
//return [token, 'TK_CONTENT'];
|
||||||
|
return [temp_token, 'TK_CONTENT'];
|
||||||
|
}
|
||||||
|
if (this.current_mode === 'CONTENT') {
|
||||||
|
token = this.get_content();
|
||||||
|
if (typeof token !== 'string') {
|
||||||
|
return token;
|
||||||
|
} else {
|
||||||
|
return [token, 'TK_CONTENT'];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (this.current_mode === 'TAG') {
|
||||||
|
token = this.get_tag();
|
||||||
|
if (typeof token !== 'string') {
|
||||||
|
return token;
|
||||||
|
} else {
|
||||||
|
var tag_name_type = 'TK_TAG_' + this.tag_type;
|
||||||
|
return [token, tag_name_type];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.printer = function(js_source, indent_character, indent_size, max_char) {
|
||||||
|
this.input = js_source || '';
|
||||||
|
this.output = [];
|
||||||
|
this.indent_character = indent_character || ' ';
|
||||||
|
this.indent_string = '';
|
||||||
|
this.indent_size = indent_size || 2;
|
||||||
|
this.indent_level = 0;
|
||||||
|
this.max_char = max_char || 70;
|
||||||
|
this.line_char_count = 0;
|
||||||
|
for (var i = 0; i < this.indent_size; i++) {
|
||||||
|
this.indent_string += this.indent_character;
|
||||||
|
}
|
||||||
|
this.print_newline = function(ignore, arr) {
|
||||||
|
this.line_char_count = 0;
|
||||||
|
if (!arr || !arr.length) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!ignore) {
|
||||||
|
while (this.Utils.in_array(arr[arr.length - 1], this.Utils.whitespace)) {
|
||||||
|
arr.pop();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
arr.push('\n');
|
||||||
|
for (var i = 0; i < this.indent_level; i++) {
|
||||||
|
arr.push(this.indent_string);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.print_token = function(text) {
|
||||||
|
this.output.push(text);
|
||||||
|
}
|
||||||
|
this.indent = function() {
|
||||||
|
this.indent_level++;
|
||||||
|
}
|
||||||
|
this.unindent = function() {
|
||||||
|
if (this.indent_level > 0) {
|
||||||
|
this.indent_level--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
multi_parser = new Parser();
|
||||||
|
multi_parser.printer(html_source, indent_character, indent_size);
|
||||||
|
while (true) {
|
||||||
|
var t = multi_parser.get_token();
|
||||||
|
multi_parser.token_text = t[0];
|
||||||
|
multi_parser.token_type = t[1];
|
||||||
|
if (multi_parser.token_type === 'TK_EOF') {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
switch (multi_parser.token_type) {
|
||||||
|
case 'TK_TAG_START':
|
||||||
|
case 'TK_TAG_SCRIPT':
|
||||||
|
case 'TK_TAG_STYLE':
|
||||||
|
multi_parser.print_newline(false, multi_parser.output);
|
||||||
|
multi_parser.print_token(multi_parser.token_text);
|
||||||
|
multi_parser.indent();
|
||||||
|
multi_parser.current_mode = 'CONTENT';
|
||||||
|
break;
|
||||||
|
case 'TK_TAG_END':
|
||||||
|
multi_parser.print_newline(true, multi_parser.output);
|
||||||
|
multi_parser.print_token(multi_parser.token_text);
|
||||||
|
multi_parser.current_mode = 'CONTENT';
|
||||||
|
break;
|
||||||
|
case 'TK_TAG_SINGLE':
|
||||||
|
multi_parser.print_newline(false, multi_parser.output);
|
||||||
|
multi_parser.print_token(multi_parser.token_text);
|
||||||
|
multi_parser.current_mode = 'CONTENT';
|
||||||
|
break;
|
||||||
|
case 'TK_CONTENT':
|
||||||
|
if (multi_parser.token_text !== '') {
|
||||||
|
multi_parser.print_newline(false, multi_parser.output);
|
||||||
|
multi_parser.print_token(multi_parser.token_text);
|
||||||
|
}
|
||||||
|
multi_parser.current_mode = 'TAG';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
multi_parser.last_token = multi_parser.token_type;
|
||||||
|
multi_parser.last_text = multi_parser.token_text;
|
||||||
|
}
|
||||||
|
return multi_parser.output.join('');
|
||||||
|
}
|
||||||
|
return function(data) {
|
||||||
|
var dataHolder = ['__dataHolder_', [Math.random(), Math.random(), Math.random(), Math.random()].join('_').replace(/[^0-9]/g, '_'), '_'].join('_');
|
||||||
|
var dataHolders = {};
|
||||||
|
var index = 0;
|
||||||
|
data = data.replace(/(\")(data:[^\"]*)(\")/g,
|
||||||
|
function($0, $1, $2, $3) {
|
||||||
|
var name = dataHolder + index++;
|
||||||
|
dataHolders[name] = $2;
|
||||||
|
return $1 + name + $3;
|
||||||
|
})
|
||||||
|
data = style_html(data, 2, ' ', 0x10000000);
|
||||||
|
data = data.replace(new RegExp(dataHolder + '[0-9]+', 'g'),
|
||||||
|
function($0) {
|
||||||
|
return dataHolders[$0];
|
||||||
|
});
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
|
export default format
|
||||||
@@ -0,0 +1,108 @@
|
|||||||
|
/*!
|
||||||
|
* Agate by Taufik Nurrohman <https://github.com/tovic>
|
||||||
|
* ----------------------------------------------------
|
||||||
|
*
|
||||||
|
* #ade5fc
|
||||||
|
* #a2fca2
|
||||||
|
* #c6b4f0
|
||||||
|
* #d36363
|
||||||
|
* #fcc28c
|
||||||
|
* #fc9b9b
|
||||||
|
* #ffa
|
||||||
|
* #fff
|
||||||
|
* #333
|
||||||
|
* #62c8f3
|
||||||
|
* #888
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
background: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-code,
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-tag {
|
||||||
|
color: #62c8f3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #ade5fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #a2fca2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name {
|
||||||
|
color: #ffa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #d36363;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-literal {
|
||||||
|
color: #fcc28c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-code {
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link {
|
||||||
|
color: #c6b4f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-meta {
|
||||||
|
color: #fc9b9b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
background-color: #fc9b9b;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
background-color: #a2fca2;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs a {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs a:focus,
|
||||||
|
.hljs a:hover {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
@@ -0,0 +1,66 @@
|
|||||||
|
/*
|
||||||
|
Date: 24 Fev 2015
|
||||||
|
Author: Pedro Oliveira <kanytu@gmail . com>
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
color: #a9b7c6;
|
||||||
|
background: #282b2e;
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #6897BB;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-deletion {
|
||||||
|
color: #cc7832;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-link {
|
||||||
|
color: #629755;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #808080;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-meta {
|
||||||
|
color: #bbb529;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #6A8759;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-type {
|
||||||
|
color: #ffc66d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #e8bf6a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,88 @@
|
|||||||
|
/*
|
||||||
|
|
||||||
|
Arduino® Light Theme - Stefania Mellai <s.mellai@arduino.cc>
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
background: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs,
|
||||||
|
.hljs-subst {
|
||||||
|
color: #434f54;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-doctag,
|
||||||
|
.hljs-name {
|
||||||
|
color: #00979D;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-bullet,
|
||||||
|
.hljs-code,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #D35400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-selector-attr,
|
||||||
|
.hljs-selector-pseudo {
|
||||||
|
color: #00979D;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-template-tag,
|
||||||
|
.hljs-deletion {
|
||||||
|
color: #005C5F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #880000;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment {
|
||||||
|
color: rgba(149,165,166,.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-meta-keyword {
|
||||||
|
color: #728E00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-meta {
|
||||||
|
color: #728E00;
|
||||||
|
color: #434f54;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-function {
|
||||||
|
color: #728E00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-number {
|
||||||
|
color: #8A7B52;
|
||||||
|
}
|
||||||
@@ -0,0 +1,73 @@
|
|||||||
|
/*
|
||||||
|
Date: 17.V.2011
|
||||||
|
Author: pumbur <pumbur@pumbur.net>
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
background: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs,
|
||||||
|
.hljs-subst {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-section {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-meta {
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet,
|
||||||
|
.hljs-regexp {
|
||||||
|
color: #ffcc33;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #00cc66;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-link {
|
||||||
|
color: #32aaee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #6644aa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-template-tag {
|
||||||
|
color: #bb1166;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-doctag,
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
@@ -0,0 +1,45 @@
|
|||||||
|
/*
|
||||||
|
|
||||||
|
Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
background: white;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet,
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-addition,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-link {
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-deletion {
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
@@ -0,0 +1,83 @@
|
|||||||
|
/* Base16 Atelier Cave Dark - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Cave Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #7e7887;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #be4678;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #aa573c;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #2a9292;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #576ddb;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #955ae7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #19171c;
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
background-color: #be4678;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
background-color: #2a9292;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #19171c;
|
||||||
|
color: #8b8792;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
/* Base16 Atelier Cave Light - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Cave Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #655f6d;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #be4678;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #aa573c;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #2a9292;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #576ddb;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Cave Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #955ae7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #19171c;
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
background-color: #be4678;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
background-color: #2a9292;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #efecf4;
|
||||||
|
color: #585260;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
/* Base16 Atelier Dune Dark - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Dune Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #999580;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #d73737;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #b65611;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #60ac39;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #6684e1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #b854d4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #20201d;
|
||||||
|
color: #a6a28c;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
/* Base16 Atelier Dune Light - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Dune Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #7d7a68;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #d73737;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #b65611;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #60ac39;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #6684e1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Dune Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #b854d4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #fefbec;
|
||||||
|
color: #6e6b5e;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,84 @@
|
|||||||
|
/* Base16 Atelier Estuary Dark - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Estuary Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #878573;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #ba6236;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #ae7313;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #7d9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #36a166;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #5f9182;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #22221b;
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
background-color: #ba6236;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
background-color: #7d9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #22221b;
|
||||||
|
color: #929181;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,84 @@
|
|||||||
|
/* Base16 Atelier Estuary Light - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Estuary Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #6c6b5a;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #ba6236;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #ae7313;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #7d9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #36a166;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Estuary Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #5f9182;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-addition {
|
||||||
|
color: #22221b;
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
background-color: #ba6236;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
background-color: #7d9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #f4f3ec;
|
||||||
|
color: #5f5e4e;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
/* Base16 Atelier Forest Dark - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Forest Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #9c9491;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #f22c40;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #df5320;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #7b9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #407ee7;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #6666ea;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #1b1918;
|
||||||
|
color: #a8a19f;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
/* Base16 Atelier Forest Light - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Forest Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #766e6b;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #f22c40;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #df5320;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #7b9726;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #407ee7;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Forest Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #6666ea;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #f1efee;
|
||||||
|
color: #68615e;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
@@ -0,0 +1,69 @@
|
|||||||
|
/* Base16 Atelier Heath Dark - Theme */
|
||||||
|
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath) */
|
||||||
|
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
|
||||||
|
|
||||||
|
/* Atelier-Heath Comment */
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote {
|
||||||
|
color: #9e8f9e;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Heath Red */
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link,
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-selector-id,
|
||||||
|
.hljs-selector-class {
|
||||||
|
color: #ca402b;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Heath Orange */
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-params {
|
||||||
|
color: #a65926;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Heath Green */
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-bullet {
|
||||||
|
color: #918b3b;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Heath Blue */
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section {
|
||||||
|
color: #516aec;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Atelier-Heath Purple */
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag {
|
||||||
|
color: #7b59c0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
background: #1b181b;
|
||||||
|
color: #ab9bab;
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||