list css updates

This commit is contained in:
Adam Bradley
2015-08-31 21:00:48 -05:00
parent 4e71e07b37
commit 2eb742eee0
8 changed files with 22 additions and 18 deletions

View File

@ -2,10 +2,10 @@
// iOS Card
// --------------------------------------------------
$card-ios-margin-top: 16px !default;
$card-ios-margin-right: 16px !default;
$card-ios-margin-bottom: 16px !default;
$card-ios-margin-left: 16px !default;
$card-ios-margin-top: 12px !default;
$card-ios-margin-right: 12px !default;
$card-ios-margin-bottom: 12px !default;
$card-ios-margin-left: 12px !default;
$card-ios-padding-top: 13px !default;
$card-ios-padding-right: 16px !default;
@ -17,7 +17,7 @@ $card-ios-padding-media-bottom: 10px !default;
$card-ios-background-color: $list-background-color !default;
$card-ios-box-shadow: 0 1px 2px rgba(0,0,0,.3) !default;
$card-ios-border-radius: 2px !default;
$card-ios-border-radius: 4px !default;
$card-ios-font-size: 1.4rem !default;
$card-ios-text-color: #666 !default;

View File

@ -2,10 +2,10 @@
// Material Design Card
// --------------------------------------------------
$card-md-margin-top: 8px !default;
$card-md-margin-right: 8px !default;
$card-md-margin-bottom: 8px !default;
$card-md-margin-left: 8px !default;
$card-md-margin-top: 10px !default;
$card-md-margin-right: 10px !default;
$card-md-margin-bottom: 10px !default;
$card-md-margin-left: 10px !default;
$card-md-padding-top: 13px !default;
$card-md-padding-right: 16px !default;

View File

@ -1,7 +1,7 @@
<ion-toolbar><ion-title>Basic Cards</ion-title></ion-toolbar>
<ion-content class="outer-content">
<ion-content class="outer-content" style="background:#eee">
<ion-card>

View File

@ -34,6 +34,7 @@ button.item.item {
color: inherit;
border-radius: 0;
box-shadow: none;
will-change: initial;
}
ion-item-content {

View File

@ -18,7 +18,6 @@
}
.list[inset] {
border-radius: 2px;
overflow: hidden;
ion-header {

View File

@ -2,15 +2,16 @@
// iOS List
// --------------------------------------------------
$list-ios-margin-top: 10px !default;
$list-ios-margin-right: 0 !default;
$list-ios-margin-bottom: 32px !default;
$list-ios-margin-left: 0 !default;
$list-ios-margin-top: 10px !default;
$list-ios-margin-right: 0 !default;
$list-ios-margin-bottom: 32px !default;
$list-ios-margin-left: 0 !default;
$list-inset-ios-margin-top: 16px !default;
$list-inset-ios-margin-right: 16px !default;
$list-inset-ios-margin-bottom: 16px !default;
$list-inset-ios-margin-left: 16px !default;
$list-inset-ios-border-radius: 4px !default;
$list-ios-header-padding: 10px $item-ios-padding-right 10px $item-ios-padding-left !default;
$list-ios-header-font-size: 1.2rem !default;
@ -34,7 +35,7 @@ $list-ios-header-color: #333 !default;
}
.list[mode=ios] + .list {
margin-top: $list-ios-margin-top;
margin-top: $list-ios-margin-top + $list-ios-margin-bottom;
}
.list[mode=ios] + .list ion-header {
@ -44,6 +45,7 @@ $list-ios-header-color: #333 !default;
.list[mode=ios][inset] {
margin: $list-inset-ios-margin-top $list-inset-ios-margin-right $list-inset-ios-margin-bottom $list-inset-ios-margin-left;
border-radius: $list-inset-ios-border-radius;
.item:first-child {
margin-top: 0;

View File

@ -11,6 +11,7 @@ $list-inset-md-margin-top: 16px !default;
$list-inset-md-margin-right: 16px !default;
$list-inset-md-margin-bottom: 16px !default;
$list-inset-md-margin-left: 16px !default;
$list-inset-md-border-radius: 2px !default;
$list-md-header-padding: 16px $item-md-padding-right 16px $item-md-padding-left !default;
$list-md-header-font-size: 1.4rem !default;
@ -29,7 +30,7 @@ $list-md-header-color: #858585 !default;
}
.list[mode=md] + .list {
margin-top: $list-md-margin-top;
margin-top: $list-md-margin-top + $list-md-margin-bottom;
}
.list[mode=md] + .list ion-header {
@ -39,6 +40,7 @@ $list-md-header-color: #858585 !default;
.list[mode=md][inset] {
margin: $list-inset-md-margin-top $list-inset-md-margin-right $list-inset-md-margin-bottom $list-inset-md-margin-left;
border-radius: $list-inset-md-border-radius;
.item:first-child {
margin-top: 0;

View File

@ -1,6 +1,6 @@
<ion-toolbar><ion-title>List Headers</ion-title></ion-toolbar>
<ion-content class="outer-content">
<ion-content class="outer-content" style="background:#EFEFF4">
<ion-list>