160 lines
2.3 KiB
CSS
160 lines
2.3 KiB
CSS
/* start reset & function */
|
|
body {
|
|
font-size: 13px;
|
|
margin: 0;
|
|
color: #000;
|
|
}
|
|
|
|
ul {
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.fn-left {
|
|
float: left;
|
|
}
|
|
|
|
.fn-right {
|
|
float: right;
|
|
}
|
|
|
|
.fn-clear:before,
|
|
.fn-clear:after {
|
|
display: table;
|
|
content: "";
|
|
}
|
|
|
|
.fn-clear:after {
|
|
clear: both;
|
|
}
|
|
|
|
.fn-none {
|
|
display: none;
|
|
}
|
|
/* end reset & function */
|
|
|
|
/* start frame */
|
|
.frame {
|
|
position: absolute;
|
|
border: 1px solid #5F5F5F;
|
|
background-color: #F8F8F8;
|
|
width: 340px;
|
|
z-index: 5;
|
|
}
|
|
|
|
.frame li {
|
|
padding: 0 5px;
|
|
line-height: 25px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.frame li:hover {
|
|
background-color: #3875D7;
|
|
color: #FFF;
|
|
}
|
|
/* end frame */
|
|
|
|
/* start tabs */
|
|
.tabs {
|
|
height: 20px;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
}
|
|
|
|
.tabs > div {
|
|
background-color: #D1D1D1;
|
|
float: left;
|
|
border-right: 1px solid #9B9B9B;
|
|
padding: 2px 5px;
|
|
color: #333;
|
|
}
|
|
|
|
.tabs > div.current {
|
|
background-color: #F7F7F7;
|
|
}
|
|
|
|
.tabs .ico-close {
|
|
cursor: pointer;
|
|
}
|
|
/* end tabs */
|
|
|
|
/* start framework */
|
|
.menu {
|
|
background-color: #F0F0F0;
|
|
border-bottom: 1px solid #A5A5A5;
|
|
height: 25px;
|
|
}
|
|
|
|
.content {
|
|
position: relative;
|
|
}
|
|
|
|
.side {
|
|
width: 20%;
|
|
position: absolute;
|
|
border-right: 1px solid #9B9B9B;
|
|
height: 100%;
|
|
}
|
|
|
|
.ztree {
|
|
position: absolute;
|
|
overflow: auto;
|
|
width: 100%;
|
|
padding: 0;
|
|
}
|
|
|
|
.main {
|
|
width: 80%;
|
|
position: absolute;
|
|
left: 20%;
|
|
}
|
|
|
|
.footer {
|
|
border-top: 1px solid #919191;
|
|
background-color: #F0F0F0;
|
|
}
|
|
/* end framework */
|
|
|
|
/* start editor */
|
|
.edit-panel {
|
|
background-color: #D7D7D7;
|
|
width: 100%
|
|
}
|
|
|
|
.CodeMirror-focused .cm-matchhighlight {
|
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
|
|
background-position: bottom;
|
|
background-repeat: repeat-x;
|
|
}
|
|
/* end editor */
|
|
|
|
/* start output */
|
|
.output .tabs {
|
|
background-color: #CAD3E3;
|
|
border-top: 1px solid #8E97A7;
|
|
border-bottom: 1px solid #8E97A7;
|
|
}
|
|
|
|
.output .tabs > div {
|
|
background-color: #B5BDCC;
|
|
border-left-color: #9096A2;
|
|
}
|
|
|
|
.output .tabs > div.current {
|
|
background-color: #8B99B3;
|
|
color: #FFF;
|
|
}
|
|
|
|
#output {
|
|
border-width: 0;
|
|
color: #555555;
|
|
height: 130px;
|
|
width: 100%;
|
|
}
|
|
/* end output */
|