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

refactor(list): moved ion-item-group-title out of the list for iOS

Browse Source 
references #387
This commit is contained in:
Brandy Carney
2015-11-16 16:51:57 -05:00
parent f2a763a289
commit e55e158ab6
2 changed files with 13 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
ionic/components/item/modes/ios.scss
View File

@ -29,18 +29,12 @@ $item-ios-divider-padding: 5px 15px !default;
$item-ios-sliding-content-bg: $background-color !default; $item-ios-sliding-content-bg: $background-color !default;
$item-ios-sliding-transition: transform 250ms ease-in-out !default; $item-ios-sliding-transition: transform 250ms ease-in-out !default;
.item-group-title {
padding: $item-ios-padding-top $item-ios-padding-right $item-ios-padding-bottom $item-ios-padding-left;
background-color: $item-ios-divider-bg;
color: $item-ios-divider-color;
}
ion-note {
color: $item-ios-note-color;
}
.item-group { .item-group {
ion-item-group-title { ion-item-group-title {
padding: $item-ios-padding-top $item-ios-padding-right $item-ios-padding-bottom $item-ios-padding-left;
background-color: $item-ios-divider-bg;
color: $item-ios-divider-color;
border-bottom: 1px solid $item-ios-border-color; border-bottom: 1px solid $item-ios-border-color;
} }
@ -51,6 +45,10 @@ ion-note {
} }
} }
ion-note {
color: $item-ios-note-color;
}
.item { .item {
border-radius: 0; border-radius: 0;
padding-left: $item-ios-padding-left; padding-left: $item-ios-padding-left;
@ -79,7 +77,6 @@ ion-item-content {
margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom 0; margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom 0;
} }
// TODO clean up Sass variables
[item-left] { [item-left] {
margin: ($item-ios-padding-top / 2) $item-ios-padding-right ($item-ios-padding-bottom / 2) 0; margin: ($item-ios-padding-top / 2) $item-ios-padding-right ($item-ios-padding-bottom / 2) 0;
} }
@ -167,6 +164,9 @@ a.item:not([detail-none]) .item-inner,
padding-right: 32px; padding-right: 32px;
} }
&.hairlines .item-inner { &.hairlines {
.item-inner,
.item-group ion-item-group-title {
border-bottom-width: 0.55px; border-bottom-width: 0.55px;
}
} }

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

@ -37,10 +37,6 @@ $list-ios-border-color: $list-border-color !default;
letter-spacing: $list-ios-header-letter-spacing; letter-spacing: $list-ios-header-letter-spacing;
text-transform: uppercase; text-transform: uppercase;
color: $list-ios-header-color; color: $list-ios-header-color;
}
ion-header,
ion-item-group-title {
border-bottom: 1px solid $list-ios-border-color; border-bottom: 1px solid $list-ios-border-color;
} }
@ -105,8 +101,7 @@ $list-ios-border-color: $list-border-color !default;
border-width: 0.55px; border-width: 0.55px;
} }
ion-header, ion-header {
ion-item-group-title {
border-bottom-width: 0.55px; border-bottom-width: 0.55px;
} }
@ -136,7 +131,6 @@ $list-ios-border-color: $list-border-color !default;
border-radius: $list-inset-ios-border-radius; border-radius: $list-inset-ios-border-radius;
.item { .item {
margin-top: 0;
border-bottom: 1px solid $list-ios-border-color; border-bottom: 1px solid $list-ios-border-color;
.item-inner { .item-inner {
@ -146,7 +140,6 @@ $list-ios-border-color: $list-border-color !default;
> .item:first-child, > .item:first-child,
ion-header { ion-header {
margin-top: 0;
border-top-right-radius: $list-inset-ios-border-radius; border-top-right-radius: $list-inset-ios-border-radius;
border-top-left-radius: $list-inset-ios-border-radius; border-top-left-radius: $list-inset-ios-border-radius;
} }
@ -157,7 +150,6 @@ $list-ios-border-color: $list-border-color !default;
> .item:last-child, > .item:last-child,
> ion-item-sliding:last-child .item { > ion-item-sliding:last-child .item {
margin-bottom: 0;
border-bottom-right-radius: $list-inset-ios-border-radius; border-bottom-right-radius: $list-inset-ios-border-radius;
border-bottom-left-radius: $list-inset-ios-border-radius; border-bottom-left-radius: $list-inset-ios-border-radius;
border-bottom: none; border-bottom: none;