| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296 |
- 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';
- }
- html._theme-default {
- color-scheme: light only;
- }
- html._theme-dark {
- color-scheme: dark only;
- }
- 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;
- display: inline-block;
- overflow-x: auto;
- max-width: 100%;
- }
- 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;
- }
- }
- }
|