blob: 8a42e1f9eadc5142e070ff66d5135ea635d66d14 [file] [log] [blame]
@import url(https://fonts.googleapis.com/css?family=Montserrat&display=swap);
.doc-nav h3 {
margin: 0;
padding: 5px;
font-family: Monaco, 'Source Code Pro', monospace;
font-size: 14px;
}
.doc-nav .toolbox {
position: absolute;
right: 10px;
top: 5px;
}
.doc-nav .toolbox .item {
font-size: 14px;
cursor: pointer;
color: #337ab7;
}
.doc-nav .toolbox .item:hover {
text-decoration: underline;
}
.doc-nav .el-tree {
padding-left: 6px;
}
.doc-nav .el-tree-node {
color: #333;
}
.doc-nav .el-tree-node .el-tree-node__content {
height: 24px;
}
.doc-nav .el-tree-node.is-current > .el-tree-node__content {
background-color: #B03A5B;
color: #fff;
}
.doc-nav .el-tree-node.is-current > .el-tree-node__content .default-value {
color: #eee;
}
.doc-nav .doc-nav-item {
font-family: 'Source Code Pro', monospace;
font-size: 13px;
white-space: nowrap;
}
.doc-nav .doc-nav-item .default-value {
color: #999;
}
.ec-doc-tutorial .doc-nav .el-tree, .ec-doc-api .doc-nav .el-tree {
padding-left: 0;
margin-top: 10px;
}
.ec-doc-tutorial .doc-nav .el-tree-node .el-tree-node__content {
height: 32px;
}
.ec-doc-tutorial .doc-nav .el-tree-node .doc-nav-item {
margin-left: -10px;
font-family: "Source Sans Pro", "Helvetica Neue", "Segoe UI", Arial, "PingFang SC", STHeiti, "Microsoft Yahei", sans-serif;
}
.properties-list-panel h5 {
font-weight: normal;
color: #999;
font-size: 30px;
margin: 5px 0;
font-size: 14px;
}
.properties-list-panel .properties-list a {
font-family: Monaco,'Source Code Pro', STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
font-size: 12px;
margin-right: 2px;
}
.property-popup-desc {
max-height: 300px;
max-width: 500px;
overflow-y: auto;
overflow-x: auto;
}
.property-popup-desc .hljs {
background: transparent;
padding: 0;
}
.property-popup-desc hr {
border: none;
border-bottom: 1px solid #eee;
width: 80%;
}
.property-popup-desc blockquote {
font-size: 12px;
color: #999;
background-color: #fdfdfd;
border-left: 2px solid #ddd;
margin-left: 0px;
padding: 5px 10px;
}
.property-popup-desc blockquote p {
margin: 0;
font-size: 12px;
}
.property-popup-desc blockquote pre {
font-size: 12px;
}
.property-popup-desc iframe {
border: 1px solid #ccc;
display: block;
margin-top: 5px;
max-width: 100%;
}
.property-popup-desc img {
max-width: 100%;
}
.property-popup-desc p {
line-height: 1.7em;
margin: 12px 0 12px 0;
font-size: 14px;
}
.property-popup-desc pre {
margin: 5px 0;
border-radius: 5px;
background-color: #f5f7fa;
border: none;
padding: 10px;
font-size: 13px;
}
.property-popup-desc .codespan {
padding: 1px 5px;
font-size: 14px;
background-color: #f4f4f4;
border-radius: 4px;
}
.property-popup-desc code *, .property-popup-desc code {
font-family: 'Source Code Pro', 'Courier New', monospace;
}
.property-popup-desc ol {
margin-left: 20px;
}
.property-popup-desc ul li {
list-style: disc;
margin: 10px 20px;
font-size: 14px;
}
.property-popup-desc ol li {
list-style: decimal;
font-size: 14px;
}
.property-popup-desc a {
font-family: 'Source Code Pro', STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
}
.property-popup-desc pre {
font-size: 12px;
}
.property-popup-desc p {
font-size: 12px;
}
.property-popup-desc ul {
margin: 0;
padding: 0;
}
.property-popup-desc ul li {
font-size: 12px;
margin: 5px 20px;
list-style: disc;
}
.property-popup-desc pre {
padding: 5px;
}
.property-popup-desc .codespan {
font-size: 12px;
}
.control-color > * {
display: inline-block;
vertical-align: middle;
}
.control-color span {
font-size: 12px;
font-weight: bold;
}
.control-number .el-input-number {
width: 120px;
}
.control-vector > div {
display: inline-block;
margin-left: 8px;
font-size: 12px;
font-weight: bold;
}
.control-vector .control-vector-group > div {
display: inline-block;
margin-left: 5px;
}
.control-vector .el-input-number {
width: 90px;
}
.control-vector label {
text-transform: uppercase;
margin-right: 5px;
}
.control-enum-special {
font-style: italic;
}
.control-percent > div {
display: inline-block;
}
.control-percent .el-slider {
width: 200px;
display: inline-block;
vertical-align: middle;
}
.control-percent .el-input-number {
display: inline-block;
width: 90px;
margin-left: 10px;
}
.control-percent .el-radio-group {
margin-right: 10px;
}
.control-percent .el-radio-button--mini .el-radio-button__inner {
padding: 5px 4px;
font-size: 10px;
}
.control-percent-vector > div {
margin-top: 3px;
font-size: 12px;
font-weight: bold;
}
.control-percent-vector > div > label {
text-transform: uppercase;
margin-right: 5px;
}
.control-percent-vector .control-percent, .control-percent-vector label {
display: inline-block;
}
.control-percent-vector .control-percent .el-slider {
width: 100px;
}
.option-control {
margin-top: 10px;
}
.doc-content-item-card {
margin-top: 30px;
margin-left: 15px;
border-top: 1px solid #ccc;
position: relative;
padding: 15px 0;
}
.doc-content-item-card.current {
border-top: 1px solid #b03a5b;
}
.doc-content-item-card .hierarchy-line {
position: absolute;
top: 35px;
bottom: 0px;
left: -14px;
width: 10px;
border-left: 1px solid #C592A0;
border-bottom: 1px solid #C592A0;
}
.doc-content-item-card h4 {
margin: 0;
padding: 0;
font-family: 'Source Code Pro', monospace;
}
.doc-content-item-card h4 > * {
vertical-align: bottom;
display: inline-block;
}
.doc-content-item-card h4 .el-button {
padding: 2px;
font-size: 12px;
margin-left: -23px;
color: #C592A0;
border-color: #C592A0;
border-radius: 4px;
background: #fff;
position: relative;
}
.doc-content-item-card h4 .anchor {
color: #C592A0;
font-size: 16px;
text-decoration: none;
}
.doc-content-item-card h4 .anchor:hover {
text-decoration: underline;
}
.doc-content-item-card h4 .path-parent {
font-size: 12px;
padding: 0;
font-weight: normal;
}
.doc-content-item-card h4 .path-parent .separator {
margin: 0 3px;
color: #B03A5B;
}
.doc-content-item-card h4 .path-parent a {
color: #C592A0;
margin: 0;
}
.doc-content-item-card h4 .path-base {
font-size: 14px;
padding: 0;
margin-left: -4px;
font-weight: normal;
}
.doc-content-item-card h4 .path-base a {
color: #B03A5B;
margin: 0;
}
.doc-content-item-card h4 .path-parent a, .doc-content-item-card h4 .path-base a {
text-decoration: none;
}
.doc-content-item-card h4 .path-parent a:hover, .doc-content-item-card h4 .path-base a:hover {
text-decoration: underline;
}
.doc-content-item-card h4 .default-value {
color: #434343;
font-size: 16px;
margin-left: 15px;
vertical-align: bottom;
font-weight: normal;
}
.doc-content-item-card h4 .control-toggle {
float: right;
font-size: 14px;
cursor: pointer;
color: #555;
}
.doc-content-item-card h4 .control-toggle i {
font-family: iconfont;
font-style: normal;
vertical-align: middle;
}
.doc-content-item-card h4 .control-toggle:hover {
color: #999;
}
.doc-content-item-card h4 .control-toggle.active {
color: #409eff;
}
.doc-content-item-card.level-1 > h4 .anchor {
font-size: 20px;
}
.doc-content-item-card.level-1 > h4 .path-parent {
font-size: 16px;
}
.doc-content-item-card.level-1 > h4 .path-base {
font-size: 20px;
}
.doc-content-item-card.level-2 > h4 .anchor {
font-size: 16px;
}
.doc-content-item-card.level-2 > h4 .path-parent {
font-size: 14px;
}
.doc-content-item-card.level-2 > h4 .path-base {
font-size: 16px;
}
.doc-content-item-card.level-3 > h4 .anchor {
font-size: 16px;
}
.doc-content-item-card.level-3 > h4 .path-parent {
font-size: 13px;
}
.doc-content-item-card.level-3 > h4 .path-base {
font-size: 16px;
}
.doc-content-item-card.level-2 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-2 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-3 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-3 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-4 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-4 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-5 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-5 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-6 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-6 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-7 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-7 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-8 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-8 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-9 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-9 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-10 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-10 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card.level-11 {
border-top: 1px solid #eee;
margin-top: 10px;
}
.doc-content-item-card.level-11 .guider {
vertical-align: middle;
width: 28px;
margin-left: -39px;
margin-right: 2px;
border-top: 1px solid #C592A0;
position: relative;
}
.doc-content-item-card .prop-types {
margin-top: 5px;
display: inline-block;
}
.doc-content-item-card .option-control {
float: right;
}
.doc-content-item-card .prop-type {
display: inline-block;
margin-right: 4px;
border-radius: 4px;
padding: 3px 5px;
color: #333;
background-color: #f9f2f4;
font-size: 12px;
}
.doc-content-item-card .prop-type-string {
background-color: #f9f2f4;
}
.doc-content-item-card .prop-type-number {
background-color: #f9f2f4;
}
.doc-content-item-card .prop-type-boolean {
background-color: #f9f2f4;
}
.doc-content-item-card .properties-list-panel {
max-width: 700px;
}
.doc-content-item-card .children {
padding: 10px;
}
.ec-doc-mobile .doc-content-item-card {
margin-left: 0;
margin-top: 10px;
padding: 10px 10px;
background: #fff;
border-top: none;
}
.ec-doc-mobile .doc-content-item-card.level-1 > h4 .anchor {
font-size: 18px;
}
.ec-doc-mobile .doc-content-item-card.level-1 > h4 .path-parent {
font-size: 13px;
}
.ec-doc-mobile .doc-content-item-card.level-1 > h4 .path-base {
font-size: 18px;
}
.ec-doc-mobile .doc-content-item-card.level-1 > h4 .default-value {
font-size: 14px;
}
/* BASICS */
.CodeMirror {
/* Set height, width, borders, and global font properties here */
font-family: monospace;
height: 300px;
color: black;
direction: ltr;
}
/* PADDING */
.CodeMirror-lines {
padding: 4px 0; /* Vertical padding around content */
}
.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
padding: 0 4px; /* Horizontal padding of content */
}
.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
background-color: white; /* The little square between H and V scrollbars */
}
/* GUTTER */
.CodeMirror-gutters {
border-right: 1px solid #ddd;
background-color: #f7f7f7;
white-space: nowrap;
}
.CodeMirror-linenumbers {}
.CodeMirror-linenumber {
padding: 0 3px 0 5px;
min-width: 20px;
text-align: right;
color: #999;
white-space: nowrap;
}
.CodeMirror-guttermarker { color: black; }
.CodeMirror-guttermarker-subtle { color: #999; }
/* CURSOR */
.CodeMirror-cursor {
border-left: 1px solid black;
border-right: none;
width: 0;
}
/* Shown when moving in bi-directional text */
.CodeMirror div.CodeMirror-secondarycursor {
border-left: 1px solid silver;
}
.cm-fat-cursor .CodeMirror-cursor {
width: auto;
border: 0 !important;
background: #7e7;
}
.cm-fat-cursor div.CodeMirror-cursors {
z-index: 1;
}
.cm-fat-cursor-mark {
background-color: rgba(20, 255, 20, 0.5);
-webkit-animation: blink 1.06s steps(1) infinite;
-moz-animation: blink 1.06s steps(1) infinite;
animation: blink 1.06s steps(1) infinite;
}
.cm-animate-fat-cursor {
width: auto;
border: 0;
-webkit-animation: blink 1.06s steps(1) infinite;
-moz-animation: blink 1.06s steps(1) infinite;
animation: blink 1.06s steps(1) infinite;
background-color: #7e7;
}
@-moz-keyframes blink {
0% {}
50% { background-color: transparent; }
100% {}
}
@-webkit-keyframes blink {
0% {}
50% { background-color: transparent; }
100% {}
}
@keyframes blink {
0% {}
50% { background-color: transparent; }
100% {}
}
/* Can style cursor different in overwrite (non-insert) mode */
.CodeMirror-overwrite .CodeMirror-cursor {}
.cm-tab { display: inline-block; text-decoration: inherit; }
.CodeMirror-rulers {
position: absolute;
left: 0; right: 0; top: -50px; bottom: 0;
overflow: hidden;
}
.CodeMirror-ruler {
border-left: 1px solid #ccc;
top: 0; bottom: 0;
position: absolute;
}
/* DEFAULT THEME */
.cm-s-default .cm-header {color: blue;}
.cm-s-default .cm-quote {color: #090;}
.cm-negative {color: #d44;}
.cm-positive {color: #292;}
.cm-header, .cm-strong {font-weight: bold;}
.cm-em {font-style: italic;}
.cm-link {text-decoration: underline;}
.cm-strikethrough {text-decoration: line-through;}
.cm-s-default .cm-keyword {color: #708;}
.cm-s-default .cm-atom {color: #219;}
.cm-s-default .cm-number {color: #164;}
.cm-s-default .cm-def {color: #00f;}
.cm-s-default .cm-variable,
.cm-s-default .cm-punctuation,
.cm-s-default .cm-property,
.cm-s-default .cm-operator {}
.cm-s-default .cm-variable-2 {color: #05a;}
.cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: #085;}
.cm-s-default .cm-comment {color: #a50;}
.cm-s-default .cm-string {color: #a11;}
.cm-s-default .cm-string-2 {color: #f50;}
.cm-s-default .cm-meta {color: #555;}
.cm-s-default .cm-qualifier {color: #555;}
.cm-s-default .cm-builtin {color: #30a;}
.cm-s-default .cm-bracket {color: #997;}
.cm-s-default .cm-tag {color: #170;}
.cm-s-default .cm-attribute {color: #00c;}
.cm-s-default .cm-hr {color: #999;}
.cm-s-default .cm-link {color: #00c;}
.cm-s-default .cm-error {color: #f00;}
.cm-invalidchar {color: #f00;}
.CodeMirror-composing { border-bottom: 2px solid; }
/* Default styles for common addons */
div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
.CodeMirror-activeline-background {background: #e8f2ff;}
/* STOP */
/* The rest of this file contains styles related to the mechanics of
the editor. You probably shouldn't touch them. */
.CodeMirror {
position: relative;
overflow: hidden;
background: white;
}
.CodeMirror-scroll {
overflow: scroll !important; /* Things will break if this is overridden */
/* 50px is the magic margin used to hide the element's real scrollbars */
/* See overflow: hidden in .CodeMirror */
margin-bottom: -50px; margin-right: -50px;
padding-bottom: 50px;
height: 100%;
outline: none; /* Prevent dragging from highlighting the element */
position: relative;
}
.CodeMirror-sizer {
position: relative;
border-right: 50px solid transparent;
}
/* The fake, visible scrollbars. Used to force redraw during scrolling
before actual scrolling happens, thus preventing shaking and
flickering artifacts. */
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
position: absolute;
z-index: 6;
display: none;
}
.CodeMirror-vscrollbar {
right: 0; top: 0;
overflow-x: hidden;
overflow-y: scroll;
}
.CodeMirror-hscrollbar {
bottom: 0; left: 0;
overflow-y: hidden;
overflow-x: scroll;
}
.CodeMirror-scrollbar-filler {
right: 0; bottom: 0;
}
.CodeMirror-gutter-filler {
left: 0; bottom: 0;
}
.CodeMirror-gutters {
position: absolute; left: 0; top: 0;
min-height: 100%;
z-index: 3;
}
.CodeMirror-gutter {
white-space: normal;
height: 100%;
display: inline-block;
vertical-align: top;
margin-bottom: -50px;
}
.CodeMirror-gutter-wrapper {
position: absolute;
z-index: 4;
background: none !important;
border: none !important;
}
.CodeMirror-gutter-background {
position: absolute;
top: 0; bottom: 0;
z-index: 4;
}
.CodeMirror-gutter-elt {
position: absolute;
cursor: default;
z-index: 4;
}
.CodeMirror-gutter-wrapper ::selection { background-color: transparent }
.CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }
.CodeMirror-lines {
cursor: text;
min-height: 1px; /* prevents collapsing before first draw */
}
.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
/* Reset some styles that the rest of the page might have set */
-moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
border-width: 0;
background: transparent;
font-family: inherit;
font-size: inherit;
margin: 0;
white-space: pre;
word-wrap: normal;
line-height: inherit;
color: inherit;
z-index: 2;
position: relative;
overflow: visible;
-webkit-tap-highlight-color: transparent;
-webkit-font-variant-ligatures: contextual;
font-variant-ligatures: contextual;
}
.CodeMirror-wrap pre.CodeMirror-line,
.CodeMirror-wrap pre.CodeMirror-line-like {
word-wrap: break-word;
white-space: pre-wrap;
word-break: normal;
}
.CodeMirror-linebackground {
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
z-index: 0;
}
.CodeMirror-linewidget {
position: relative;
z-index: 2;
padding: 0.1px; /* Force widget margins to stay inside of the container */
}
.CodeMirror-widget {}
.CodeMirror-rtl pre { direction: rtl; }
.CodeMirror-code {
outline: none;
}
/* Force content-box sizing for the elements where we expect it */
.CodeMirror-scroll,
.CodeMirror-sizer,
.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber {
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.CodeMirror-measure {
position: absolute;
width: 100%;
height: 0;
overflow: hidden;
visibility: hidden;
}
.CodeMirror-cursor {
position: absolute;
pointer-events: none;
}
.CodeMirror-measure pre { position: static; }
div.CodeMirror-cursors {
visibility: hidden;
position: relative;
z-index: 3;
}
div.CodeMirror-dragcursors {
visibility: visible;
}
.CodeMirror-focused div.CodeMirror-cursors {
visibility: visible;
}
.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.CodeMirror-crosshair { cursor: crosshair; }
.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
.cm-searching {
background-color: #ffa;
background-color: rgba(255, 255, 0, .4);
}
/* Used to force a border model for a node */
.cm-force-border { padding-right: .1px; }
@media print {
/* Hide the cursor when printing */
.CodeMirror div.CodeMirror-cursors {
visibility: hidden;
}
}
/* See issue #2901 */
.cm-tab-wrap-hack:after { content: ''; }
/* Help users use markselection to safely style text background */
span.CodeMirror-selectedtext { background: none; }
/*
Name: dracula
Author: Michael Kaminsky (http://github.com/mkaminsky11)
Original dracula color scheme by Zeno Rocha (https://github.com/zenorocha/dracula-theme)
*/
.cm-s-dracula.CodeMirror, .cm-s-dracula .CodeMirror-gutters {
background-color: #282a36 !important;
color: #f8f8f2 !important;
border: none;
}
.cm-s-dracula .CodeMirror-gutters { color: #282a36; }
.cm-s-dracula .CodeMirror-cursor { border-left: solid thin #f8f8f0; }
.cm-s-dracula .CodeMirror-linenumber { color: #6D8A88; }
.cm-s-dracula .CodeMirror-selected { background: rgba(255, 255, 255, 0.10); }
.cm-s-dracula .CodeMirror-line::selection, .cm-s-dracula .CodeMirror-line > span::selection, .cm-s-dracula .CodeMirror-line > span > span::selection { background: rgba(255, 255, 255, 0.10); }
.cm-s-dracula .CodeMirror-line::-moz-selection, .cm-s-dracula .CodeMirror-line > span::-moz-selection, .cm-s-dracula .CodeMirror-line > span > span::-moz-selection { background: rgba(255, 255, 255, 0.10); }
.cm-s-dracula span.cm-comment { color: #6272a4; }
.cm-s-dracula span.cm-string, .cm-s-dracula span.cm-string-2 { color: #f1fa8c; }
.cm-s-dracula span.cm-number { color: #bd93f9; }
.cm-s-dracula span.cm-variable { color: #50fa7b; }
.cm-s-dracula span.cm-variable-2 { color: white; }
.cm-s-dracula span.cm-def { color: #50fa7b; }
.cm-s-dracula span.cm-operator { color: #ff79c6; }
.cm-s-dracula span.cm-keyword { color: #ff79c6; }
.cm-s-dracula span.cm-atom { color: #bd93f9; }
.cm-s-dracula span.cm-meta { color: #f8f8f2; }
.cm-s-dracula span.cm-tag { color: #ff79c6; }
.cm-s-dracula span.cm-attribute { color: #50fa7b; }
.cm-s-dracula span.cm-qualifier { color: #50fa7b; }
.cm-s-dracula span.cm-property { color: #66d9ef; }
.cm-s-dracula span.cm-builtin { color: #50fa7b; }
.cm-s-dracula span.cm-variable-3, .cm-s-dracula span.cm-type { color: #ffb86c; }
.cm-s-dracula .CodeMirror-activeline-background { background: rgba(255,255,255,0.1); }
.cm-s-dracula .CodeMirror-matchingbracket { text-decoration: underline; color: white !important; }
#example-panel {
position: fixed;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
padding: 10px 0px;
text-align: left;
background: #fff;
}
#example-panel h2 {
font-weight: normal;
font-size: 20px;
color: #333;
padding-left: 20px;
font-weight: bold;
margin: 5px 0;
}
#example-panel p.intro {
color: #aaa;
padding-left: 20px;
margin: 5px 0;
font-size: 12px;
}
#example-panel .preview-and-code {
position: absolute;
top: 75px;
bottom: 0;
left: 0;
right: 0;
}
#example-panel .el-alert {
position: absolute;
top: 0;
}
#example-panel .preview-main {
padding: 0 10px;
background: #fefefe;
box-sizing: border-box;
}
#example-panel .example-code {
position: relative;
}
#example-panel .example-code .codemirror-main {
position: absolute;
left: 10px;
top: 10px;
right: 10px;
bottom: 15px;
box-shadow: -5px -5px 15px rgba(0, 0, 0, 0.1);
}
#example-panel .example-code .codemirror-main .CodeMirror {
height: 100%;
overflow-y: scroll;
border-radius: 6px;
font-family: 'Source Code Pro', monospace;
font-size: 13px;
}
#example-panel .example-code .codemirror-main .CodeMirror .CodeMirror-scroll {
padding: 15px;
}
#example-panel .example-code .codemirror-main .CodeMirror ::-webkit-scrollbar-thumb {
width: 8px;
min-height: 15px;
background: rgba(255, 255, 255, 0.3) !important;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
border-radius: 2px;
}
#example-panel .example-code .codemirror-main .CodeMirror .option-changed {
background: rgba(255, 255, 255, 0.1);
}
#example-panel .example-code .codemirror-main .CodeMirror .CodeMirror-cursor {
display: none;
}
#example-panel .toolbar {
position: absolute;
top: 15px;
right: 10px;
}
#example-panel .toolbar .example-list {
width: 180px;
}
#example-panel.right-layout {
bottom: 0;
top: 40px;
right: 10px;
}
#example-panel.right-layout .preview-main {
width: 100%;
height: 50%;
}
#example-panel.right-layout .example-code {
width: 100%;
height: 50%;
}
#example-panel.bottom-layout {
left: 300px;
bottom: 0;
right: 10px;
}
#example-panel.bottom-layout .preview-main {
width: 50%;
height: 100%;
float: left;
}
#example-panel.bottom-layout .example-code {
width: 50%;
height: 100%;
float: left;
}
#example-panel.top-layout {
left: 300px;
top: 50px;
right: 10px;
}
#example-panel.top-layout .preview-main {
width: 50%;
height: 100%;
float: left;
}
#example-panel.top-layout .example-code {
width: 50%;
height: 100%;
float: left;
}
.example-change-layout .layout-title > i {
font-size: 14px;
margin-right: 5px;
}
.example-change-layout .layout-mode {
margin-top: 10px;
}
.doc-main {
margin-left: 10px;
}
.doc-main .open-option-example {
position: fixed;
right: 0;
top: 50%;
padding: 10px;
border-radius: 20px 0 0 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
background: #fff;
cursor: pointer;
font-size: 12px;
}
.doc-main .open-option-example:hover {
background: #eee;
}
.doc-main .open-option-example i {
font-size: 16px;
vertical-align: middle;
}
.doc-content {
text-align: left;
color: #4d555e;
}
.doc-content.option-example-actived.option-example-right-layout {
margin-right: 45%;
}
.doc-content h2 {
color: #B03A5B;
font-size: 34px;
border-bottom: 1px solid #ccc;
height: 45px;
line-height: 45px;
margin: 0;
font-weight: normal;
box-sizing: content-box;
}
.doc-content h3 {
font-weight: normal;
color: #969696;
font-size: 28px;
margin: 20px 0px 20px 20px;
}
.doc-content .page-description {
padding: 5px 0;
}
.doc-content .page-description .hljs {
background: transparent;
padding: 0;
}
.doc-content .page-description hr {
border: none;
border-bottom: 1px solid #eee;
width: 80%;
}
.doc-content .page-description blockquote {
font-size: 12px;
color: #999;
background-color: #fdfdfd;
border-left: 2px solid #ddd;
margin-left: 0px;
padding: 5px 10px;
}
.doc-content .page-description blockquote p {
margin: 0;
font-size: 12px;
}
.doc-content .page-description blockquote pre {
font-size: 12px;
}
.doc-content .page-description iframe {
border: 1px solid #ccc;
display: block;
margin-top: 5px;
max-width: 100%;
}
.doc-content .page-description img {
max-width: 100%;
}
.doc-content .page-description p {
line-height: 1.7em;
margin: 12px 0 12px 0;
font-size: 14px;
}
.doc-content .page-description pre {
margin: 5px 0;
border-radius: 5px;
background-color: #f5f7fa;
border: none;
padding: 10px;
font-size: 13px;
}
.doc-content .page-description .codespan {
padding: 1px 5px;
font-size: 14px;
background-color: #f4f4f4;
border-radius: 4px;
}
.doc-content .page-description code *, .doc-content .page-description code {
font-family: 'Source Code Pro', 'Courier New', monospace;
}
.doc-content .page-description ol {
margin-left: 20px;
}
.doc-content .page-description ul li {
list-style: disc;
margin: 10px 20px;
font-size: 14px;
}
.doc-content .page-description ol li {
list-style: decimal;
font-size: 14px;
}
.doc-content .page-description a {
font-family: 'Source Code Pro', STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
}
.doc-content .item-description {
margin: 0;
padding: 5px 0;
}
.doc-content .item-description .hljs {
background: transparent;
padding: 0;
}
.doc-content .item-description hr {
border: none;
border-bottom: 1px solid #eee;
width: 80%;
}
.doc-content .item-description blockquote {
font-size: 12px;
color: #999;
background-color: #fdfdfd;
border-left: 2px solid #ddd;
margin-left: 0px;
padding: 5px 10px;
}
.doc-content .item-description blockquote p {
margin: 0;
font-size: 12px;
}
.doc-content .item-description blockquote pre {
font-size: 12px;
}
.doc-content .item-description iframe {
border: 1px solid #ccc;
display: block;
margin-top: 5px;
max-width: 100%;
}
.doc-content .item-description img {
max-width: 100%;
}
.doc-content .item-description p {
line-height: 1.7em;
margin: 12px 0 12px 0;
font-size: 14px;
}
.doc-content .item-description pre {
margin: 5px 0;
border-radius: 5px;
background-color: #f5f7fa;
border: none;
padding: 10px;
font-size: 13px;
}
.doc-content .item-description .codespan {
padding: 1px 5px;
font-size: 14px;
background-color: #f4f4f4;
border-radius: 4px;
}
.doc-content .item-description code *, .doc-content .item-description code {
font-family: 'Source Code Pro', 'Courier New', monospace;
}
.doc-content .item-description ol {
margin-left: 20px;
}
.doc-content .item-description ul li {
list-style: disc;
margin: 10px 20px;
font-size: 14px;
}
.doc-content .item-description ol li {
list-style: decimal;
font-size: 14px;
}
.doc-content .item-description a {
font-family: 'Source Code Pro', STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
}
.ec-doc-tutorial .page-description h2 {
font-weight: normal;
font-size: 22px;
margin-left: 0;
margin-top: 40px;
}
.ec-doc-mobile .doc-main {
margin-left: 0;
}
.ec-doc-mobile .doc-content {
background: #f2f2f2;
margin-bottom: 100px;
}
.ec-doc-mobile .page-description {
padding: 5px 10px;
background: #fff;
}
.ec-doc-mobile h2 {
font-size: 22px;
font-weight: normal;
padding: 20px 10px;
border-bottom: none;
}
.ec-doc-mobile h3 {
font-size: 20px;
padding-left: 10px;
}
.doc-search {
padding: 5px;
}
.doc-search .search-input {
width: 100%;
}
.el-autocomplete-suggestion.search-input-popper {
width: 300px !important;
}
.el-autocomplete-suggestion.search-input-popper li {
line-height: 28px;
padding: 0 10px;
}
.doc-path-suggestion-item {
font-family: Monaco,Consolas,Courier new,monospace;
font-size: 12px;
}
.doc-search-result-item-card {
margin: 30px 10px;
border-top: 1px solid #ccc;
}
.doc-search-result-item-card h4 {
margin: 10px 0;
}
.doc-search-result-item-card h4 > * {
vertical-align: middle;
display: inline-block;
}
.doc-search-result-item-card h4 a.path {
font-family: Montserrat, sans-serif;
font-size: 18px;
padding-left: 5px;
padding: 0;
font-weight: normal;
color: #B03A5B;
}
.doc-search-result-item-card .item-description mark, .doc-search-result-item-card h4 mark {
background-color: #fc0;
border-radius: 3px;
padding: 2px;
}
.doc-search-result-item-card .other-result {
font-size: 12px;
padding: 0 0 10px 0;
}
.doc-search-result-item-card .other-result > div {
font-family: Montserrat, sans-serif;
}
.doc-search-result-item-card.needs-show-more .item-description {
max-height: 200px;
overflow-y: hidden;
}
.doc-search-result-item-card.needs-show-more .show-more-button {
display: block;
}
.doc-search-result-item-card .show-more-button {
display: none;
text-align: center;
cursor: pointer;
}
.doc-search-result-item-card .hljs {
background: transparent;
padding: 0;
}
.doc-search-result-item-card hr {
border: none;
border-bottom: 1px solid #eee;
width: 80%;
}
.doc-search-result-item-card blockquote {
font-size: 12px;
color: #999;
background-color: #fdfdfd;
border-left: 2px solid #ddd;
margin-left: 0px;
padding: 5px 10px;
}
.doc-search-result-item-card blockquote p {
margin: 0;
font-size: 12px;
}
.doc-search-result-item-card blockquote pre {
font-size: 12px;
}
.doc-search-result-item-card iframe {
border: 1px solid #ccc;
display: block;
margin-top: 5px;
max-width: 100%;
}
.doc-search-result-item-card img {
max-width: 100%;
}
.doc-search-result-item-card p {
line-height: 1.7em;
margin: 12px 0 12px 0;
font-size: 14px;
}
.doc-search-result-item-card pre {
margin: 5px 0;
border-radius: 5px;
background-color: #f5f7fa;
border: none;
padding: 10px;
font-size: 13px;
}
.doc-search-result-item-card .codespan {
padding: 1px 5px;
font-size: 14px;
background-color: #f4f4f4;
border-radius: 4px;
}
.doc-search-result-item-card code *, .doc-search-result-item-card code {
font-family: 'Source Code Pro', 'Courier New', monospace;
}
.doc-search-result-item-card ol {
margin-left: 20px;
}
.doc-search-result-item-card ul li {
list-style: disc;
margin: 10px 20px;
font-size: 14px;
}
.doc-search-result-item-card ol li {
list-style: decimal;
font-size: 14px;
}
.doc-search-result-item-card a {
font-family: 'Source Code Pro', STHeiti, "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
}
.doc-search-result-item-card iframe, .doc-search-result-item-card pre, .doc-search-result-item-card image {
display: none;
}
.ec-doc-mobile .doc-search-result-item-card {
margin: 30px 0;
}
.doc-search-result h3 {
font-weight: normal;
font-size: 24px;
margin: 20px 20px 20px 0;
}
.doc-search-result .result-summary {
padding: 10px 0;
color: #999;
}
.doc-search-result .result-summary .searching {
color: #B03A5B;
}
.ec-doc-mobile .doc-search-result {
padding: 0 10px;
}
@font-face {
font-family: 'iconfont';
src: url(../css/icon.eot);
src: url(../css/icon.eot#iefix) format("embedded-opentype"), url(../css/icon.ttf) format("truetype"), url(../css/icon.woff) format("woff"), url(../css/icon.svg) format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
@font-face {
font-family: 'Source Code Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(../css/SourceCodePro-Regular.woff) format("woff");
}
.ec-doc {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;
height: 100%;
}
.ec-doc ul, .ec-doc ol {
margin: 0;
padding: 0;
}
.ec-doc a {
color: #337ab7;
text-decoration: none;
margin: 0 3px;
}
.ec-doc a:hover {
text-decoration: underline;
}
.ec-doc > .el-aside {
border-right: 1px solid #ddd;
position: relative;
}
.ec-doc > .el-aside .doc-type-nav {
border-bottom: 1px solid #eee;
margin-bottom: 10px;
margin-left: 5px;
}
.ec-doc > .el-aside .doc-type-nav a {
display: inline-block;
line-height: 35px;
width: 20%;
text-align: center;
box-sizing: border-box;
text-decoration: none;
color: #000;
cursor: pointer;
font-size: 14px;
}
.ec-doc > .el-aside .doc-type-nav a.selected {
border-top: 3px solid #B03A5B;
}
.ec-doc > .el-aside .doc-nav {
position: absolute;
top: 90px;
bottom: 0;
left: 0;
right: 0;
overflow-y: scroll;
}
.ec-doc > .el-main {
text-align: center;
}
.ec-doc > .el-main > div {
margin: 0 auto;
text-align: left;
min-width: 100%;
}
.ec-doc.ec-doc-locale-zh .doc-type-nav a {
width: 20%;
}
.el-select-dropdown.el-popper {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ec-doc-mobile {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;
position: relative;
}
.ec-doc-mobile ul, .ec-doc-mobile ol {
margin: 0;
padding: 0;
}
.ec-doc-mobile a {
color: #337ab7;
text-decoration: none;
margin: 0 3px;
}
.ec-doc-mobile a:hover {
text-decoration: underline;
}
.ec-doc-mobile .top-bar {
position: sticky;
top: 0;
height: 90px;
left: 0;
right: 0;
background: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
border-bottom: 1px solid #ddd;
z-index: 10;
}
.ec-doc-mobile .doc-type-nav {
border-bottom: 1px solid #eee;
margin-bottom: 10px;
margin-left: 5px;
}
.ec-doc-mobile .doc-type-nav a {
display: inline-block;
line-height: 30px;
width: 22%;
text-align: center;
box-sizing: border-box;
text-decoration: none;
color: #000;
cursor: pointer;
font-size: 14px;
}
.ec-doc-mobile .doc-type-nav a.selected {
border-top: 3px solid #B03A5B;
}
.ec-doc-mobile .doc-mobile-toolbar {
display: flex;
flex-direction: row;
}
.ec-doc-mobile .doc-mobile-toolbar .open-nav {
margin: 6px 5px;
}
.ec-doc-mobile .doc-mobile-toolbar .doc-search {
flex: 1;
}
.ec-doc-mobile .doc-breadcrumb {
position: fixed;
text-align: center;
left: 50%;
transform: translate(-50%, 0);
bottom: 20px;
border-radius: 4px;
padding: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
background: #337ab7;
}
.ec-doc-mobile .doc-breadcrumb a {
display: inline-block;
color: #fff;
}
.el-drawer .doc-nav {
position: absolute;
top: 10px;
bottom: 0;
left: 0;
right: 0;
overflow-y: scroll;
}
/**
* GitHub Gist Theme
* Author : Anthony Attard - https://github.com/AnthonyAttard
* Author : Louis Barranqueiro - https://github.com/LouisBarranqueiro
*/
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #d73a49;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #6f42c1;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
.hljs-number {
color: #005cc5;
}
.hljs-string {
color: #032f62;
}