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

inset lists, card updates

Browse Source
This commit is contained in:
Adam Bradley
2015-08-12 15:44:27 -05:00
parent 8e053f18de
commit db0413b2dd
27 changed files with 275 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -186,71 +186,3 @@ button.item.item {
}
}
/*
.item-group-title {
display: block;
padding: $item-padding;
padding-top: ceil($item-padding / 2);
padding-bottom: ceil($item-padding / 2);
min-height: 30px;
background-color: $item-divider-bg;
color: $item-divider-color;
font-weight: 500;
width: 100%;
z-index: 100;
&.sticky {
position: -webkit-sticky;
top: 0;
}
}
ion-primary-swipe-buttons,
.item-content {
transition: transform 0.3s;
}
ion-primary-swipe-buttons {
position: absolute;
top: 0;
left: 0;
bottom: 0;
z-index: 100;
transform: translate3d(-100%,0,0);
&:not(.open):not(.changing) {
display: none;
}
&.open {
transform: translate3d(100%, 0, 0);
}
}
// Some testing things
.item-media-placeholder {
width: 40px;
height: 40px;
border-radius: 50%;
background: #aaa;
margin-right: 16px;
}
.item-label h3 {
margin: 0;
font-size: 16px;
margin: 0 0 6px;
line-height: .75em;
color: #222;
font-weight: normal;
}
.item-label h4 {
margin: 10px 0 0px;
font-size: 14px;
line-height: 14px;
color: #858585;
}
*/

32
ionic/components/item/item.ts
View File

@@ -12,34 +12,10 @@ import {dom} from 'ionic/util';
}
})
@View({
template: `
<!--
<ng-content select="ion-primary-options"></ng-content>
<ng-content select="ion-primary-swipe-buttons"></ng-content>
-->
<div class="item-content">
<div class="item-media">
</div>
<div class="item-accessory">
<!--<ng-content select="ion-item-accessory"></ng-content>-->
</div>
<div class="item-label">
<ng-content></ng-content>
</div>
</div>
<!--
<ng-content select="ion-secondary-options"></ng-content>
<ng-content select="ion-secondary-swipe-buttons"></ng-content>
-->
`
/*
directives: [
ItemPrimarySwipeButtons,
// ItemSecondarySwipeButtons,
// ItemPrimaryOptions,
// ItemSecondaryOptions
]
*/
template:
'<div class="item-content">' +
'<ng-content></ng-content>'+
'</div>'
})
export class Item {
constructor(elementRef: ElementRef) {

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

@@ -42,6 +42,17 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
left: $item-ios-padding-left;
border-top: 1px solid $item-ios-border-color;
}
&:last-child {
margin-bottom: -1px;
}
}
&[inset] .item {
&:before,
&:after {
left: 0;
}
}
.input-label,
@@ -55,8 +66,8 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
}
.text-input {
margin: 0 $item-ios-padding-right 0 $item-ios-padding-left;
padding: $item-ios-padding-top 0 $item-ios-padding-bottom 0;
margin: $item-ios-padding-top $item-ios-padding-right $item-ios-padding-bottom $item-ios-padding-left;
padding: 0;
}
.item-note {
@@ -109,10 +120,13 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
.hairlines .list[mode=ios] .item {
margin-top: -0.5px;
&:last-child {
margin-bottom: -0.5px;
}
&:before,
&:after {
border-top-width: 0.5px;
}
}