[Frontend] Styles for tabular views and view sections

Original issue: https://github.jpl.nasa.gov/MissionControl/vista/issues/30

New CSS and symbols to support tabular views;
Required by JPL branch vista30 (https://github.jpl.nasa.gov/MissionControl/vista/tree/vista30)
This commit is contained in:
Charles Hacskaylo
2015-08-17 15:11:27 -07:00
parent 9ab06cfdd2
commit 366ec3d516
18 changed files with 605 additions and 435 deletions

View File

@@ -259,6 +259,38 @@
@include text-shadow(rgba(black, $sVal) 0 3px 7px);
}
/*********************************************** FORM ELEMENTS */
@mixin input-base($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include appearance(none);
@include border-radius($controlCr);
@include box-sizing(border-box);
@include box-shadow(inset rgba(black, 0.65) 0 1px 4px);
// background: lighten($bg, 20%);
background: rgba(#fff, 0.1);
border: none;
//border-bottom: 1px solid rgba(#fff, 0.1);
color: lighten($fg, 20%);
outline: none;
&.error {
background: rgba(red, 0.5);
}
}
@mixin nice-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include input-base($bg, $fg);
padding: 0 $interiorMarginSm;
}
@mixin nice-textarea($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include input-base($bg, $fg);
padding: $interiorMargin;
}
@mixin subdued-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include nice-input($bg, $fg);
background: lighten($bg, 3%);
border-bottom: 1px solid lighten($bg, 10%);
}
/*
@mixin invokeMenu($baseColor: $colorBodyFg) {