Bob van de Vijver
|
9aa1eeac3c
|
Fix Sass mixed declarations (#1495)
As requested (https://github.com/just-the-docs/just-the-docs/issues/1493#issuecomment-2227203330), a PR to resolve the Sass deprecations. Seems to solve all deprecations I am seeing, and I am not seeing any weird changes in the resulting CSS file.
Closes #1493.
<details>
<summary>Git diff of generated CSS file</summary>
```patch
diff --git a/just-the-docs-default.css b/just-the-docs-default.css.new
index fe42b2d..50a103b 100644
--- a/just-the-docs-default.css
+++ b/just-the-docs-default.css.new
@@ -591,9 +591,11 @@ template {
}
html {
- font-size: 0.875rem !important;
scroll-behavior: smooth;
}
+html {
+ font-size: 0.875rem !important;
+}
@media (min-width: 31.25rem) {
html {
font-size: 1rem !important;
@@ -715,25 +717,50 @@ blockquote {
min-width: 16.5rem;
}
}
-
@media (min-width: 50rem) {
- .main {
- position: relative;
- max-width: 50rem;
+ .side-bar + .main {
margin-left: 15.5rem;
}
}
@media (min-width: 66.5rem) {
- .main {
+ .side-bar + .main {
margin-left: max(16.5rem, (100% - 66.5rem) / 2 + 16.5rem);
}
}
+.side-bar + .main .main-header {
+ display: none;
+ background-color: #f5f6fa;
+}
+@media (min-width: 50rem) {
+ .side-bar + .main .main-header {
+ display: flex;
+ background-color: #fff;
+ }
+}
+.side-bar + .main .main-header.nav-open {
+ display: block;
+}
+@media (min-width: 50rem) {
+ .side-bar + .main .main-header.nav-open {
+ display: flex;
+ }
+}
+
+.main {
+ margin: auto;
+}
+@media (min-width: 50rem) {
+ .main {
+ position: relative;
+ max-width: 50rem;
+ }
+}
.main-content-wrap {
- padding-right: 1rem;
- padding-left: 1rem;
padding-top: 1rem;
padding-bottom: 1rem;
+ padding-right: 1rem;
+ padding-left: 1rem;
}
@media (min-width: 50rem) {
.main-content-wrap {
@@ -750,24 +777,13 @@ blockquote {
.main-header {
z-index: 0;
- display: none;
- background-color: #f5f6fa;
+ border-bottom: 1px solid #eeebee;
}
@media (min-width: 50rem) {
.main-header {
display: flex;
justify-content: space-between;
height: 3.75rem;
- background-color: #fff;
- border-bottom: 1px solid #eeebee;
- }
-}
-.main-header.nav-open {
- display: block;
-}
-@media (min-width: 50rem) {
- .main-header.nav-open {
- display: flex;
}
}
@@ -814,8 +830,6 @@ blockquote {
}
.site-title {
- padding-right: 1rem;
- padding-left: 1rem;
flex-grow: 1;
display: flex;
height: 100%;
@@ -823,7 +837,8 @@ blockquote {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
color: #27262b;
- font-size: 1.125rem !important;
+ padding-right: 1rem;
+ padding-left: 1rem;
}
@media (min-width: 50rem) {
.site-title {
@@ -831,6 +846,9 @@ blockquote {
padding-left: 2rem;
}
}
+.site-title {
+ font-size: 1.125rem !important;
+}
@media (min-width: 31.25rem) {
.site-title {
font-size: 1.5rem !important;
@@ -877,15 +895,14 @@ body {
}
.site-footer {
- padding-right: 1rem;
- padding-left: 1rem;
position: absolute;
bottom: 0;
left: 0;
padding-top: 1rem;
padding-bottom: 1rem;
color: #959396;
- font-size: 0.6875rem !important;
+ padding-right: 1rem;
+ padding-left: 1rem;
}
@media (min-width: 50rem) {
.site-footer {
@@ -893,6 +910,9 @@ body {
padding-left: 2rem;
}
}
+.site-footer {
+ font-size: 0.6875rem !important;
+}
@media (min-width: 31.25rem) {
.site-footer {
font-size: 0.75rem !important;
@@ -948,6 +968,8 @@ body {
color: #959396;
content: counter(step-counter);
counter-increment: step-counter;
+}
+.main-content ol > li::before {
font-size: 0.75rem !important;
}
@media (min-width: 31.25rem) {
@@ -1150,10 +1172,12 @@ body {
list-style: none;
}
.nav-list .nav-list-item {
- font-size: 0.875rem !important;
position: relative;
margin: 0;
}
+.nav-list .nav-list-item {
+ font-size: 0.875rem !important;
+}
@media (min-width: 31.25rem) {
.nav-list .nav-list-item {
font-size: 1rem !important;
@@ -1246,6 +1270,8 @@ body {
text-align: start;
text-transform: uppercase;
border-bottom: 1px solid #eeebee;
+}
+.nav-category {
font-size: 0.6875rem !important;
}
@media (min-width: 31.25rem) {
@@ -1280,6 +1306,8 @@ body {
.aux-nav {
height: 100%;
overflow-x: auto;
+}
+.aux-nav {
font-size: 0.6875rem !important;
}
@media (min-width: 31.25rem) {
@@ -1320,6 +1348,8 @@ body {
.breadcrumb-nav-list-item {
display: table-cell;
+}
+.breadcrumb-nav-list-item {
font-size: 0.6875rem !important;
}
@media (min-width: 31.25rem) {
@@ -1341,11 +1371,14 @@ body {
content: "";
}
+h1,
+.text-alpha {
+ font-weight: 300;
+}
h1,
.text-alpha {
font-size: 2rem !important;
line-height: 1.25;
- font-weight: 300;
}
@media (min-width: 31.25rem) {
h1,
@@ -1381,11 +1414,14 @@ h3,
h4,
.text-delta {
- font-size: 0.6875rem !important;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.1em;
}
+h4,
+.text-delta {
+ font-size: 0.6875rem !important;
+}
@media (min-width: 31.25rem) {
h4,
.text-delta {
@@ -1454,9 +1490,12 @@ h6,
text-transform: uppercase;
vertical-align: middle;
background-color: #2869e6;
- font-size: 0.6875rem !important;
border-radius: 12px;
}
+.label:not(g),
+.label-blue:not(g) {
+ font-size: 0.6875rem !important;
+}
@media (min-width: 31.25rem) {
.label:not(g),
.label-blue:not(g) {
@@ -1752,6 +1791,8 @@ h6,
padding-left: 0;
margin-bottom: 0.25rem;
list-style: none;
+}
+.search-results-list {
font-size: 0.875rem !important;
}
@media (min-width: 31.25rem) {
@@ -1804,6 +1845,8 @@ h6,
}
.search-result-doc.search-result-doc-parent {
opacity: 0.5;
+}
+.search-result-doc.search-result-doc-parent {
font-size: 0.75rem !important;
}
@media (min-width: 31.25rem) {
@@ -1844,6 +1887,8 @@ h6,
color: #959396;
text-overflow: ellipsis;
white-space: nowrap;
+}
+.search-result-rel-url {
font-size: 0.5625rem !important;
}
@media (min-width: 31.25rem) {
@@ -1862,6 +1907,8 @@ h6,
word-wrap: break-word;
border-left: 1px solid;
border-left-color: #eeebee;
+}
+.search-result-previews {
font-size: 0.6875rem !important;
}
@media (min-width: 31.25rem) {
@@ -1889,6 +1936,8 @@ h6,
.search-no-result {
padding: 0.5rem 0.75rem;
+}
+.search-no-result {
font-size: 0.75rem !important;
}
@media (min-width: 31.25rem) {
@@ -1998,13 +2047,16 @@ table {
th,
td {
- font-size: 0.75rem !important;
min-width: 7.5rem;
padding: 0.5rem 0.75rem;
background-color: #fff;
border-bottom: 1px solid rgba(238, 235, 238, 0.5);
border-left: 1px solid #eeebee;
}
+th,
+td {
+ font-size: 0.75rem !important;
+}
@media (min-width: 31.25rem) {
th,
td {
@@ -2135,12 +2187,15 @@ figure.highlight :not(pre) > code {
}
.highlight .table-wrapper td,
.highlight .table-wrapper pre {
- font-size: 0.6875rem !important;
min-width: 0;
padding: 0;
background-color: #f5f6fa;
border: 0;
}
+.highlight .table-wrapper td,
+.highlight .table-wrapper pre {
+ font-size: 0.6875rem !important;
+}
@media (min-width: 31.25rem) {
.highlight .table-wrapper td,
.highlight .table-wrapper pre {
```
</details>
|
2024-08-12 11:34:20 -07:00 |
|
