javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(css): remove CSS util attributes (#18956)

Browse Source 
BREAKING CHANGES

Removes all CSS utility attributes. Please use CSS classes instead. See the documentation for the correct class names: https://ionicframework.com/docs/layout/css-utilities
This commit is contained in:
Brandy Carney
2019-09-27 17:54:03 -04:00
parent 5f235307cd
commit e67f7e81f7
8 changed files with 52 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
core/src/css/padding.scss
View File

@ -14,8 +14,7 @@ $margin: var(--ion-margin, 16px);
// Padding
// --------------------------------------------------
.ion-no-padding,
[no-padding] {
.ion-no-padding {
--padding-start: 0;
--padding-end: 0;
--padding-top: 0;
@ -24,8 +23,7 @@ $margin: var(--ion-margin, 16px);
@include padding(0);
}
.ion-padding,
[padding] {
.ion-padding {
--padding-start: #{$padding};
--padding-end: #{$padding};
--padding-top: #{$padding};
@ -34,44 +32,38 @@ $margin: var(--ion-margin, 16px);
@include padding($padding);
}
.ion-padding-top,
[padding-top] {
.ion-padding-top {
--padding-top: #{$padding};
@include padding($padding, null, null, null);
}
.ion-padding-start,
[padding-start] {
.ion-padding-start {
--padding-start: #{$padding};
@include padding-horizontal($padding, null);
}
.ion-padding-end,
[padding-end] {
.ion-padding-end {
--padding-end: #{$padding};
@include padding-horizontal(null, $padding);
}
.ion-padding-bottom,
[padding-bottom] {
.ion-padding-bottom {
--padding-bottom: #{$padding};
@include padding(null, null, $padding, null);
}
.ion-padding-vertical,
[padding-vertical] {
.ion-padding-vertical {
--padding-top: #{$padding};
--padding-bottom: #{$padding};
@include padding($padding, null, $padding, null);
}
.ion-padding-horizontal,
[padding-horizontal] {
.ion-padding-horizontal {
--padding-start: #{$padding};
--padding-end: #{$padding};
@ -82,8 +74,7 @@ $margin: var(--ion-margin, 16px);
// Margin
// --------------------------------------------------
.ion-no-margin,
[no-margin] {
.ion-no-margin {
--margin-start: 0;
--margin-end: 0;
--margin-top: 0;
@ -92,8 +83,7 @@ $margin: var(--ion-margin, 16px);
@include margin(0);
}
.ion-margin,
[margin] {
.ion-margin {
--margin-start: #{$margin};
--margin-end: #{$margin};
--margin-top: #{$margin};
@ -102,44 +92,38 @@ $margin: var(--ion-margin, 16px);
@include margin($margin);
}
.ion-margin-top,
[margin-top] {
.ion-margin-top {
--margin-top: #{$margin};
@include margin($margin, null, null, null);
}
.ion-margin-start,
[margin-start] {
.ion-margin-start {
--margin-start: #{$margin};
@include margin-horizontal($margin, null);
}
.ion-margin-end,
[margin-end] {
.ion-margin-end {
--margin-end: #{$margin};
@include margin-horizontal(null, $margin);
}
.ion-margin-bottom,
[margin-bottom] {
.ion-margin-bottom {
--margin-bottom: #{$margin};
@include margin(null, null, $margin, null);
}
.ion-margin-vertical,
[margin-vertical] {
.ion-margin-vertical {
--margin-top: #{$margin};
--margin-bottom: #{$margin};
@include margin($margin, null, $margin, null);
}
.ion-margin-horizontal,
[margin-horizontal] {
.ion-margin-horizontal {
--margin-start: #{$margin};
--margin-end: #{$margin};