scroll-behavior: smooth;
}
-.docs {
- max-width: 1700px;
- margin: 0 auto;
-}
-
.docs-aside__content {
flex: 1;
}
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 {
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;
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);
}
@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);
}
}
}
-
.docs-aside {
grid-column: 2 / 3;
display: flex;
}
}
+div.img-container {
+ background-color: var(--img-background-color);
+ border-radius: var(--border-radius);
+
+ img {
+ margin: 0 auto;
+ }
+}
+
pre[class*="language-"] {
position: relative;
}
.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;
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;
+ }
+}