bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added optional orientation attribute to mediaquery mixins, fixed modalecard in landscape mode

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2021-06-01 13:37:39 +02:00
parent 72890c7ab0
commit 425eb7f58f
5 changed files with 100 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
web/themes/custom/materiotheme/assets/styles/base/_layout.scss
View File

@ -49,26 +49,45 @@ body.toolbar-horizontal.toolbar-themes.toolbar-no-tabs{
// }
// }
@mixin col-mediaquery-min-max($min, $max) {
@mixin col-mediaquery-min-max($min, $max, $orientation: false) {
$bp: ($column_width + $column_goutiere) * $min + 1px;
$upbp: ($column_width + $column_goutiere) * ($max);
@media (min-width: $bp) and (max-width: $upbp) {
@content;
@if $orientation {
@media (orientation: $orientation) and (min-width: $bp) and (max-width: $upbp) {
@content;
}
} @else {
@media (min-width: $bp) and (max-width: $upbp) {
@content;
}
}
}
@mixin col-mediaquery-min($i) {
@mixin col-mediaquery-min($i, $orientation: false) {
$bp: ($column_width + $column_goutiere) * $i + 1px;
@media (min-width: $bp) {
@content;
@if $orientation {
@media (orientation: $orientation) and (min-width: $bp) {
@content;
}
} @else {
@media (min-width: $bp) {
@content;
}
}
}
@mixin col-mediaquery-max($i) {
@mixin col-mediaquery-max($i, $orientation: false) {
$bp: ($column_width + $column_goutiere) * $i;
@media (max-width: $bp) {
@content;
@if $orientation {
@media (orientation: $orientation) and (max-width: $bp) {
@content;
}
} @else {
@media (max-width: $bp) {
@content;
}
}
}
// build break points for each multiple of cards row
// cards will always be centered, using all available space
%grided-width{