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

component defaults based off of light or stable

Browse Source
This commit is contained in:
Adam Bradley
2013-11-13 11:52:57 -06:00
parent 08372e7eaf
commit 5516e70f30
3 changed files with 40 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
dist/css/ionic.css vendored
View File

@ -2620,14 +2620,14 @@ a.subdued‎ {
border-width: 0; border-width: 0;
border-style: solid; border-style: solid;
border-top: 1px solid transparent; border-top: 1px solid transparent;
border-bottom: 1px solid #444444; border-bottom: 1px solid #b2b2b2;
background-color: white; background-color: white;
background-size: 0; } background-size: 0; }
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) { @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
.bar { .bar {
border-top: none !important; border-top: none !important;
border-bottom: none !important; border-bottom: none !important;
background-image: linear-gradient(0deg, #444444, #444444 50%, transparent 50%); background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%);
background-position: bottom; background-position: bottom;
background-size: 100% 1px; background-size: 100% 1px;
background-repeat: no-repeat; } } background-repeat: no-repeat; } }
@ -4354,7 +4354,7 @@ input[type="range"] {
border-radius: 2px; border-radius: 2px;
color: #444444; color: #444444;
background-color: #f8f8f8; background-color: #f8f8f8;
border-color: #d2d2d2; border-color: #bbbbbb;
vertical-align: top; vertical-align: top;
text-align: center; text-align: center;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -4365,9 +4365,9 @@ input[type="range"] {
color: #444444; color: #444444;
text-decoration: none; } text-decoration: none; }
.button.active, .button:active { .button.active, .button:active {
background-color: white; background-color: #222222;
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.15); box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.15);
border-color: #b8b8b8; } border-color: black; }
.button .icon { .button .icon {
display: inline-block; display: inline-block;
padding: 0 0 1px 0; padding: 0 0 1px 0;

20
scss/_tabs.scss
View File

@ -9,7 +9,7 @@
@include display-flex(); @include display-flex();
@include flex-direction(horizontal); @include flex-direction(horizontal);
@include tab-style($tabs-default-bg, $tabs-default-border-color, $tabs-default-text); @include tab-style($tabs-default-bg, $tabs-default-border, $tabs-default-text);
position: absolute; position: absolute;
bottom: 0; bottom: 0;
z-index: 5; z-index: 5;
@ -23,31 +23,31 @@
line-height: $tabs-height; line-height: $tabs-height;
&.tabs-light { &.tabs-light {
@include tab-style($tabs-light-bg, $tabs-light-border-color, $tabs-light-text); @include tab-style($tabs-light-bg, $tabs-light-border, $tabs-light-text);
} }
&.tabs-stable { &.tabs-stable {
@include tab-style($tabs-stable-bg, $tabs-stable-border-color, $tabs-stable-text); @include tab-style($tabs-stable-bg, $tabs-stable-border, $tabs-stable-text);
} }
&.tabs-positive { &.tabs-positive {
@include tab-style($tabs-positive-bg, $tabs-positive-border-color, $tabs-positive-text); @include tab-style($tabs-positive-bg, $tabs-positive-border, $tabs-positive-text);
} }
&.tabs-calm { &.tabs-calm {
@include tab-style($tabs-calm-bg, $tabs-calm-border-color, $tabs-calm-text); @include tab-style($tabs-calm-bg, $tabs-calm-border, $tabs-calm-text);
} }
&.tabs-assertive { &.tabs-assertive {
@include tab-style($tabs-assertive-bg, $tabs-assertive-border-color, $tabs-assertive-text); @include tab-style($tabs-assertive-bg, $tabs-assertive-border, $tabs-assertive-text);
} }
&.tabs-balanced { &.tabs-balanced {
@include tab-style($tabs-balanced-bg, $tabs-balanced-border-color, $tabs-balanced-text); @include tab-style($tabs-balanced-bg, $tabs-balanced-border, $tabs-balanced-text);
} }
&.tabs-energized { &.tabs-energized {
@include tab-style($tabs-energized-bg, $tabs-energized-border-color, $tabs-energized-text); @include tab-style($tabs-energized-bg, $tabs-energized-border, $tabs-energized-text);
} }
&.tabs-royal { &.tabs-royal {
@include tab-style($tabs-royal-bg, $tabs-royal-border-color, $tabs-royal-text); @include tab-style($tabs-royal-bg, $tabs-royal-border, $tabs-royal-text);
} }
&.tabs-dark { &.tabs-dark {
@include tab-style($tabs-dark-bg, $tabs-dark-border-color, $tabs-dark-text); @include tab-style($tabs-dark-bg, $tabs-dark-border, $tabs-dark-text);
} }
@media (min--moz-device-pixel-ratio: 1.5), @media (min--moz-device-pixel-ratio: 1.5),
(-webkit-min-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5),

50
scss/_variables.scss
View File

@ -162,12 +162,6 @@ $button-bar-button-height: 32px;
$button-bar-button-padding: 8px !default; $button-bar-button-padding: 8px !default;
$button-bar-button-icon-size: 24px; $button-bar-button-icon-size: 24px;
$button-default-bg: $stable;
$button-default-text: #444;
$button-default-border: darken($stable, 15%);
$button-default-active-bg: lighten($stable, 5%);
$button-default-active-border: darken($stable, 25%);
$button-light-bg: $light; $button-light-bg: $light;
$button-light-text: #444; $button-light-text: #444;
$button-light-border: #B2B2B2; $button-light-border: #B2B2B2;
@ -222,6 +216,12 @@ $button-dark-border: #444;
$button-dark-active-bg: #222; $button-dark-active-bg: #222;
$button-dark-active-border: #000; $button-dark-active-border: #000;
$button-default-bg: $button-stable-bg;
$button-default-text: $button-stable-text;
$button-default-border: $button-stable-border;
$button-default-active-bg: $button-stable-active-bg;
$button-default-active-border: $button-stable-active-border;
// Bars // Bars
// ------------------------------- // -------------------------------
@ -232,12 +232,6 @@ $bar-padding-portrait: 5px;
$bar-padding-landscape: 5px; $bar-padding-landscape: 5px;
$bar-transparency: 1; $bar-transparency: 1;
$bar-default-bg: #fff;
$bar-default-text: #444;
$bar-default-border: #444;
$bar-default-active-bg: #fff;
$bar-default-active-border: #444;
$bar-light-bg: rgba($button-light-bg, $bar-transparency); $bar-light-bg: rgba($button-light-bg, $bar-transparency);
$bar-light-text: $button-light-text; $bar-light-text: $button-light-text;
$bar-light-border: $button-light-border; $bar-light-border: $button-light-border;
@ -292,6 +286,12 @@ $bar-dark-border: $button-dark-border;
$bar-dark-active-bg: $button-dark-active-bg; $bar-dark-active-bg: $button-dark-active-bg;
$bar-dark-active-border: $button-dark-active-border; $bar-dark-active-border: $button-dark-active-border;
$bar-default-bg: $bar-light-bg;
$bar-default-text: $bar-light-text;
$bar-default-border: $bar-light-border;
$bar-default-active-bg: $bar-light-active-bg;
$bar-default-active-border: $bar-light-active-border;
// Tabs // Tabs
// ------------------------------- // -------------------------------
@ -301,46 +301,46 @@ $tabs-text-font-size: 14px !default;
$tabs-text-with-icon-font-size: 10px !default; $tabs-text-with-icon-font-size: 10px !default;
$tabs-icon-size: 32px !default; $tabs-icon-size: 32px !default;
$tabs-default-bg: $button-stable-bg;
$tabs-default-border-color: $button-stable-border;
$tabs-default-text: $button-stable-text;
$tabs-light-bg: $button-light-bg; $tabs-light-bg: $button-light-bg;
$tabs-light-border-color: $button-light-border; $tabs-light-border: $button-light-border;
$tabs-light-text: $button-light-text; $tabs-light-text: $button-light-text;
$tabs-stable-bg: $button-stable-bg; $tabs-stable-bg: $button-stable-bg;
$tabs-stable-border-color: $button-stable-border; $tabs-stable-border: $button-stable-border;
$tabs-stable-text: $button-stable-text; $tabs-stable-text: $button-stable-text;
$tabs-positive-bg: $button-positive-bg; $tabs-positive-bg: $button-positive-bg;
$tabs-positive-border-color: $button-positive-border; $tabs-positive-border: $button-positive-border;
$tabs-positive-text: $button-positive-text; $tabs-positive-text: $button-positive-text;
$tabs-calm-bg: $button-calm-bg; $tabs-calm-bg: $button-calm-bg;
$tabs-calm-border-color: $button-calm-border; $tabs-calm-border: $button-calm-border;
$tabs-calm-text: $button-calm-text; $tabs-calm-text: $button-calm-text;
$tabs-assertive-bg: $button-assertive-bg; $tabs-assertive-bg: $button-assertive-bg;
$tabs-assertive-border-color: $button-assertive-border; $tabs-assertive-border: $button-assertive-border;
$tabs-assertive-text: $button-assertive-text; $tabs-assertive-text: $button-assertive-text;
$tabs-balanced-bg: $button-balanced-bg; $tabs-balanced-bg: $button-balanced-bg;
$tabs-balanced-border-color: $button-balanced-border; $tabs-balanced-border: $button-balanced-border;
$tabs-balanced-text: $button-balanced-text; $tabs-balanced-text: $button-balanced-text;
$tabs-energized-bg: $button-energized-bg; $tabs-energized-bg: $button-energized-bg;
$tabs-energized-border-color: $button-energized-border; $tabs-energized-border: $button-energized-border;
$tabs-energized-text: $button-energized-text; $tabs-energized-text: $button-energized-text;
$tabs-royal-bg: $button-royal-bg; $tabs-royal-bg: $button-royal-bg;
$tabs-royal-border-color: $button-royal-border; $tabs-royal-border: $button-royal-border;
$tabs-royal-text: $button-royal-text; $tabs-royal-text: $button-royal-text;
$tabs-dark-bg: $button-dark-bg; $tabs-dark-bg: $button-dark-bg;
$tabs-dark-border-color: $button-dark-border; $tabs-dark-border: $button-dark-border;
$tabs-dark-text: $button-dark-text; $tabs-dark-text: $button-dark-text;
$tabs-default-bg: $tabs-stable-bg;
$tabs-default-border: $tabs-stable-border;
$tabs-default-text: $tabs-stable-text;
// Lists // Lists
// ------------------------------- // -------------------------------