mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 11:36:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Add padding prop to Grid component

Browse source
This commit is contained in:
Richard O'flynn 2020-11-27 01:20:36 +00:00
commit 9af756bd4b
9 changed files with 88 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/Grid/Column.svelte
View file

@ -32,6 +32,9 @@
*/
export let aspectRatio = undefined;
/** Set to `true` to add top and bottom padding this column */
export let padding = false;
/**
* Set the small breakpoint
* @type {ColumnBreakpoint}
@ -100,6 +103,7 @@
noGutterLeft && "bx--no-gutter--left",
noGutterRight && "bx--no-gutter--right",
aspectRatio && `bx--aspect-ratio bx--aspect-ratio--${aspectRatio}`,
padding && "bx--col-padding",
]
.filter(Boolean)
.join(" "),

4
src/Grid/Grid.svelte
View file

@ -28,6 +28,9 @@
/** Set to `true` to remove the right gutter */
export let noGutterRight = false;
/** Set to `true` to add top and bottom padding to all columns */
export let padding = false;
$: props = {
...$$restProps,
class: [
@ -39,6 +42,7 @@
noGutter && "bx--no-gutter",
noGutterLeft && "bx--no-gutter--left",
noGutterRight && "bx--no-gutter--right",
padding && "bx--row-padding",
]
.filter(Boolean)
.join(" "),

3
src/Grid/Row.svelte
View file

@ -25,6 +25,8 @@
/** Set to `true` to remove the right gutter */
export let noGutterRight = false;
/** Set to `true` to add top and bottom padding to all columns */
export let padding = false;
$: props = {
...$$restProps,
class: [
@ -35,6 +37,7 @@
noGutter && "bx--no-gutter",
noGutterLeft && "bx--no-gutter--left",
noGutterRight && "bx--no-gutter--right",
padding && "bx--row-padding",
]
.filter(Boolean)
.join(" "),