mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-09 16:16:41 +08:00
docs(grid): document the custom properties for all grid vars
references #14850
This commit is contained in:
@ -4,6 +4,15 @@
|
||||
// --------------------------------------------------
|
||||
|
||||
:host {
|
||||
/**
|
||||
* @prop --ion-grid-columns: The number of total Columns in the Grid
|
||||
* @prop --ion-grid-column-padding: Padding for the Column
|
||||
* @prop --ion-grid-column-padding-xs: Padding for the Column on xs screens and up
|
||||
* @prop --ion-grid-column-padding-sm: Padding for the Column on sm screens and up
|
||||
* @prop --ion-grid-column-padding-md: Padding for the Column on md screens and up
|
||||
* @prop --ion-grid-column-padding-lg: Padding for the Column on lg screens and up
|
||||
* @prop --ion-grid-column-padding-xl: Padding for the Column on xl screens and up
|
||||
*/
|
||||
@include make-breakpoint-padding($grid-column-paddings);
|
||||
@include margin(0);
|
||||
|
||||
|
||||
@ -54,6 +54,18 @@ There are several attributes that can be added to a column to customize this beh
|
||||
| `size` | `size` | The size of the column, in terms of how many columns it should take up out of the total available. If `"auto"` is passed, the column will be the size of its content. | `string` |
|
||||
|
||||
|
||||
## CSS Custom Properties
|
||||
|
||||
| Name | Description |
|
||||
| ------------------------------ | ------------------------------------------- |
|
||||
| `--ion-grid-column-padding` | Padding for the Column |
|
||||
| `--ion-grid-column-padding-lg` | Padding for the Column on lg screens and up |
|
||||
| `--ion-grid-column-padding-md` | Padding for the Column on md screens and up |
|
||||
| `--ion-grid-column-padding-sm` | Padding for the Column on sm screens and up |
|
||||
| `--ion-grid-column-padding-xl` | Padding for the Column on xl screens and up |
|
||||
| `--ion-grid-column-padding-xs` | Padding for the Column on xs screens and up |
|
||||
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
||||
Reference in New Issue
Block a user