jprdonnelly/docs
1
0
Fork 0
mirror of synced 2025-12-19 18:10:59 -05:00
Code Issues Projects Releases Wiki Activity

breakpoint-xxl mixin (#39880)

Browse Source
This commit is contained in:
Kevin Heis
2023-07-31 07:08:08 -07:00
committed by GitHub
parent 7d9b0b2b11
commit ba45ae3382
7 changed files with 23 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/article/ArticleInlineLayout.module.scss
View File

@@ -1,4 +1,5 @@
@import "@primer/css/support/index.scss";
@import "stylesheets/breakpoint-xxl.scss";
.containerBox {
max-width: 720px;
@@ -37,7 +38,7 @@
.sidebarBox {
border-bottom: 1px solid var(--color-border-default) !important;
@media (min-width: 1400px) {
@include breakpoint-xxl {
border-bottom: none !important;
}
}

3
components/release-notes/PatchNotes.module.scss
View File

@@ -1,4 +1,5 @@
@import "@primer/css/support/index.scss";
@import "stylesheets/breakpoint-xxl.scss";
.aside {
@include breakpoint(md) {
@@ -7,7 +8,7 @@
top: 105px;
}
@media (min-width: 1400px) {
@include breakpoint-xxl {
height: calc(100vh - 65px);
top: 65px;
}

6
components/ui/MarkdownContent/stylesheets/table.scss
View File

@@ -1,3 +1,5 @@
@import "stylesheets/breakpoint-xxl.scss";
.markdownBody {
table {
display: table;
@@ -48,8 +50,8 @@
padding: 0.75rem 0.5rem;
border: 0;
@media (min-width: 1400px) {
scroll-padding-top: 65px !important; // 48 + 8 + 8 + 1
@include breakpoint-xxl {
top: 65px !important; // 48 + 8 + 8 + 1
}
}

4
stylesheets/annotate.scss
View File

@@ -1,3 +1,5 @@
@import "stylesheets/breakpoint-xxl.scss";
/* Code annotations
----------------------------------------------------------------------------*/
@@ -41,7 +43,7 @@
margin: 0 calc((100vw - 720px - 4rem) / 2 * -1);
}
@media (min-width: 1400px) {
@include breakpoint-xxl {
// 326px: navigation width
margin: 0 max(-12rem, calc((100vw - 720px - 326px - 4rem) / 2 * -1));
}

5
stylesheets/breakpoint-xxl.scss Normal file
View File

@@ -0,0 +1,5 @@
@mixin breakpoint-xxl {
@media (min-width: 1400px) {
@content;
}
}

4
stylesheets/scroll-top.scss
View File

@@ -1,10 +1,12 @@
@import "stylesheets/breakpoint-xxl.scss";
// https://tetralogical.com/blog/2023/06/08/focus-in-view/
html,
body {
scroll-padding-top: 105px !important; // 88 + 8 + 8 + 1
@media (min-width: 1400px) {
@include breakpoint-xxl {
scroll-padding-top: 65px !important; // 48 + 8 + 8 + 1
}
}

6
stylesheets/utilities.scss
View File

@@ -1,3 +1,5 @@
@import "stylesheets/breakpoint-xxl.scss";
.color-unset {
color: unset;
}
@@ -133,13 +135,13 @@
// used to help prevent overlapping main content and the minitoc sidebar
.d-xxl-block {
@media (min-width: 1400px) {
@include breakpoint-xxl {
display: block !important;
}
}
.d-xxl-none {
@media (min-width: 1400px) {
@include breakpoint-xxl {
display: none !important;
}
}