javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-23 05:58:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(padding): add padding to correct element

Browse Source
This commit is contained in:
Brandy Carney
2017-07-21 16:50:33 -04:00
parent 2a72316c69
commit 12da6d5246
4 changed files with 32 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -72,38 +72,38 @@ ion-app [no-padding] ion-scroll {
} }
@mixin content-padding($mode, $content-padding) { @mixin content-padding($mode, $content-padding) {
ion-app.#{$mode} [padding], .app-#{$mode} [padding],
ion-app.#{$mode} [padding] ion-scroll { .app-#{$mode} [padding] ion-scroll {
@include padding($content-padding); @include padding($content-padding);
} }
ion-app.#{$mode} [padding-top], .app-#{$mode} [padding-top],
ion-app.#{$mode} [padding-top] ion-scroll { .app-#{$mode} [padding-top] ion-scroll {
@include padding($content-padding, null, null, null); @include padding($content-padding, null, null, null);
} }
ion-app.#{$mode} [padding-left], .app-#{$mode} [padding-left],
ion-app.#{$mode} [padding-left] ion-scroll { .app-#{$mode} [padding-left] ion-scroll {
@include padding-horizontal($content-padding, null); @include padding-horizontal($content-padding, null);
} }
ion-app.#{$mode} [padding-right], .app-#{$mode} [padding-right],
ion-app.#{$mode} [padding-right] ion-scroll { .app-#{$mode} [padding-right] ion-scroll {
@include padding-horizontal(null, $content-padding); @include padding-horizontal(null, $content-padding);
} }
ion-app.#{$mode} [padding-bottom], .app-#{$mode} [padding-bottom],
ion-app.#{$mode} [padding-bottom] ion-scroll { .app-#{$mode} [padding-bottom] ion-scroll {
@include padding(null, null, $content-padding, null); @include padding(null, null, $content-padding, null);
} }
ion-app.#{$mode} [padding-vertical], .app-#{$mode} [padding-vertical],
ion-app.#{$mode} [padding-vertical] ion-scroll { .app-#{$mode} [padding-vertical] ion-scroll {
@include padding($content-padding, null, $content-padding, null); @include padding($content-padding, null, $content-padding, null);
} }
ion-app.#{$mode} [padding-horizontal], .app-#{$mode} [padding-horizontal],
ion-app.#{$mode} [padding-horizontal] ion-scroll { .app-#{$mode} [padding-horizontal] ion-scroll {
@include padding-horizontal($content-padding); @include padding-horizontal($content-padding);
} }
} }
@ -118,50 +118,50 @@ ion-app [no-margin] ion-scroll {
} }
@mixin content-margin($mode, $content-margin) { @mixin content-margin($mode, $content-margin) {
ion-app.#{$mode} [margin], .app-#{$mode} [margin],
ion-app.#{$mode} [margin] ion-scroll { .app-#{$mode} [margin] ion-scroll {
@include margin($content-margin); @include margin($content-margin);
} }
ion-app.#{$mode} [margin-top], .app-#{$mode} [margin-top],
ion-app.#{$mode} [margin-top] ion-scroll { .app-#{$mode} [margin-top] ion-scroll {
@include margin($content-margin, null, null, null); @include margin($content-margin, null, null, null);
} }
ion-app.#{$mode} [margin-left], .app-#{$mode} [margin-left],
ion-app.#{$mode} [margin-left] ion-scroll { .app-#{$mode} [margin-left] ion-scroll {
// scss-lint:disable PropertySpelling // scss-lint:disable PropertySpelling
margin-left: $content-margin; margin-left: $content-margin;
} }
ion-app.#{$mode} [margin-start], .app-#{$mode} [margin-start],
ion-app.#{$mode} [margin-start] ion-scroll { .app-#{$mode} [margin-start] ion-scroll {
@include margin-horizontal($content-margin, null); @include margin-horizontal($content-margin, null);
} }
ion-app.#{$mode} [margin-right], .app-#{$mode} [margin-right],
ion-app.#{$mode} [margin-right] ion-scroll { .app-#{$mode} [margin-right] ion-scroll {
// scss-lint:disable PropertySpelling // scss-lint:disable PropertySpelling
margin-right: $content-margin; margin-right: $content-margin;
} }
ion-app.#{$mode} [margin-end], .app-#{$mode} [margin-end],
ion-app.#{$mode} [margin-end] ion-scroll { .app-#{$mode} [margin-end] ion-scroll {
@include margin-horizontal(null, $content-margin); @include margin-horizontal(null, $content-margin);
} }
ion-app.#{$mode} [margin-bottom], .app-#{$mode} [margin-bottom],
ion-app.#{$mode} [margin-bottom] ion-scroll { .app-#{$mode} [margin-bottom] ion-scroll {
@include margin(null, null, $content-margin, null); @include margin(null, null, $content-margin, null);
} }
ion-app.#{$mode} [margin-vertical], .app-#{$mode} [margin-vertical],
ion-app.#{$mode} [margin-vertical] ion-scroll { .app-#{$mode} [margin-vertical] ion-scroll {
@include margin($content-margin, null, $content-margin, null); @include margin($content-margin, null, $content-margin, null);
} }
ion-app.#{$mode} [margin-horizontal], .app-#{$mode} [margin-horizontal],
ion-app.#{$mode} [margin-horizontal] ion-scroll { .app-#{$mode} [margin-horizontal] ion-scroll {
@include margin-horizontal($content-margin); @include margin-horizontal($content-margin);
} }
} }

4
packages/core/src/components/item-sliding/test/basic.html
View File

@ -399,10 +399,6 @@
.downloading .download-hide { .downloading .download-hide {
display: none; display: none;
} }
[padding] {
padding: 16px;
}
</style> </style>
</ion-content> </ion-content>
</ion-app> </ion-app>

14
packages/core/src/components/searchbar/test/basic.html
View File

@ -138,20 +138,6 @@
dynamicProp.spellcheck = propIsSpellcheck; dynamicProp.spellcheck = propIsSpellcheck;
} }
</script> </script>
<style>
[padding] {
padding: 16px;
}
[padding-horizontal] {
padding: 0 16px;
}
[padding] ion-segment {
margin-bottom: 16px;
}
</style>
</ion-content> </ion-content>
</ion-app> </ion-app>
</body> </body>

14
packages/core/src/components/segment/test/basic.html
View File

@ -103,20 +103,6 @@
} }
} }
</script> </script>
<style>
[padding] {
padding: 16px;
}
[padding-horizontal] {
padding: 0 16px;
}
[padding] ion-segment {
margin-bottom: 16px;
}
</style>
</ion-content> </ion-content>
</ion-app> </ion-app>
</body> </body>