ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-04-16 15:29:20 +00:00
Code Issues Actions 1 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
Show Stats 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;

3
platform/features/timeline/bundle.js
View File

@ -312,7 +312,8 @@ define([
"dialog": {
"control": "selector",
"name": "Modes",
"type": "mode"
"type": "mode",
"layout": "controls-under"
},
"property": "modes"
},

2
platform/forms/res/templates/form.html
View File

@ -33,7 +33,7 @@
invalid: mctFormInner.$dirty && !mctFormInner.$valid,
first: $index < 1,
'l-controls-first': row.layout === 'control-first',
'l-input-sm': row.inputsize === 'sm'
'l-controls-under': row.layout === 'controls-under'
}">
<div class='label flex-elem' title="{{row.description}}">
{{row.name}}