javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(input): update width of inputs so they don't exceed the item

Browse Source 
fixes #5835
This commit is contained in:
Brandy Carney
2016-03-15 12:38:55 -04:00
parent e6044fe967
commit 4d4f1d429a
4 changed files with 30 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
ionic/components/input/input.wp.scss
View File

@@ -8,6 +8,10 @@ $text-input-wp-background-color: $list-wp-background-color !default;
$text-input-wp-border-color: $input-wp-border-color !default;
$text-input-wp-border-width: 2px !default;
$text-input-wp-margin-top: $item-wp-padding-top !default;
$text-input-wp-margin-right: ($item-wp-padding-right / 2) !default;
$text-input-wp-margin-bottom: $item-wp-padding-bottom !default;
$text-input-wp-margin-left: ($item-wp-padding-left / 2) !default;
$text-input-wp-padding-vertical: 0 !default;
$text-input-wp-padding-horizontal: 8px !default;
$text-input-wp-line-height: 3rem !default;
@@ -27,9 +31,11 @@ $text-input-wp-input-clear-icon-size: 22px !default;
// --------------------------------------------------
.text-input {
margin: $item-wp-padding-top ($item-wp-padding-right / 2) $item-wp-padding-bottom ($item-wp-padding-left / 2);
margin: $text-input-wp-margin-top $text-input-wp-margin-right $text-input-wp-margin-bottom $text-input-wp-margin-left;
padding: $text-input-wp-padding-vertical $text-input-wp-padding-horizontal;
width: calc(100% - #{$text-input-wp-margin-right} - #{$text-input-wp-margin-left});
border: $text-input-wp-border-width solid $text-input-wp-border-color;
line-height: $text-input-wp-line-height;
}
@@ -70,6 +76,8 @@ ion-input.ng-invalid.ng-touched .text-input {
margin-top: 8px;
margin-bottom: 8px;
margin-left: 0;
width: calc(100% - #{$text-input-wp-margin-right});
}
.item-label-floating .text-input.cloned-input {