Vmeda.Online/src/theme/helpers/ionic.components.mixins.scss

38 lines
1.1 KiB
SCSS

/**
* Imported ionic mixins for SCSS from different components
* ----------------------------------------------------------------------------
* Extracted from
* https://github.com/ionic-team/ionic-framework/blob/main/core/src/components/grid/grid.mixins.scss
*/
// Responsive Mixins
// --------------------------------------------------
// Creates a fixed width for the grid based on the screen size
// ---------------------------------------------------------------------------------
@mixin make-grid-widths($widths: $grid-widths, $breakpoints: $screen-breakpoints) {
@each $breakpoint, $width in $widths {
@include media-breakpoint-up($breakpoint, $breakpoints) {
width: $width;
}
}
max-width: 100%;
}
// Adds padding to the element based on breakpoints
// ---------------------------------------------------------------------------------
@mixin make-breakpoint-padding($paddings) {
@each $breakpoint in map-keys($paddings) {
@include media-breakpoint-up($breakpoint) {
$padding: map-get($paddings, $breakpoint);
@include padding($padding);
}
}
}