javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 06:57:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixed button and header colors

Browse Source
This commit is contained in:
Max Lynch
2013-09-10 11:06:06 -05:00
parent 8ba2411eb0
commit cbed88d5e7
3 changed files with 60 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
dist/ionic.css vendored
View File

@ -1639,39 +1639,39 @@ main {
.bar.bar-primary { .bar.bar-primary {
background-color: #6999e9; background-color: #6999e9;
border-color: #5981c5; border-color: #5981c5;
color: #999999; } color: white; }
.bar.bar-primary .tab-item a { .bar.bar-primary .tab-item a {
color: #999999; } color: white; }
.bar.bar-info { .bar.bar-info {
background-color: #60d2e6; background-color: #60d2e6;
border-color: #51b3c4; border-color: #51b3c4;
color: #999999; } color: white; }
.bar.bar-info .tab-item a { .bar.bar-info .tab-item a {
color: #999999; } color: white; }
.bar.bar-success { .bar.bar-success {
background-color: #89c163; background-color: #89c163;
border-color: #71a052; border-color: #71a052;
color: #999999; } color: white; }
.bar.bar-success .tab-item a { .bar.bar-success .tab-item a {
color: #999999; } color: white; }
.bar.bar-warning { .bar.bar-warning {
background-color: #f0b840; background-color: #f0b840;
border-color: #cf9a29; border-color: #cf9a29;
color: #999999; } color: white; }
.bar.bar-warning .tab-item a { .bar.bar-warning .tab-item a {
color: #999999; } color: white; }
.bar.bar-danger { .bar.bar-danger {
background-color: #de5645; background-color: #de5645;
border-color: #bc4435; border-color: #bc4435;
color: #999999; } color: white; }
.bar.bar-danger .tab-item a { .bar.bar-danger .tab-item a {
color: #999999; } color: white; }
.bar.bar-dark { .bar.bar-dark {
background-color: #444444; background-color: #444444;
border-color: #111111; border-color: #111111;
color: #999999; } color: white; }
.bar.bar-dark .tab-item a { .bar.bar-dark .tab-item a {
color: #999999; } color: white; }
.bar-default .button { .bar-default .button {
color: #333333; color: #333333;
@ -1698,11 +1698,11 @@ main {
border-color: #b3b3b3; } border-color: #b3b3b3; }
.bar-primary .button { .bar-primary .button {
color: #999999; color: white;
background-color: #6999e9; background-color: #6999e9;
border-color: #5981c5; } border-color: #5981c5; }
.bar-primary .button:hover { .bar-primary .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-primary .button.active, .bar-primary .button:active { .bar-primary .button.active, .bar-primary .button:active {
background-color: #4581e4; background-color: #4581e4;
@ -1710,11 +1710,11 @@ main {
border-color: #3d67ae; } border-color: #3d67ae; }
.bar-info .button { .bar-info .button {
color: #999999; color: white;
background-color: #60d2e6; background-color: #60d2e6;
border-color: #51b3c4; } border-color: #51b3c4; }
.bar-info .button:hover { .bar-info .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-info .button.active, .bar-info .button:active { .bar-info .button.active, .bar-info .button:active {
background-color: #3dc8e0; background-color: #3dc8e0;
@ -1722,11 +1722,11 @@ main {
border-color: #3998a9; } border-color: #3998a9; }
.bar-success .button { .bar-success .button {
color: #999999; color: white;
background-color: #89c163; background-color: #89c163;
border-color: #71a052; } border-color: #71a052; }
.bar-success .button:hover { .bar-success .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-success .button.active, .bar-success .button:active { .bar-success .button.active, .bar-success .button:active {
background-color: #73b447; background-color: #73b447;
@ -1734,11 +1734,11 @@ main {
border-color: #597e41; } border-color: #597e41; }
.bar-warning .button { .bar-warning .button {
color: #999999; color: white;
background-color: #f0b840; background-color: #f0b840;
border-color: #cf9a29; } border-color: #cf9a29; }
.bar-warning .button:hover { .bar-warning .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-warning .button.active, .bar-warning .button:active { .bar-warning .button.active, .bar-warning .button:active {
background-color: #edaa1a; background-color: #edaa1a;
@ -1746,11 +1746,11 @@ main {
border-color: #a47a21; } border-color: #a47a21; }
.bar-danger .button { .bar-danger .button {
color: #999999; color: white;
background-color: #de5645; background-color: #de5645;
border-color: #bc4435; } border-color: #bc4435; }
.bar-danger .button:hover { .bar-danger .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-danger .button.active, .bar-danger .button:active { .bar-danger .button.active, .bar-danger .button:active {
background-color: #d43926; background-color: #d43926;
@ -1758,11 +1758,11 @@ main {
border-color: #94362a; } border-color: #94362a; }
.bar-dark .button { .bar-dark .button {
color: #999999; color: white;
background-color: #444444; background-color: #444444;
border-color: #111111; } border-color: #111111; }
.bar-dark .button:hover { .bar-dark .button:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.bar-dark .button.active, .bar-dark .button:active { .bar-dark .button.active, .bar-dark .button:active {
background-color: #303030; background-color: #303030;
@ -1803,66 +1803,66 @@ main {
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #b3b3b3; } border-color: #b3b3b3; }
.button.button-primary { .button.button-primary {
color: #999999; color: white;
background-color: #6999e9; background-color: #6999e9;
border-color: #5981c5; } border-color: #5981c5; }
.button.button-primary:hover { .button.button-primary:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-primary.active, .button.button-primary:active { .button.button-primary.active, .button.button-primary:active {
background-color: #4581e4; background-color: #4581e4;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #3d67ae; } border-color: #3d67ae; }
.button.button-info { .button.button-info {
color: #999999; color: white;
background-color: #60d2e6; background-color: #60d2e6;
border-color: #51b3c4; } border-color: #51b3c4; }
.button.button-info:hover { .button.button-info:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-info.active, .button.button-info:active { .button.button-info.active, .button.button-info:active {
background-color: #3dc8e0; background-color: #3dc8e0;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #3998a9; } border-color: #3998a9; }
.button.button-success { .button.button-success {
color: #999999; color: white;
background-color: #89c163; background-color: #89c163;
border-color: #71a052; } border-color: #71a052; }
.button.button-success:hover { .button.button-success:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-success.active, .button.button-success:active { .button.button-success.active, .button.button-success:active {
background-color: #73b447; background-color: #73b447;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #597e41; } border-color: #597e41; }
.button.button-warning { .button.button-warning {
color: #999999; color: white;
background-color: #f0b840; background-color: #f0b840;
border-color: #cf9a29; } border-color: #cf9a29; }
.button.button-warning:hover { .button.button-warning:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-warning.active, .button.button-warning:active { .button.button-warning.active, .button.button-warning:active {
background-color: #edaa1a; background-color: #edaa1a;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #a47a21; } border-color: #a47a21; }
.button.button-danger { .button.button-danger {
color: #999999; color: white;
background-color: #de5645; background-color: #de5645;
border-color: #bc4435; } border-color: #bc4435; }
.button.button-danger:hover { .button.button-danger:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-danger.active, .button.button-danger:active { .button.button-danger.active, .button.button-danger:active {
background-color: #d43926; background-color: #d43926;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12);
border-color: #94362a; } border-color: #94362a; }
.button.button-dark { .button.button-dark {
color: #999999; color: white;
background-color: #444444; background-color: #444444;
border-color: #111111; } border-color: #111111; }
.button.button-dark:hover { .button.button-dark:hover {
color: #999999; color: white;
text-decoration: none; } text-decoration: none; }
.button.button-dark.active, .button.button-dark:active { .button.button-dark.active, .button.button-dark:active {
background-color: #303030; background-color: #303030;

36
scss/ionic/theme/_bar.scss
View File

@ -30,51 +30,51 @@
&.bar-primary { &.bar-primary {
background-color: $bar-primary-bg; background-color: $bar-primary-bg;
border-color: $bar-primary-border-color; border-color: $bar-primary-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
&.bar-info { &.bar-info {
background-color: $bar-info-bg; background-color: $bar-info-bg;
border-color: $bar-info-border-color; border-color: $bar-info-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
&.bar-success { &.bar-success {
background-color: $bar-success-bg; background-color: $bar-success-bg;
border-color: $bar-success-border-color; border-color: $bar-success-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
&.bar-warning { &.bar-warning {
background-color: $bar-warning-bg; background-color: $bar-warning-bg;
border-color: $bar-warning-border-color; border-color: $bar-warning-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
&.bar-danger { &.bar-danger {
background-color: $bar-danger-bg; background-color: $bar-danger-bg;
border-color: $bar-danger-border-color; border-color: $bar-danger-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
&.bar-dark { &.bar-dark {
background-color: $bar-dark-bg; background-color: $bar-dark-bg;
border-color: $bar-dark-border-color; border-color: $bar-dark-border-color;
color: $gray-light; color: $white;
.tab-item a { .tab-item a {
color: $gray-light; color: $white;
} }
} }
@ -101,33 +101,33 @@
.bar-primary { .bar-primary {
.button { .button {
@include button-style($button-primary-bg, $button-primary-border, $gray-light); @include button-style($button-primary-bg, $button-primary-border, $white);
} }
} }
.bar-info { .bar-info {
.button { .button {
@include button-style($button-info-bg, $button-info-border, $gray-light); @include button-style($button-info-bg, $button-info-border, $white);
} }
} }
.bar-success { .bar-success {
.button { .button {
@include button-style($button-success-bg, $button-success-border, $gray-light); @include button-style($button-success-bg, $button-success-border, $white);
} }
} }
.bar-warning { .bar-warning {
.button { .button {
@include button-style($button-warning-bg, $button-warning-border, $gray-light); @include button-style($button-warning-bg, $button-warning-border, $white);
} }
} }
.bar-danger { .bar-danger {
.button { .button {
@include button-style($button-danger-bg, $buttonDangerBorder, $gray-light); @include button-style($button-danger-bg, $buttonDangerBorder, $white);
} }
} }
.bar-dark { .bar-dark {
// A default style for buttons // A default style for buttons
.button { .button {
@include button-style($button-dark-bg, $button-dark-border, $gray-light); @include button-style($button-dark-bg, $button-dark-border, $white);
} }
} }

12
scss/ionic/theme/_button.scss
View File

@ -13,22 +13,22 @@
@include button-style($button-secondary-bg, $button-secondary-border, $gray-dark); @include button-style($button-secondary-bg, $button-secondary-border, $gray-dark);
} }
&.button-primary { &.button-primary {
@include button-style($button-primary-bg, $button-primary-border, $gray-light); @include button-style($button-primary-bg, $button-primary-border, $white);
} }
&.button-info { &.button-info {
@include button-style($button-info-bg, $button-info-border, $gray-light); @include button-style($button-info-bg, $button-info-border, $white);
} }
&.button-success { &.button-success {
@include button-style($button-success-bg, $button-success-border, $gray-light); @include button-style($button-success-bg, $button-success-border, $white);
} }
&.button-warning { &.button-warning {
@include button-style($button-warning-bg, $button-warning-border, $gray-light); @include button-style($button-warning-bg, $button-warning-border, $white);
} }
&.button-danger { &.button-danger {
@include button-style($button-danger-bg, $buttonDangerBorder, $gray-light); @include button-style($button-danger-bg, $buttonDangerBorder, $white);
} }
&.button-dark { &.button-dark {
@include button-style($button-dark-bg, $button-dark-border, $gray-light); @include button-style($button-dark-bg, $button-dark-border, $white);
} }
&.button-clear { &.button-clear {