]> git.proxmox.com Git - pve-eslint.git/blobdiff - eslint/docs/src/assets/scss/docs.scss
import 8.41.0 source
[pve-eslint.git] / eslint / docs / src / assets / scss / docs.scss
index 22cde70720dfe7f85aafd5597c6ae9cc95771b9f..ee40123891d88a3f71256513f8d48f25251ee06e 100644 (file)
@@ -4,11 +4,6 @@ html {
     scroll-behavior: smooth;
 }
 
-.docs {
-    max-width: 1700px;
-    margin: 0 auto;
-}
-
 .docs-aside__content {
     flex: 1;
 }
@@ -18,12 +13,16 @@ html {
     flex: 1;
     display: flex;
     flex-direction: column;
+    max-width: 1700px;
 
     @media all and (min-width: 1024px) {
         display: grid;
         grid-template-columns: minmax(250px, 1fr) minmax(0, 3.5fr);
         align-items: stretch;
     }
+    @media all and (min-width: 1700px) {
+        margin: auto;
+    }
 }
 
 .docs-nav {
@@ -31,8 +30,7 @@ html {
     grid-row: 1 / 2;
     padding-top: var(--space-l-xl);
     padding-block-start: var(--space-l-xl);
-    font-size: .875rem;
-
+    font-size: 0.875rem;
     display: grid;
     grid-auto-rows: max-content;
     align-items: start;
@@ -41,7 +39,6 @@ html {
         padding: var(--space-l-xl) 0;
         padding-right: var(--space-s-l);
         padding-inline-end: var(--space-s-l);
-
         border-right: 1px solid var(--divider-color);
         border-inline-end: 1px solid var(--divider-color);
     }
@@ -73,7 +70,6 @@ html {
     @media all and (min-width: 800px) {
         padding-right: var(--space-s-l);
         padding-inline-end: var(--space-s-l);
-
         border-right: 1px solid var(--divider-color);
         border-inline-end: 1px solid var(--divider-color);
     }
@@ -83,7 +79,6 @@ html {
     }
 }
 
-
 .docs-aside {
     grid-column: 2 / 3;
     display: flex;
@@ -131,6 +126,15 @@ div.incorrect {
     }
 }
 
+div.img-container {
+    background-color: var(--img-background-color);
+    border-radius: var(--border-radius);
+
+    img {
+        margin: 0 auto;
+    }
+}
+
 pre[class*="language-"] {
     position: relative;
 }
@@ -138,10 +142,10 @@ pre[class*="language-"] {
 .c-btn.c-btn--playground {
     position: absolute;
     font-size: var(--step--1);
-    bottom: .5rem;
-    right: .5rem;
-    offset-block-end: .5rem;
-    offset-inline-end: .5rem;
+    bottom: 0.5rem;
+    right: 0.5rem;
+    offset-block-end: 0.5rem;
+    offset-inline-end: 0.5rem;
 
     @media all and (max-width: 768px) {
         display: none;
@@ -153,3 +157,27 @@ pre[class*="language-"] {
         opacity: 1;
     }
 }
+
+#scroll-up-btn {
+    width: 50px;
+    height: 50px;
+    display: none;
+    position: fixed;
+    right: 50px;
+    bottom: 35px;
+    font-size: 1.5rem;
+    border-radius: 50%;
+    color: var(--body-background-color);
+    text-decoration: none;
+    justify-content: center;
+    align-items: center;
+    background-color: var(--link-color);
+
+    @media (max-width: 800px) {
+        right: 35px;
+    }
+
+    @media (max-width: 600px) {
+        right: 25px;
+    }
+}