bee-table/demo/atom-one-dark.css

224 lines
3.5 KiB
CSS
Raw Normal View History

2016-12-26 16:52:39 +08:00
/*
Atom One Dark by Daniel Gamage
Original One Dark Syntax theme from https://github.com/atom/one-dark-syntax
base: #282c34
mono-1: #abb2bf
mono-2: #818896
mono-3: #5c6370
hue-1: #56b6c2
hue-2: #61aeee
hue-3: #c678dd
hue-4: #98c379
hue-5: #e06c75
hue-5-2: #be5046
hue-6: #d19a66
hue-6-2: #e6c07b
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
2019-03-21 10:02:37 +08:00
color: #424242;
background: #FAFAFA;
2016-12-26 16:52:39 +08:00
}
.hljs-comment,
.hljs-quote {
2019-03-21 10:02:37 +08:00
color: #424242;
2016-12-26 16:52:39 +08:00
font-style: italic;
}
.hljs-doctag,
.hljs-keyword,
.hljs-formula {
color: #c678dd;
}
.hljs-section,
.hljs-name,
.hljs-selector-tag,
.hljs-deletion,
.hljs-subst {
color: #e06c75;
}
.hljs-literal {
color: #56b6c2;
}
.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-attribute,
.hljs-meta-string {
color: #98c379;
}
.hljs-built_in,
.hljs-class .hljs-title {
color: #e6c07b;
}
.hljs-attr,
.hljs-variable,
.hljs-template-variable,
.hljs-type,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-number {
color: #d19a66;
}
.hljs-symbol,
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-title {
color: #61aeee;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bold;
}
.hljs-link {
text-decoration: underline;
}
2019-03-21 10:02:37 +08:00
.component-demo .u-panel {
padding: 18px 20px;
border: 1px solid #F0F0F0;
}
.component-demo .u-panel-default .u-panel-heading{
background-color: #fff;
padding: 0;
position: relative;
margin-bottom: 20px;
}
.component-demo p{
margin: 0;
font-size: 14px;
}
.component-demo .component-title{
font-size: 14px;
font-weight: bold;
}
.component-demo .component-code{
position: absolute;
right: 0;
top: 0;
color: #E14C46;
font-size: 14px;
cursor: pointer;
}
.component-demo .u-panel .u-panel-body{
padding: 0;
}
.component-drawerc .pre-js,.component-drawerc .pre-css{
margin: 0;
}
.component-drawerc .drawer-body {
padding: 20px 20px;
}
.component-drawerc .component-code-copy {
font-size: 14px;
font-weight: 800;
color: #424242;
padding: 10px 0;
position: relative;
}
.component-drawerc .component-code-copy .uf-copy::before{
content: "\e6fc";
}
.component-drawerc .component-code-copy .uf{
font-weight: 100;
}
.component-drawerc .component-code-copy.copy-css{
margin-top: 20px;
}
.component-drawerc .component-code-copy .u-clipboard{
position: absolute;
right: 0;
}
/* 抽屉组件样式覆盖 */
.component-drawerc{
2019-03-22 17:13:07 +08:00
/* position: fixed; */
2019-03-21 10:02:37 +08:00
top: 0;
left: 0;
2019-03-22 17:13:07 +08:00
z-index: 1!important;
2019-03-21 10:02:37 +08:00
width: 0;
height: 100%;
}
.component-drawerc .drawer-mask{
background-color: rgba(0,0,0,.3);
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
transition: transform 300ms ease-in-out, opacity 300ms ease-in-out;
2019-03-22 17:13:07 +08:00
z-index: 2;
2019-03-21 10:02:37 +08:00
}
.component-drawerc .drawer-close{
position: absolute;
top: 10px;
right: 10px;
font-size: 20px;
cursor: pointer;
}
.component-drawerc .drawer{
position: fixed;
background-color: #fff;
transition: transform 300ms ease-in-out;
overflow: auto;
}
.component-drawerc .drawer-left{
top: 0;
left: 0;
height: 100%;
}
.component-drawerc .drawer-right{
top: 0;
right: 0;
height: 100%;
2019-03-22 17:13:07 +08:00
z-index: 3;
2019-03-21 10:02:37 +08:00
}
.component-drawerc .drawer-top{
top: 0;
left: 0;
width: 100%;
}
.component-drawerc .drawer-bottom{
bottom: 0;
left: 0;
width: 100%;
}
.component-drawerc .drawer-header{
padding: 0 20px;
border-radius: 0;
background: #E14C46;
color: #fff;
border-bottom: 1px solid #e8e8e8;
}
.component-drawerc .drawer-header-title{
margin: 0;
color: #fff;
height: 40px;
line-height: 40px;
}