mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
50 lines
1.5 KiB
SCSS
50 lines
1.5 KiB
SCSS
@import "./grid.vars";
|
|
|
|
// Grid
|
|
// --------------------------------------------------
|
|
|
|
:host {
|
|
/**
|
|
* @prop --ion-grid-padding: Padding for the Grid
|
|
* @prop --ion-grid-padding-xs: Padding for the Grid on xs screens
|
|
* @prop --ion-grid-padding-sm: Padding for the Grid on sm screens
|
|
* @prop --ion-grid-padding-md: Padding for the Grid on md screens
|
|
* @prop --ion-grid-padding-lg: Padding for the Grid on lg screens
|
|
* @prop --ion-grid-padding-xl: Padding for the Grid on xl screens
|
|
*
|
|
* @prop --ion-grid-width: Width of the fixed Grid
|
|
* @prop --ion-grid-width-xs: Width of the fixed Grid on xs screens
|
|
* @prop --ion-grid-width-sm: Width of the fixed Grid on sm screens
|
|
* @prop --ion-grid-width-md: Width of the fixed Grid on md screens
|
|
* @prop --ion-grid-width-lg: Width of the fixed Grid on lg screens
|
|
* @prop --ion-grid-width-xl: Width of the fixed Grid on xl screens
|
|
*/
|
|
|
|
@include make-breakpoint-padding($grid-paddings);
|
|
@include margin-horizontal(auto);
|
|
|
|
display: block;
|
|
|
|
flex: 1;
|
|
}
|
|
|
|
// Fixed Grid
|
|
// --------------------------------------------------
|
|
|
|
:host(.grid-fixed) {
|
|
@include make-grid-widths();
|
|
}
|
|
|
|
// Grid Padding
|
|
// --------------------------------------------------
|
|
|
|
// Remove the padding from grid and all immediate children columns
|
|
:host(.ion-no-padding) {
|
|
--ion-grid-column-padding: 0;
|
|
--ion-grid-column-padding-xs: 0;
|
|
--ion-grid-column-padding-sm: 0;
|
|
--ion-grid-column-padding-md: 0;
|
|
--ion-grid-column-padding-lg: 0;
|
|
--ion-grid-column-padding-xl: 0;
|
|
}
|