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

list/item/button/card css overhaul

Browse Source
This commit is contained in:
Adam Bradley
2015-08-25 13:17:29 -05:00
parent cb48d67d4a
commit 069ac65e24
36 changed files with 370 additions and 423 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
ionic/components/button/button-icon.scss
View File

@@ -7,20 +7,21 @@ button,
[button] {
&.icon-left icon {
margin-left: -0.6rem;
padding-right: 0.6rem;
margin-left: -0.2em;
padding-right: 0.4em;
}
&.icon-right icon {
margin-right: -0.6rem;
padding-left: 0.6rem;
margin-right: -0.2em;
padding-left: 0.3em;
}
&.icon-only {
padding: 0;
min-width: 0.9em;
icon {
padding: 0 1.6rem;
padding: 0 0.9em;
}
}
@@ -29,11 +30,6 @@ button,
border: none;
}
&[large] icon {
margin-left: 0;
margin-right: 0;
}
&[small] icon {
margin-left: 0;
margin-right: 0;

10
ionic/components/button/button-size.scss
View File

@@ -3,12 +3,12 @@
// --------------------------------------------------
$button-large-font-size: 2rem !default;
$button-large-height: 5.4rem !default;
$button-large-padding: 1.4rem !default;
$button-large-height: 2.8em !default;
$button-large-padding: 1.0em !default;
$button-small-font-size: 1.3rem !default;
$button-small-height: 2.8rem !default;
$button-small-padding: 1.1rem !default;
$button-small-height: 2.1em !default;
$button-small-padding: 0.9em !default;
button,
@@ -16,14 +16,12 @@ button,
&[large] {
padding: 0 $button-large-padding;
min-width: ($button-large-padding * 4);
min-height: $button-large-height;
font-size: $button-large-font-size;
}
&[small] {
padding: 0 $button-small-padding;
min-width: ($button-small-padding * 3);
min-height: $button-small-height;
font-size: $button-small-font-size;
}

7
ionic/components/button/button.scss
View File

@@ -4,13 +4,12 @@
$button-font-size: 1.6rem !default;
$button-margin: 0.4rem 0 !default;
$button-padding: 0 2rem !default;
$button-height: 4.4rem !default;
$button-border-width: 1px !default;
$button-padding: 0 1em !default;
$button-height: 2.8em !default;
$button-border-radius: 4px !default;
$button-round-border-radius: 64px !default;
$button-round-padding: 0 2.6rem !default;
$button-round-border-radius: 64px !default;
$button-color: color(primary) !default;
$button-color-activated: darken-or-lighten($button-color) !default;

8
ionic/components/button/modes/material.scss
View File

@@ -4,7 +4,7 @@
$button-md-font-size: 1.4rem !default;
$button-md-min-height: 3.6rem !default;
$button-md-padding: 0 1.6rem !default;
$button-md-padding: 0 1.2em !default;
$button-md-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12) !default;
$button-md-box-shadow-active: 0 4px 5px 0 rgba(0, 0, 0, 0.14),0 1px 10px 0 rgba(0, 0, 0, 0.12),0 2px 4px -1px rgba(0, 0, 0, 0.2); //0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
$button-md-border-radius: 2px !default;
@@ -72,14 +72,12 @@ $button-md-clear-active-bg-color: rgba(158, 158, 158, 0.2);
&[large] {
padding: 0 $button-large-padding;
min-width: ($button-large-padding * 4);
min-height: $button-large-height;
font-size: $button-large-font-size;
}
&[small] {
padding: 0 $button-small-padding;
min-width: ($button-small-padding * 3);
min-height: $button-small-height;
font-size: $button-small-font-size;
}
@@ -90,10 +88,6 @@ $button-md-clear-active-bg-color: rgba(158, 158, 158, 0.2);
&.icon-only {
padding: 0;
icon {
padding: 0 1.6rem;
}
}
// Generate iOS Checkbox Auxiliary Colors