|
|
|
|
html {
|
|
|
|
|
height: 100%;
|
|
|
|
|
font-size: 100%;
|
|
|
|
|
background: #fff; // fallback to show the error message to browsers that don't support CSS variables.
|
|
|
|
|
background: var(--documentBackground);
|
|
|
|
|
|
|
|
|
|
@include mobile { font-size: 93.75%; }
|
|
|
|
|
|
|
|
|
|
@include print { background: none; }
|
|
|
|
|
@import 'global/print';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
height: 100%;
|
|
|
|
|
margin: 0;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
font-size: 1em;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
font-family: $baseFont;
|
|
|
|
|
line-height: 1.7;
|
|
|
|
|
color: $textColor; // fallback to show the error message to browsers that don't support CSS variables.
|
|
|
|
|
color: var(--textColor);
|
|
|
|
|
word-wrap: break-word;
|
|
|
|
|
overflow-wrap: break-word;
|
|
|
|
|
background: var(--contentBackground);
|
|
|
|
|
touch-action: manipulation;
|
|
|
|
|
-webkit-tap-highlight-color: rgba(black, 0);
|
|
|
|
|
-webkit-touch-callout: none;
|
|
|
|
|
-webkit-text-size-adjust: 100%;
|
|
|
|
|
-ms-text-size-adjust: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
a {
|
|
|
|
|
color: var(--linkColor);
|
|
|
|
|
text-decoration: var(--linkTextDecoration);
|
|
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
color: var(--linkColorHover);
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
max-width: 100%;
|
|
|
|
|
height: auto;
|
|
|
|
|
border: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
|
|
|
margin: 1.5em 0 1em;
|
|
|
|
|
line-height: 1.3;
|
|
|
|
|
font-weight: var(--bolderFontWeight);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
h1 { font-size: 1.5em; }
|
|
|
|
|
h2 { font-size: 1.375em; }
|
|
|
|
|
h3 { font-size: 1.25em; }
|
|
|
|
|
h4 { font-size: 1.125em; }
|
|
|
|
|
h5, h6 { font-size: 1em; }
|
|
|
|
|
|
|
|
|
|
p { margin: 0 0 1em; }
|
|
|
|
|
p:last-child { margin-bottom: 0; }
|
|
|
|
|
|
|
|
|
|
b, strong { font-weight: var(--boldFontWeight); }
|
|
|
|
|
|
|
|
|
|
small { font-size: .9em; }
|
|
|
|
|
|
|
|
|
|
ul, ol {
|
|
|
|
|
margin: 1.5em 0;
|
|
|
|
|
padding: 0 0 0 2em;
|
|
|
|
|
list-style: disc outside;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
ul ul { list-style-type: circle; }
|
|
|
|
|
ol { list-style-type: decimal; }
|
|
|
|
|
ol ol { list-style-type: lower-alpha; }
|
|
|
|
|
ol ol ol { list-style-type: lower-roman; }
|
|
|
|
|
|
|
|
|
|
li + li { margin-top: .25em; }
|
|
|
|
|
li > ul, li > ol, dd > ul, dd > ol { margin: .5em 0; }
|
|
|
|
|
li > p { margin-bottom: .25em; }
|
|
|
|
|
|
|
|
|
|
dl { margin: 1.5em 0; }
|
|
|
|
|
dt { font-weight: var(--boldFontWeight); }
|
|
|
|
|
dd {
|
|
|
|
|
margin: .375em;
|
|
|
|
|
padding-left: 1em;
|
|
|
|
|
|
|
|
|
|
+ dt { margin-top: 1em; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
dfn, var { font-style: normal; }
|
|
|
|
|
|
|
|
|
|
abbr, acronym, dfn {
|
|
|
|
|
cursor: help;
|
|
|
|
|
border-bottom: 1px dotted var(--textColor);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
pre, code, samp, %pre, %code {
|
|
|
|
|
font-family: var(--monoFont);
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
font-style: normal;
|
|
|
|
|
font-size: .9em;
|
|
|
|
|
color: var(--textColor);
|
|
|
|
|
white-space: pre-wrap;
|
|
|
|
|
direction: ltr;
|
|
|
|
|
-moz-tab-size: 2;
|
|
|
|
|
-o-tab-size: 2;
|
|
|
|
|
tab-size: 2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
pre, %pre {
|
|
|
|
|
position: relative;
|
|
|
|
|
margin: 1.5em 0;
|
|
|
|
|
padding: .375rem .625rem;
|
|
|
|
|
line-height: 1.5;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
@extend %box;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
a > code { color: inherit; }
|
|
|
|
|
|
|
|
|
|
table {
|
|
|
|
|
margin: 1.5em 0;
|
|
|
|
|
background: none;
|
|
|
|
|
border: 1px solid var(--boxBorder);
|
|
|
|
|
border-collapse: separate;
|
|
|
|
|
border-spacing: 0;
|
|
|
|
|
border-radius: 3px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
caption {
|
|
|
|
|
font-weight: var(--boldFontWeight);
|
|
|
|
|
padding: 0 .7em .3em;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
th, td {
|
|
|
|
|
vertical-align: top;
|
|
|
|
|
padding: .3em .7em;
|
|
|
|
|
padding-bottom: -webkit-calc(.3em + 1px);
|
|
|
|
|
padding-bottom: calc(.3em + 1px);
|
|
|
|
|
text-align: left;
|
|
|
|
|
white-space: normal !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
th {
|
|
|
|
|
font-weight: var(--boldFontWeight);
|
|
|
|
|
border: 0;
|
|
|
|
|
border-bottom: 1px solid var(--boxBorder);
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
@extend %heading-box;
|
|
|
|
|
|
|
|
|
|
&:empty { background: none; }
|
|
|
|
|
|
|
|
|
|
+ th, + td { border-left: 1px solid var(--boxBorder); }
|
|
|
|
|
|
|
|
|
|
tr:first-child > &:first-child { border-top-left-radius: 3px; }
|
|
|
|
|
tr:first-child > &:last-child { border-top-right-radius: 3px; }
|
|
|
|
|
tr:last-child > &:first-child { border-bottom-left-radius: 3px; }
|
|
|
|
|
thead > tr:last-child > &:first-child { border-bottom-left-radius: 0; }
|
|
|
|
|
tr:last-child > & { border-bottom-width: 0; }
|
|
|
|
|
thead > tr:last-child > & { border-bottom-width: 1px; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
td {
|
|
|
|
|
background: var(--contentBackground);
|
|
|
|
|
border-bottom: 1px solid var(--boxBorderLight);
|
|
|
|
|
|
|
|
|
|
+ td { border-left: 1px solid var(--boxBorderLight); }
|
|
|
|
|
tr:last-child > & { border-bottom: 0; }
|
|
|
|
|
|
|
|
|
|
> pre:only-child, > p:only-child, > ul:only-child, > ol:only-child {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
margin-bottom: 0;
|
|
|
|
|
}
|
|
|
|
|
> pre:first-child, > p:first-child, > ul:first-child, > ol:first-child { margin-top: 0; }
|
|
|
|
|
> pre:last-child, > p:last-child, > ul:last-child, > ol:last-child { margin-bottom: 0; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
section, main {
|
|
|
|
|
display: block;
|
|
|
|
|
outline: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
label {
|
|
|
|
|
display: block;
|
|
|
|
|
@extend %user-select-none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
input, button {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin: 0;
|
|
|
|
|
font-family: inherit;
|
|
|
|
|
font-size: 100%;
|
|
|
|
|
color: var(--textColor);
|
|
|
|
|
line-height: normal;
|
|
|
|
|
@extend %border-box;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
input[type=checkbox] {
|
|
|
|
|
width: 1rem;
|
|
|
|
|
height: 1rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button {
|
|
|
|
|
padding: 0;
|
|
|
|
|
background: none;
|
|
|
|
|
border: 0;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button, input[type="search"] {
|
|
|
|
|
-webkit-appearance: none;
|
|
|
|
|
appearance: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button:focus {
|
|
|
|
|
outline: 1px dotted;
|
|
|
|
|
outline: -webkit-focus-ring-color auto 5px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
img, iframe {
|
|
|
|
|
background: var(--externalsBackground);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
input[type="search"]::-webkit-search-cancel-button,
|
|
|
|
|
input[type="search"]::-webkit-search-decoration {
|
|
|
|
|
-webkit-appearance: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::-ms-clear { display: none; }
|
|
|
|
|
|
|
|
|
|
::-moz-focus-inner {
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
border: 0 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::-webkit-input-placeholder { color: var(--textColorLighter); }
|
|
|
|
|
::-moz-placeholder { color: var(--textColorLighter); opacity: 1; }
|
|
|
|
|
:-ms-input-placeholder { color: var(--textColorLighter); }
|
|
|
|
|
|
|
|
|
|
body:not(._native-scrollbars) {
|
|
|
|
|
*::-webkit-scrollbar { -webkit-appearance: none; }
|
|
|
|
|
*::-webkit-scrollbar:vertical { width: 16px; }
|
|
|
|
|
*::-webkit-scrollbar:horizontal { height: 16px; }
|
|
|
|
|
|
|
|
|
|
*::-webkit-scrollbar-button,
|
|
|
|
|
*::-webkit-scrollbar-corner { display: none; }
|
|
|
|
|
|
|
|
|
|
*::-webkit-scrollbar-track {
|
|
|
|
|
background: var(--contentBackground);
|
|
|
|
|
border: 1px solid var(--contentBackground);
|
|
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
background: var(--sidebarBackground);
|
|
|
|
|
border-color: var(--sidebarBorder);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:vertical { border-width: 0 0 0 1px; }
|
|
|
|
|
|
|
|
|
|
&:vertical:corner-present {
|
|
|
|
|
border-width: 0 0 1px 1px;
|
|
|
|
|
border-radius: 0 0 0 2px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:horizontal {
|
|
|
|
|
border-width: 1px 1px 0 1px;
|
|
|
|
|
border-radius: 2px 2px 0 0;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
*::-webkit-scrollbar-thumb {
|
|
|
|
|
min-height: 2rem;
|
|
|
|
|
background: var(--scrollbarColor);
|
|
|
|
|
background-clip: padding-box;
|
|
|
|
|
border: 5px solid rgba(black, 0);
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
|
|
|
|
|
&:hover,
|
|
|
|
|
&:active {
|
|
|
|
|
background-color: var(--scrollbarColorHover);
|
|
|
|
|
border-width: 4px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
