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

[Frontend] Form styling

Browse Source 
#772
Added ".l-controls-under" styling to allow
channel-selector layout;
Added new hint color constants and refined
style defs;
This commit is contained in:
Charles Hacskaylo
2016-03-21 11:13:43 -07:00
parent 90c82f6ef2
commit aa48044345
6 changed files with 17 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
platform/commonUI/general/res/sass/forms/_elems.scss
View File

@@ -87,9 +87,7 @@
}
}
.field-hints {
color: darken($colorBodyFg, 20%);
}
.hint, .field-hints { color: $colorFieldHint; }
.selector-list {
// Used in create overlay to display tree view
@@ -130,6 +128,14 @@
}
}
.l-controls-under.l-flex-row {
// Change to use column layout
@include flex-direction(column);
.flex-elem {
margin-bottom: $interiorMarginLg;
}
}
.no-validate {
.form .form-row >.label {
padding-right: 0;

4
platform/commonUI/general/res/sass/overlay/_overlay.scss
View File

@@ -65,9 +65,7 @@
margin-bottom: $interiorMargin;
}
.hint {
color: pushBack($colorOvrFg, 20%);
}
.hint, .field-hints { color: $colorFieldHintOverlay !important; }
.abs.top-bar {
height: $ovrTopBarH;

2
platform/commonUI/themes/espresso/res/sass/_constants.scss
View File

@@ -77,6 +77,7 @@ $colorInputBg: rgba(#000, 0.1);
$colorInputFg: pullForward($colorBodyFg, 20%);
$colorFormText: rgba(#fff, 0.5);
$colorInputIcon: pushBack($colorBodyFg, 15%);
$colorFieldHint: pullForward($colorBodyFg, 20%);
// Inspector
$colorInspectorBg: pullForward($colorBodyBg, 3%);
@@ -125,6 +126,7 @@ $colorOvrBg: pullForward($colorBodyBg, 10%);
$colorOvrFg: pullForward($colorBodyFg, 30%);
$colorOvrBtnBg: pullForward($colorOvrBg, 20%);
$colorOvrBtnFg: #fff;
$colorFieldHintOverlay: pullForward($colorOvrBg, 30%);
// Items
$colorItemBg: lighten($colorBodyBg, 5%);

2
platform/commonUI/themes/snow/res/sass/_constants.scss
View File

@@ -77,6 +77,7 @@ $colorInputBg: $colorGenBg;
$colorInputFg: $colorBodyFg;
$colorFormText: pushBack($colorBodyFg, 10%);
$colorInputIcon: pushBack($colorBodyFg, 25%);
$colorFieldHint: pullForward($colorBodyFg, 40%);
// Inspector
$colorInspectorBg: pullForward($colorBodyBg, 5%);
@@ -125,6 +126,7 @@ $colorOvrBg: $colorBodyBg;
$colorOvrFg: $colorBodyFg;
$colorOvrBtnBg: pullForward($colorOvrBg, 40%);
$colorOvrBtnFg: #fff;
$colorFieldHintOverlay: pullForward($colorOvrBg, 40%);
// Items
$colorItemBg: #ddd;