|
|
@@ -1,4 +1,7 @@
|
|
|
:root {
|
|
|
+ --white-5: #ffffff0d;
|
|
|
+ --white-20: #fff3;
|
|
|
+
|
|
|
--base-color: rgb(255, 255, 255);
|
|
|
|
|
|
--mono-hue: var(--theme-hue);
|
|
|
@@ -7,8 +10,8 @@
|
|
|
--mono-shade4: hsl(var(--mono-hue), var(--mono-saturation), 10%);
|
|
|
|
|
|
--theme-hue : 208;
|
|
|
- --theme-saturation: 80.3%;
|
|
|
- --theme-lightness : 45.9%;
|
|
|
+ --theme-saturation: 100%;
|
|
|
+ --theme-lightness : 63%;
|
|
|
|
|
|
--base-background-color: rgb(13, 15, 21);
|
|
|
--base-background-color-trans: rgba(13, 15, 21, 0);
|
|
|
@@ -16,7 +19,9 @@
|
|
|
|
|
|
--code-font-family: 'Martian Mono',monospace;
|
|
|
--code-font-weight: 300;
|
|
|
- --code-inline-background: var(--mono-tint1);
|
|
|
+ --code-block-border-radius: 0;
|
|
|
+ --code-theme-background: var(--white-5);
|
|
|
+ --code-inline-background: var(--white-20);
|
|
|
|
|
|
--heading-font-family: 'Roboto Condensed',sans-serif;
|
|
|
--heading-h1-font-weight: 700;
|
|
|
@@ -27,33 +32,41 @@
|
|
|
|
|
|
--link-color: var(--theme-color);
|
|
|
|
|
|
- --sidebar-background: var(--mono-shade4);
|
|
|
- --sidebar-border-color: hsla(0,0%,100%,.4);
|
|
|
+ --sidebar-background: var(--white-5);
|
|
|
+ --sidebar-border-color: var(--white-20);
|
|
|
+ --sidebar-border-width: 0 2px 0 0;
|
|
|
+ --sidebar-width: 20rem;
|
|
|
+ --sidebar-nav-link-before-content-l3: "";
|
|
|
|
|
|
- --copycode-background: var(--link-color);
|
|
|
+ --copycode-background: linear-gradient(0deg, #1d40b2, #1680d6);
|
|
|
|
|
|
--table-row-even-background: var(--base-background-color);
|
|
|
|
|
|
--selection-color: rgba(255, 255, 255, 0.3);
|
|
|
|
|
|
- --sidebar-width: 20rem;
|
|
|
- --sidebar-nav-link-before-content-l3: "";
|
|
|
+ --search-input-background-color: var(--white-5);
|
|
|
+ --search-input-border-color: var(--white-20);
|
|
|
+ --search-input-border-width: 2px 0;
|
|
|
}
|
|
|
|
|
|
.app-name-link img {
|
|
|
width: 90%
|
|
|
}
|
|
|
|
|
|
-body::before {
|
|
|
+.content::before {
|
|
|
content: "";
|
|
|
- position: fixed;
|
|
|
- width: 100%;
|
|
|
- height: 500px;
|
|
|
- background: linear-gradient(
|
|
|
- 180deg,
|
|
|
- var(--base-background-color-trans),
|
|
|
- var(--base-background-color) 500px
|
|
|
- ), url('/assets/pattern.svg');
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 390px;
|
|
|
+ height: 300px;
|
|
|
+ background: url('/assets/pattern.svg');
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .content::before {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
@media (min-width: 1200px) {
|
|
|
@@ -74,6 +87,32 @@ body::before {
|
|
|
overflow-wrap: break-word;
|
|
|
}
|
|
|
|
|
|
+.markdown-section pre[data-lang] {
|
|
|
+ border: 2px solid var(--white-20);
|
|
|
+}
|
|
|
+.markdown-section pre[data-lang]:hover {
|
|
|
+ border: 2px solid var(--theme-color);
|
|
|
+}
|
|
|
+
|
|
|
+body .docsify-copy-code-button {
|
|
|
+ transition: none;
|
|
|
+}
|
|
|
+body .docsify-copy-code-button,
|
|
|
+body .docsify-copy-code-button::after {
|
|
|
+ border-radius: 0;
|
|
|
+}
|
|
|
+body .docsify-copy-code-button span {
|
|
|
+ background: none;
|
|
|
+}
|
|
|
+body .docsify-copy-code-button .success {
|
|
|
+ color: #77b33a;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+body .docsify-copy-code-button .error {
|
|
|
+ color: #e65855;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
.loading {
|
|
|
margin: 150px auto 0;
|
|
|
position: relative;
|
|
|
@@ -122,7 +161,7 @@ body::before {
|
|
|
}
|
|
|
|
|
|
.badge img:hover {
|
|
|
- filter: brightness(1.5);
|
|
|
+ filter: brightness(1.2);
|
|
|
}
|
|
|
|
|
|
h1 .badge img, h3 .badge img, h3 .badge img, h4 .badge img, h5 .badge img {
|
|
|
@@ -131,17 +170,40 @@ h1 .badge img, h3 .badge img, h3 .badge img, h4 .badge img, h5 .badge img {
|
|
|
margin-left: .1em;
|
|
|
}
|
|
|
|
|
|
+i.icon::after {
|
|
|
+ content: "";
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ top: .125em;
|
|
|
+ width: 1em;
|
|
|
+ height: 1em;
|
|
|
+ background-position: center;
|
|
|
+ background-size: contain;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+}
|
|
|
+i.icon-note::after {
|
|
|
+ background-image: url(/assets/note.svg);
|
|
|
+}
|
|
|
+i.icon-warn::after {
|
|
|
+ background-image: url(/assets/warning.svg);
|
|
|
+}
|
|
|
+i.icon-check::after {
|
|
|
+ background-image: url(/assets/check.svg);
|
|
|
+}
|
|
|
+i.icon-cross::after {
|
|
|
+ background-image: url(/assets/cross.svg);
|
|
|
+}
|
|
|
+
|
|
|
.github-edit-btn {
|
|
|
display: block;
|
|
|
position: fixed;
|
|
|
bottom: 0;
|
|
|
- right: 10px;
|
|
|
- border-radius: 10px 10px 0 0;
|
|
|
- background-color: var(--link-color);
|
|
|
+ right: 1em;
|
|
|
+ background: var(--copycode-background);
|
|
|
color: var(--base-color) !important;
|
|
|
text-decoration: none !important;
|
|
|
font-size: .8em;
|
|
|
- padding: 0.2em 1em;
|
|
|
+ padding: 0.3em 1em;
|
|
|
opacity: 0.75;
|
|
|
z-index: 999;
|
|
|
}
|
|
|
@@ -156,10 +218,6 @@ h1 .badge img, h3 .badge img, h3 .badge img, h4 .badge img, h5 .badge img {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-.github-corner {
|
|
|
- position: fixed;
|
|
|
-}
|
|
|
-
|
|
|
.links-menu {
|
|
|
width: 100%;
|
|
|
text-align: center;
|
|
|
@@ -174,6 +232,37 @@ h1 .badge img, h3 .badge img, h3 .badge img, h4 .badge img, h5 .badge img {
|
|
|
}
|
|
|
|
|
|
.sidebar-version-select {
|
|
|
- width: 100%;
|
|
|
+ position: relative;
|
|
|
margin: var(--sidebar-nav-margin);
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar-version-select > select {
|
|
|
+ appearance: none;
|
|
|
+ cursor: pointer;
|
|
|
+ margin: 0;
|
|
|
+ width: 100%;
|
|
|
+ background: var(--white-5);
|
|
|
+ border: 2px solid var(--white-20);
|
|
|
+ border-radius: 0;
|
|
|
+ padding: 0.35em 0.7em;
|
|
|
+ color: var(--base-color);
|
|
|
+ font-family: var(--base-font-family);
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar-version-select>select:hover {
|
|
|
+ border: 2px solid var(--theme-color);
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar-version-select::after {
|
|
|
+ content: "▼";
|
|
|
+ color: var(--base-color);
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ right: 1em;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 16px;
|
|
|
+ height: 16px;
|
|
|
+ transform: translateY(-8px);
|
|
|
+ pointer-events: none;
|
|
|
}
|
DarthSim
