mirror of
https://github.com/snachodog/just-the-docs.git
synced 2025-04-09 05:21:22 -06:00
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>
This commit is contained in:
Bob van de Vijver
GitHub
parent
3a7066ce70
commit
9aa1eeac3c
@ -19,12 +19,16 @@ Code changes to `main` that are *not* in the latest release:
|
||||
|
||||
- Added: `nav_enabled` site, layout, and page-level variable to selectively show or hide the side/mobile menu by [@kevinlin1] in [#1441]. The minimal layout was reimplemented using this feature, and now has support for the site-wide search bar and auxiliary links.
|
||||
- Fixed: protect `search-data.json` file from front matter default for layout by [@mattxwang] in [#1468]
|
||||
- Fixed: Sass mixed declarations by [@bobvandevijver] in [#1495]
|
||||
|
||||
Docs changes made since the latest release:
|
||||
|
||||
- Docs: Explained the `nav_enabled` variables as an alternative to using the minimal layout [@kevinlin1] in [#1441].
|
||||
|
||||
[@bobvandevijver]: https://github.com/bobvandevijver
|
||||
|
||||
[#1468]: https://github.com/just-the-docs/just-the-docs/pull/1468
|
||||
[#1495]: https://github.com/just-the-docs/just-the-docs/pull/1495
|
||||
|
||||
## Release v0.8.2
|
||||
|
||||
|
||||
@ -10,9 +10,9 @@
|
||||
}
|
||||
|
||||
html {
|
||||
@include fs-4;
|
||||
|
||||
scroll-behavior: smooth;
|
||||
|
||||
@include fs-4;
|
||||
}
|
||||
|
||||
body {
|
||||
|
||||
@ -142,10 +142,10 @@ div.highlighter-rouge {
|
||||
|
||||
// for AsciiDoc. we also need to fix the margins for its parent container.
|
||||
div.listingblock {
|
||||
@include scroll-and-spacing("div.content", "div.content > pre");
|
||||
|
||||
margin-top: 0;
|
||||
margin-bottom: $sp-3;
|
||||
|
||||
@include scroll-and-spacing("div.content", "div.content > pre");
|
||||
}
|
||||
|
||||
// {% highlight LANG %}...{% endhighlight %},
|
||||
@ -176,12 +176,12 @@ figure.highlight {
|
||||
|
||||
td,
|
||||
pre {
|
||||
@include fs-2;
|
||||
|
||||
min-width: 0;
|
||||
padding: 0;
|
||||
background-color: $code-background-color;
|
||||
border: 0;
|
||||
|
||||
@include fs-2;
|
||||
}
|
||||
|
||||
td.gl {
|
||||
|
||||
@ -14,9 +14,9 @@
|
||||
text-transform: uppercase;
|
||||
vertical-align: middle;
|
||||
background-color: $blue-100;
|
||||
@include fs-2;
|
||||
|
||||
border-radius: 12px;
|
||||
|
||||
@include fs-2;
|
||||
}
|
||||
|
||||
.label-green:not(g) {
|
||||
|
||||
@ -65,11 +65,11 @@
|
||||
}
|
||||
|
||||
.main-content-wrap {
|
||||
@include container;
|
||||
|
||||
padding-top: $gutter-spacing-sm;
|
||||
padding-bottom: $gutter-spacing-sm;
|
||||
|
||||
@include container;
|
||||
|
||||
@include mq(md) {
|
||||
padding-top: $gutter-spacing;
|
||||
padding-bottom: $gutter-spacing;
|
||||
@ -126,8 +126,6 @@
|
||||
}
|
||||
|
||||
.site-title {
|
||||
@include container;
|
||||
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
@ -135,6 +133,9 @@
|
||||
padding-top: $sp-3;
|
||||
padding-bottom: $sp-3;
|
||||
color: $body-heading-color;
|
||||
|
||||
@include container;
|
||||
|
||||
@include fs-6;
|
||||
|
||||
@include mq(md) {
|
||||
@ -200,14 +201,15 @@ body {
|
||||
// stylelint-enable selector-max-type
|
||||
|
||||
.site-footer {
|
||||
@include container;
|
||||
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding-top: $sp-4;
|
||||
padding-bottom: $sp-4;
|
||||
color: $grey-dk-000;
|
||||
|
||||
@include container;
|
||||
|
||||
@include fs-2;
|
||||
|
||||
@include mq(md) {
|
||||
|
||||
@ -8,11 +8,11 @@
|
||||
list-style: none;
|
||||
|
||||
.nav-list-item {
|
||||
@include fs-4;
|
||||
|
||||
position: relative;
|
||||
margin: 0;
|
||||
|
||||
@include fs-4;
|
||||
|
||||
@include mq(md) {
|
||||
@include fs-3;
|
||||
}
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
@mixin fs-1 {
|
||||
font-size: $font-size-1 !important;
|
||||
& {
|
||||
font-size: $font-size-1 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-1-sm !important;
|
||||
@ -7,7 +9,9 @@
|
||||
}
|
||||
|
||||
@mixin fs-2 {
|
||||
font-size: $font-size-2 !important;
|
||||
& {
|
||||
font-size: $font-size-2 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-3 !important;
|
||||
@ -15,7 +19,9 @@
|
||||
}
|
||||
|
||||
@mixin fs-3 {
|
||||
font-size: $font-size-3 !important;
|
||||
& {
|
||||
font-size: $font-size-3 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-4 !important;
|
||||
@ -23,7 +29,9 @@
|
||||
}
|
||||
|
||||
@mixin fs-4 {
|
||||
font-size: $font-size-4 !important;
|
||||
& {
|
||||
font-size: $font-size-4 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-5 !important;
|
||||
@ -31,7 +39,9 @@
|
||||
}
|
||||
|
||||
@mixin fs-5 {
|
||||
font-size: $font-size-5 !important;
|
||||
& {
|
||||
font-size: $font-size-5 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-6 !important;
|
||||
@ -39,7 +49,9 @@
|
||||
}
|
||||
|
||||
@mixin fs-6 {
|
||||
font-size: $font-size-6 !important;
|
||||
& {
|
||||
font-size: $font-size-6 !important;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-7 !important;
|
||||
@ -48,8 +60,10 @@
|
||||
}
|
||||
|
||||
@mixin fs-7 {
|
||||
font-size: $font-size-7 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
& {
|
||||
font-size: $font-size-7 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-8 !important;
|
||||
@ -57,8 +71,10 @@
|
||||
}
|
||||
|
||||
@mixin fs-8 {
|
||||
font-size: $font-size-8 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
& {
|
||||
font-size: $font-size-8 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-9 !important;
|
||||
@ -66,8 +82,10 @@
|
||||
}
|
||||
|
||||
@mixin fs-9 {
|
||||
font-size: $font-size-9 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
& {
|
||||
font-size: $font-size-9 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-10 !important;
|
||||
@ -75,8 +93,10 @@
|
||||
}
|
||||
|
||||
@mixin fs-10 {
|
||||
font-size: $font-size-10 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
& {
|
||||
font-size: $font-size-10 !important;
|
||||
line-height: $body-heading-line-height;
|
||||
}
|
||||
|
||||
@include mq(sm) {
|
||||
font-size: $font-size-10-sm !important;
|
||||
|
||||
@ -21,14 +21,14 @@ table {
|
||||
|
||||
th,
|
||||
td {
|
||||
@include fs-3;
|
||||
|
||||
min-width: 7.5rem;
|
||||
padding: $sp-2 $sp-3;
|
||||
background-color: $table-background-color;
|
||||
border-bottom: $border rgba($border-color, 0.5);
|
||||
border-left: $border $border-color;
|
||||
|
||||
@include fs-3;
|
||||
|
||||
&:first-of-type {
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
@ -3,9 +3,9 @@
|
||||
|
||||
h1,
|
||||
.text-alpha {
|
||||
@include fs-8;
|
||||
|
||||
font-weight: 300;
|
||||
|
||||
@include fs-8;
|
||||
}
|
||||
|
||||
h2,
|
||||
@ -21,11 +21,11 @@ h3,
|
||||
|
||||
h4,
|
||||
.text-delta {
|
||||
@include fs-2;
|
||||
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.1em;
|
||||
|
||||
@include fs-2;
|
||||
}
|
||||
|
||||
h4 code {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user