alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] IN-PROGRESS Theme changes continuing

Browse Source 
open #95
Mostly about the overlay and forms;
Buttons, menus, selects tweaks continued;
Initial check and tweaks in mobile;
This commit is contained in:
Charles Hacskaylo
2015-09-09 15:55:12 -07:00
parent 86deec6364
commit 4db48afab0
21 changed files with 1295 additions and 1430 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
platform/commonUI/general/res/sass/controls/_buttons.scss
View File

@@ -80,22 +80,24 @@ $pad: $interiorMargin * $baseRatio;
&.sm {
padding: 0 $pad / $baseRatio;
}
&.vsm {
padding: 0 ($pad / $baseRatio) / 2;
}
&:not(.major) {
@include btnSubtle($colorBtnBg, $colorBtnFg, $colorBtnIcon);
&.major {
$bg: $colorBtnMajorBg;
$hc: lighten($bg, 10%);
@include btnSubtle($bg, $hc, $colorBtnMajorFg, $colorBtnMajorFg);
}
&.major {
$bg: $colorKey;
$fg: lighten($bg, 70%);
@include btnSubtle($bg, $fg, $fg);
&:not(.major) {
// bg, bgHov, fg, ic
@include btnSubtle($colorBtnBg, $colorKey, $colorBtnFg, $colorBtnIcon);
}
&.paused {
@include btnSubtle($colorPausedBg, $colorPausedFg, $colorPausedFg);
@include btnSubtle($colorPausedBg, lighten($colorPausedBg, 10%), $colorPausedFg, $colorPausedFg);
.icon:before {
content: "\0000EF";
}

16
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@@ -349,18 +349,20 @@ label.checkbox.custom {
}
::-webkit-scrollbar-thumb {
$bg: lighten($colorBodyBg, 10%);
@include background-image(linear-gradient(lighten($bg, 10%), lighten($bg, 5%) 20px));
@include border-radius(1px);
$bg: $scrollbarThumbColor;
$hc: $scrollbarThumbColorHov;
$gr: 5%;
@include background-image(linear-gradient(lighten($bg, $gr), $bg 20px));
@include border-radius(2px);
@include box-sizing(border-box);
@include boxShdwSubtle();
border-top: 1px solid lighten($bg, 20%);
//@include boxShdwSubtle();
//border-top: 1px solid lighten($bg, 20%);
&:hover {
@include background-image(linear-gradient(lighten($bg, 20%), lighten($bg, 15%) 20px));
@include background-image(linear-gradient(lighten($hc, $gr), $hc 20px));
}
}
::-webkit-scrollbar-corner {
background: rgba(#000, 0.4);
background: $scrollbarTrackColorBg;
}
}

36
platform/commonUI/general/res/sass/controls/_menus.scss
View File

@@ -66,15 +66,18 @@
/******************************************************** MENUS THEMSELVES */
.menu-element {
$bg: lighten($colorBodyBg, 5%);
$bgHover: lighten($bg, 20%);
$bg: $colorMenuBg;
$fg: $colorMenuFg;
$ic: $colorMenuIc;
$bgHover: $colorMenuHov;
$iconColor: $colorKey;
cursor: pointer;
position: relative;
.menu {
@include border-radius($basicCr);
@include containerSubtle($bg);
@include txtShdwSubtle(0.2);
@include containerSubtle($bg, $fg);
@include boxShdw($shdwMenu);
@include txtShdw($shdwMenuText);
display: block; // set to block via jQuery
padding: $interiorMarginSm 0;
position: absolute;
@@ -84,7 +87,7 @@
li {
@include box-sizing(border-box);
border-top: 1px solid lighten($bg, 20%);
color: lighten($bg, 60%);
color: pullForward($bg, 60%);
line-height: $menuLineH;
padding: $interiorMarginSm $interiorMargin * 2 $interiorMarginSm ($interiorMargin * 2) + $treeTypeIconW;
position: relative;
@@ -95,17 +98,10 @@
&:hover {
background: $bgHover;
color: $colorKeyFg;
//a {
// color: $colorKeyFg;
//}
.icon {
color: lighten($iconColor, 20%);
}
}
//a {
// color: lighten($bg, 60%);
// display: block;
//}
.type-icon {
left: $interiorMargin * 2;
}
@@ -115,12 +111,7 @@
.context-menu,
.super-menu {
$bg: $colorMenuBg;
$fg: $colorMenuFg;
$ic: $colorMenuIc;
//font-size: 0.80rem;
pointer-events: auto;
@include containerSubtle($bg);
ul li {
padding-left: 25px;
a {
@@ -170,8 +161,7 @@
$h: $w - 20;
$plw: 50%; //$w * 0.5;
$prw: 50%; //$w - $plw;
$fg: #fff; //lighten($colorBodyFg, 40%);
$bgHover: $colorKey; //$bg;
//$fg: #fff; //lighten($colorBodyFg, 40%);
display: block;
width: $w;
height: $h;
@@ -203,15 +193,13 @@
right: 0;
padding: $interiorMargin * 5;
width: $prw;
.icon {
color: $fg;
}
}
}
.menu-item-description {
.desc-area {
&.icon {
$h: 150px;
color: $colorCreateMenuLgIcon;
position: relative;
font-size: 8em;
left: 0;
@@ -221,13 +209,13 @@
text-align: center;
}
&.title {
color: $fg;
color: $colorCreateMenuText;
font-size: 1.2em;
margin-bottom: 0.5em;
}
&.description {
//color: lighten($bg, 30%);
color: $fg;
color: $colorCreateMenuText;
font-size: 0.8em;
line-height: 1.5em;
}