TDH_2/themes/demo/assets/less/elements/code.less

97 lines
1.8 KiB
Plaintext

pre {
padding: 0;
background-color: white;
border: 1px solid #ECF0F1;
border-radius: 6px;
.CodeMirror {
height: auto;
color: #2C3E4F;
}
.CodeMirror-gutters {
background: transparent;
border-right: 1px solid #ECF0F1;
}
.CodeMirror-linenumber {
padding-right: 15px;
background: white;
}
.CodeMirror-lines {
padding: 10px 0;
}
.CodeMirror pre.CodeMirror-line {
padding-left: 20px;
}
}
.collapsed-code-block {
position: relative;
.expand-code {
display: none;
}
&.collapsed {
margin-bottom: 36px;
> pre {
height: 143px;
overflow: hidden;
position: relative;
}
.expand-code {
border-radius: 20px;
user-select: none;
cursor: pointer;
display: block;
position: absolute;
bottom: -15px;
left: 50%;
font-size: 14px;
background-color: white;
border: 1px solid #ECF0F1;
z-index: 5;
transform: translateX(-50%);
padding: 4px 18px;
box-shadow: 0 0 0 3px white;
&:hover {
color: white;
background-color: #7F8C8D;
}
}
}
}
.code-tab {
display: inline-block;
font-size: 14px;
padding: 8px 0 0 13px;
position: relative;
&, &:after {
height: 38px;
background: url('@{assets-url}/images/code-tab.png') no-repeat 0 0;
background-size: 335px 38px;
}
&:after {
content: '';
width: 34px;
display: block;
position: absolute;
right: -34px;
top: 0;
background-position: right top;
}
+ pre {
border-radius: 0 6px 6px 6px;
}
}