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

refactor(text-input): wrapped inputs in the item-inner div to style the border

Browse Source 
references #492
This commit is contained in:
Brandy Carney
2015-11-12 16:44:00 -05:00
parent f2db20cf1c
commit 50c682a669
4 changed files with 7 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
ionic/components/item/item.scss
View File

@ -32,6 +32,7 @@
align-self: stretch; align-self: stretch;
box-sizing: border-box; box-sizing: border-box;
flex: 1; flex: 1;
flex-direction: inherit;
} }
.item-group { .item-group {

4
ionic/components/list/modes/ios.scss
View File

@ -77,10 +77,6 @@ $list-ios-header-color: #333 !default;
} }
} }
ion-input.item {
border-bottom: 1px solid $item-ios-border-color;
}
// If the item has the no-lines attribute remove the bottom border from: // If the item has the no-lines attribute remove the bottom border from:
// the item itself (for last-child items) // the item itself (for last-child items)
// the item-inner class (if it is not last) // the item-inner class (if it is not last)

7
ionic/components/text-input/modes/ios.scss
View File

@ -7,12 +7,9 @@ $input-label-ios-color: #7f7f7f !default;
.list, .list,
ion-card { ion-card {
ion-input {
padding-right: ($item-ios-padding-right / 2);
}
[text-input] { [text-input] {
margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom ($item-ios-padding-left / 2); margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom 0;
padding: 0; padding: 0;
} }
@ -22,7 +19,7 @@ ion-card {
} }
ion-label { ion-label {
margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom ($item-ios-padding-left / 2); margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom 0;
color: $input-label-ios-color; color: $input-label-ios-color;
} }

4
ionic/components/text-input/text-input.ts
View File

@ -20,8 +20,10 @@ import {Platform} from '../../platform/platform';
'(mouseup)': 'pointerEnd($event)' '(mouseup)': 'pointerEnd($event)'
}, },
template: template:
'<div class="item-inner">' +
'<ng-content></ng-content>' + '<ng-content></ng-content>' +
'<input [type]="type" aria-hidden="true" scroll-assist *ng-if="scrollAssist">', '<input [type]="type" aria-hidden="true" scroll-assist *ng-if="scrollAssist">' +
'</div>',
directives: [NgIf, forwardRef(() => InputScrollAssist)] directives: [NgIf, forwardRef(() => InputScrollAssist)]
}) })
export class TextInput { export class TextInput {