[BUG #7608] qx.Mobile Custom theme should be adjustable to flat appea…

…rance * List active gradient is now adjustable
qooxdoo · Jul 31, 2013 · aa1911a · aa1911a
1 parent e905646
commit aa1911a
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 11 deletions.
diff --git a/framework/source/resource/qx/mobile/css/indigo.css b/framework/source/resource/qx/mobile/css/indigo.css
@@ -1566,7 +1566,7 @@ input, .text-area {
   display: none; }
 
 .tabBar {
-  border-bottom: 3px solid #23457d;
+  border-bottom: 3px solid #3d72c9;
   padding-top: 4px;
   padding-left: 4px;
   padding-right: 4px; }
@@ -1594,12 +1594,12 @@ input, .text-area {
   margin-left: 4px; }
 
 .tabButton.active, .tabButton.selected {
-  background-image: -webkit-gradient(linear, center top, center bottom, from(#8dacdf), to(#23457d));
-  background-image: -webkit-linear-gradient(top, #8dacdf, #23457d);
-  background-image: -moz-linear-gradient(top, #8dacdf, #23457d);
-  background-image: -ms-linear-gradient(top, #8dacdf, #23457d);
-  background-image: linear-gradient(to bottom, #8dacdf, #23457d);
-  border: 1px solid #3d72c9;
+  background-image: -webkit-gradient(linear, center top, center bottom, from(#8dacdf), to(#3d72c9));
+  background-image: -webkit-linear-gradient(top, #8dacdf, #3d72c9);
+  background-image: -moz-linear-gradient(top, #8dacdf, #3d72c9);
+  background-image: -ms-linear-gradient(top, #8dacdf, #3d72c9);
+  background-image: linear-gradient(to bottom, #8dacdf, #3d72c9);
+  border: 1px solid #8dacdf;
   border-bottom: 0px solid transparent; }
 
 .slider {

diff --git a/framework/source/resource/qx/mobile/scss/theme/_styles.scss b/framework/source/resource/qx/mobile/scss/theme/_styles.scss
@@ -53,7 +53,8 @@ $list-background-color: white;
 $list-title-text-color: #333333;
 $list-subtitle-text-color:  #3D72C9;
 $list-border-color: #DDDDDD;
-$list-active-background-color:  #3D72C9;
+$list-active-background-color:  lighten(#3D72C9, 20%);
+$list-active-background-color-2:  darken($list-active-background-color, 20%);
 $list-active-text-color:  white;
 $list-border-radius:  4px;
 $list-arrow-size: 3px;
@@ -96,7 +97,7 @@ $radiobutton-background-inner-color: #45484d;
 
 $tabbar-height:  45px;
 $tabbar-active-background-color:  lighten(#3D72C9, 20%);
-$tabbar-active-background-color-2:  darken($tabbar-active-background-color, 40%);
+$tabbar-active-background-color-2:  darken($tabbar-active-background-color,  20%);
 $tabbar-active-border-color:  lighten($tabbar-active-background-color-2, 20%);
 $tabbar-inactive-background-color:  lighten(#808080, 5%);
 $tabbar-inactive-background-color-2:  darken($tabbar-inactive-background-color, 15%);

diff --git a/framework/source/resource/qx/mobile/scss/theme/_theme.scss b/framework/source/resource/qx/mobile/scss/theme/_theme.scss
@@ -216,7 +216,7 @@ input, .text-area {
 }
 
 .list .list-item.active {
-  @include gradient-vertical(lighten($list-active-background-color, 20%), $list-active-background-color);
+  @include gradient-vertical($list-active-background-color, $list-active-background-color-2);
 }
 
 .list-item:first-child, .list-item:first-child a {
@@ -617,7 +617,7 @@ $arrow-size: 12px;
 }
 
 .selectbox-selected {
-  @include gradient-vertical(lighten($list-active-background-color, 20%), $list-active-background-color);
+  @include gradient-vertical($list-active-background-color, $list-active-background-color-2);
   color: $selectbox-item-selected-text-color !important;
 }