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

fix(content): padding works in any element

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2017-11-02 10:35:23 +01:00
parent 1bfc0c71e3
commit b24c2b00b6
1 changed files with 9 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/core/src/components/content/content.scss
View File

@ -12,6 +12,8 @@ ion-content {
width: 100%; width: 100%;
contain: layout size style; contain: layout size style;
padding: 0 !important; // scss-lint:disable all
} }
a { a {
@ -62,30 +64,37 @@ ion-app [no-padding] ion-scroll {
} }
@mixin content-padding($mode, $content-padding) { @mixin content-padding($mode, $content-padding) {
.app-#{$mode} [padding],
.app-#{$mode} [padding] .scroll-inner { .app-#{$mode} [padding] .scroll-inner {
@include padding($content-padding); @include padding($content-padding);
} }
.app-#{$mode} [padding-top],
.app-#{$mode} [padding-top] .scroll-inner { .app-#{$mode} [padding-top] .scroll-inner {
@include padding($content-padding, null, null, null); @include padding($content-padding, null, null, null);
} }
.app-#{$mode} [padding-left],
.app-#{$mode} [padding-left] .scroll-inner { .app-#{$mode} [padding-left] .scroll-inner {
@include padding-horizontal($content-padding, null); @include padding-horizontal($content-padding, null);
} }
.app-#{$mode} [padding-right],
.app-#{$mode} [padding-right] .scroll-inner { .app-#{$mode} [padding-right] .scroll-inner {
@include padding-horizontal(null, $content-padding); @include padding-horizontal(null, $content-padding);
} }
.app-#{$mode} [padding-bottom],
.app-#{$mode} [padding-bottom] .scroll-inner { .app-#{$mode} [padding-bottom] .scroll-inner {
@include padding(null, null, $content-padding, null); @include padding(null, null, $content-padding, null);
} }
.app-#{$mode} [padding-vertical],
.app-#{$mode} [padding-vertical] .scroll-inner { .app-#{$mode} [padding-vertical] .scroll-inner {
@include padding($content-padding, null, $content-padding, null); @include padding($content-padding, null, $content-padding, null);
} }
.app-#{$mode} [padding-horizontal],
.app-#{$mode} [padding-horizontal] .scroll-inner { .app-#{$mode} [padding-horizontal] .scroll-inner {
@include padding-horizontal($content-padding); @include padding-horizontal($content-padding);
} }