diff --git a/ionic/components/button/button.scss b/ionic/components/button/button.scss index 4d89275a31..09836b457e 100644 --- a/ionic/components/button/button.scss +++ b/ionic/components/button/button.scss @@ -91,10 +91,6 @@ button, &[outline] { background: none; - &.activated { - opacity: 0.3 !important; - } - &[full] { border-radius: 0; border-right-width: 0; @@ -199,7 +195,7 @@ a[button] { &.activated { color: white; - background-color: rgb(red($fg-color), green($fg-color), blue($fg-color));//, 0.15); + background-color: rgb(red($fg-color), green($fg-color), blue($fg-color)); } } } diff --git a/ionic/components/button/extensions/material.scss b/ionic/components/button/extensions/material.scss index 2a5c4eac44..d55942b7a4 100644 --- a/ionic/components/button/extensions/material.scss +++ b/ionic/components/button/extensions/material.scss @@ -89,7 +89,16 @@ $button-material-border-radius: 3px !default; } &.activated { + + @if lightness(get-color($color, base)) > 90 { + $fg-color: get-color($color, inverse); + } @else { + $fg-color: get-color($color, base); + } + opacity: 1; + background: transparent; + color: $fg-color; } } @@ -98,12 +107,31 @@ $button-material-border-radius: 3px !default; &:hover, &.hover { - background-color: rgba(158, 158, 158, 0.2); + background-color: rgba(158, 158, 158, 0.1); } &.activated { - background-color: rgba(158, 158, 158, 0.4); + background-color: rgba(158, 158, 158, 0.2); } } + + &[round] { + border-radius: $button-round-border-radius; + padding: $button-round-padding; + } + + &[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; + } } } } diff --git a/ionic/components/icon/icon.scss b/ionic/components/icon/icon.scss index 482da9f2e1..c185128755 100644 --- a/ionic/components/icon/icon.scss +++ b/ionic/components/icon/icon.scss @@ -16,7 +16,7 @@ icon { display: inline-block; - font-size: 1.8em; + font-size: 1.2em; } icon[small] {