From 2eb742eee02a54dbc686d0845e29f9f3734a02af Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Mon, 31 Aug 2015 21:00:48 -0500 Subject: [PATCH] list css updates --- ionic/components/card/modes/ios.scss | 10 +++++----- ionic/components/card/modes/material.scss | 8 ++++---- ionic/components/card/test/basic/main.html | 2 +- ionic/components/item/item.scss | 1 + ionic/components/list/list.scss | 1 - ionic/components/list/modes/ios.scss | 12 +++++++----- ionic/components/list/modes/material.scss | 4 +++- ionic/components/list/test/headers/main.html | 2 +- 8 files changed, 22 insertions(+), 18 deletions(-) diff --git a/ionic/components/card/modes/ios.scss b/ionic/components/card/modes/ios.scss index 1264070853..7ed85c006c 100644 --- a/ionic/components/card/modes/ios.scss +++ b/ionic/components/card/modes/ios.scss @@ -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; diff --git a/ionic/components/card/modes/material.scss b/ionic/components/card/modes/material.scss index 098cf70e9c..c1f99173ac 100644 --- a/ionic/components/card/modes/material.scss +++ b/ionic/components/card/modes/material.scss @@ -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; diff --git a/ionic/components/card/test/basic/main.html b/ionic/components/card/test/basic/main.html index 9c0cb1e955..c4707bb112 100644 --- a/ionic/components/card/test/basic/main.html +++ b/ionic/components/card/test/basic/main.html @@ -1,7 +1,7 @@ Basic Cards - + diff --git a/ionic/components/item/item.scss b/ionic/components/item/item.scss index 8e72fbbd33..796b5d18eb 100644 --- a/ionic/components/item/item.scss +++ b/ionic/components/item/item.scss @@ -34,6 +34,7 @@ button.item.item { color: inherit; border-radius: 0; box-shadow: none; + will-change: initial; } ion-item-content { diff --git a/ionic/components/list/list.scss b/ionic/components/list/list.scss index b183072925..29f68250db 100644 --- a/ionic/components/list/list.scss +++ b/ionic/components/list/list.scss @@ -18,7 +18,6 @@ } .list[inset] { - border-radius: 2px; overflow: hidden; ion-header { diff --git a/ionic/components/list/modes/ios.scss b/ionic/components/list/modes/ios.scss index 3355d92271..f25734137a 100644 --- a/ionic/components/list/modes/ios.scss +++ b/ionic/components/list/modes/ios.scss @@ -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; diff --git a/ionic/components/list/modes/material.scss b/ionic/components/list/modes/material.scss index 19c76ab237..961438afa4 100644 --- a/ionic/components/list/modes/material.scss +++ b/ionic/components/list/modes/material.scss @@ -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; diff --git a/ionic/components/list/test/headers/main.html b/ionic/components/list/test/headers/main.html index 462c8e321e..da967f996b 100644 --- a/ionic/components/list/test/headers/main.html +++ b/ionic/components/list/test/headers/main.html @@ -1,6 +1,6 @@ List Headers - +