entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 9 Releases Wiki Activity

scss: introduce stretch-to-edge util class (#88600)
gitea/publik-base-theme/pipeline/head This commit looks good Details

This commit is contained in:
Thomas Jund 2024-03-25 17:12:39 +01:00
parent 556090a4a6
commit edbd13db32
2 changed files with 19 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
static/includes/_utils.scss
View File

@ -151,3 +151,22 @@ $black: #000000 !default;
.bare-list {
@include bare-list();
}
// Stretch background element to the edge
@mixin stretch-to-edge {
width: 100vw;
margin-left: calc(-50vw + 50%);
padding-right: calc(50vw - 50%);
padding-left: calc(50vw - 50%);
// for flex-grid context on .size--1-1 element
&.size--1-1 {
flex-basis: 100vw;
margin-left: calc(-50vw + 50% + (var(--grid-gutter, 0px) / 2));
padding-left: calc(50vw - 50% + (var(--grid-gutter, 0px) / 2));
margin-right: calc(-50vw + 50% - (var(--grid-gutter, 0px) / 2));
padding-right: calc(50vw - 50% + (var(--grid-gutter, 0px) / 2));
}
}
.stretch-to-edge {
@include stretch-to-edge();
}

20
static/nice-metropole/_custom.scss
View File

@ -1,23 +1,3 @@
//
// UTILS
//
// Stretch element background to the edge
@mixin stretch-to-edge {
width: 100vw;
margin-left: calc(-50vw + 50%);
padding-right: calc(50vw - 50%);
padding-left: calc(50vw - 50%);
// for flex-grid context on .size--1-1 element
&.size--1-1 {
flex-basis: 100vw;
margin-left: calc(-50vw + 50% + (var(--grid-gutter, 0px) / 2));
padding-left: calc(50vw - 50% + (var(--grid-gutter, 0px) / 2));
margin-right: calc(-50vw + 50% - (var(--grid-gutter, 0px) / 2));
padding-right: calc(50vw - 50% + (var(--grid-gutter, 0px) / 2));
}
}
//
// TYPO
//