4db48afab0
open #95 Mostly about the overlay and forms; Buttons, menus, selects tweaks continued; Initial check and tweaks in mobile;
106 lines
3.3 KiB
SCSS
106 lines
3.3 KiB
SCSS
$basicCr: 4px;
|
|
$controlCr: $basicCr;
|
|
/************************** COLORS AND SHADING */
|
|
$colorBodyBg: #efefef;
|
|
$colorGenBg: #fff; // NEW
|
|
$colorBodyFg: #666;
|
|
$colorFooterBg: #000;
|
|
$colorKey: #0099cc;
|
|
$colorKeySelectedBg: $colorKey;
|
|
$colorKeyFg: #fff;
|
|
$colorInteriorBorder: rgba($colorBodyFg, 0.2);
|
|
$contrastRatioPercent: 30%;
|
|
|
|
// Buttons
|
|
$colorBtnBg: pullForward($colorBodyBg, $contrastRatioPercent);
|
|
$colorBtnFg: #fff;
|
|
$colorBtnMajorBg: $colorKey;
|
|
$colorBtnMajorFg: $colorKeyFg;
|
|
$colorBtnIcon: $colorBtnFg;
|
|
$colorInvokeMenu: #000;
|
|
$contrastInvokeMenuPercent: 50%;
|
|
|
|
$colorAlt1: #ff6600;
|
|
$colorAlert: #ff3c00;
|
|
$colorIconLink: #49dedb;
|
|
$colorPausedBg: #c56f01;
|
|
$colorPausedFg: #fff;
|
|
$colorCreateBtn: $colorKey;
|
|
$colorGridLines: rgba(#fff, 0.05);
|
|
$colorInvokeMenu: #fff;
|
|
// Menu colors
|
|
$colorMenuBg: pushBack($colorBodyBg, 10%);
|
|
$colorMenuFg: pullForward($colorMenuBg, 70%);
|
|
$colorMenuIc: $colorKey;
|
|
$colorMenuHov: pullForward($colorMenuBg, 10%);
|
|
$colorCreateMenuLgIcon: $colorKey;
|
|
$colorCreateMenuText: $colorBodyFg;
|
|
$shdwMenu: rgba(black, 0.5) 0 1px 5px;
|
|
$shdwMenuText: none;
|
|
// Form colors
|
|
$colorCheck: $colorKey;
|
|
$colorFormRequired: $colorKey;
|
|
$colorFormValid: #33cc33;
|
|
$colorFormError: #cc0000;
|
|
$colorFormInvalid: #ff2200;
|
|
$colorFormLines: rgba(#fff, 0.1); // MOVED
|
|
$colorFormSectionHeader: rgba(#000, 0.1);
|
|
$colorInputBg: $colorGenBg;
|
|
$colorInputFg: $colorBodyFg;
|
|
$colorFormText: pushBack($colorBodyFg, 10%);
|
|
// Limits and staleness colors
|
|
$colorLimitYellow: #9d7500;
|
|
$colorLimitRed: #aa0000;
|
|
$colorTelemFresh: #fff;
|
|
$colorTelemStale: #888;
|
|
$styleTelemStale: italic;
|
|
// Bubble colors
|
|
$colorInfoBubbleFg: #666;
|
|
$colorInfoBubbleBg: #ddd;
|
|
$colorThumbsBubbleFg: lighten($colorBodyFg, 10%);
|
|
$colorThumbsBubbleBg: lighten($colorBodyBg, 10%);
|
|
// Overlay
|
|
$colorOvrBlocker: rgba(black, 0.7);//
|
|
$colorOvrBg: $colorBodyBg;
|
|
$colorOvrFg: $colorBodyFg;
|
|
$colorOvrBtnBg: pullForward($colorOvrBg, 40%);
|
|
$colorOvrBtnFg: #fff;
|
|
// Items
|
|
$colorItemBg: $colorBtnBg; //pullForward($colorBodyBg, 15%);
|
|
$colorItemFg: $colorBtnFg; //lighten($colorItemBg, 20%);
|
|
$colorItemFgDetails: darken($colorItemFg, 15%);
|
|
$colorItemIcon: $colorItemFg;
|
|
$colorItemSubIcons: $colorItemFgDetails;
|
|
$colorItemOpenIcon: $colorItemFgDetails;
|
|
$shdwItemText: none;
|
|
$colorItemBgSelected: $colorKey;
|
|
// Tabular
|
|
$tabularColorBorder: rgba(white, 0.1);
|
|
$tabularColorBodyBg: darken($colorBodyBg, 10%);
|
|
$tabularColorBodyFg: lighten($tabularColorBodyBg, 40%);
|
|
$tabularColorHeaderBg: lighten($colorBodyBg, 10%);
|
|
$tabularColorHeaderFg: lighten($tabularColorHeaderBg, 40%);
|
|
$tabularColorHeaderBorder: $colorBodyBg;
|
|
// Tree
|
|
$colorItemTreeIcon: $colorKey;
|
|
$colorItemTreeIconHover: $colorItemTreeIcon; //pushBack($colorItemTreeIcon, 20%);
|
|
$colorItemTreeVCHover: $colorKey;
|
|
$colorItemTreeFg: $colorBodyFg;
|
|
$colorItemTreeSelectedBg: pushBack($colorKey, 15%);
|
|
$colorItemTreeSelectedFg: $colorBodyBg;
|
|
$colorItemTreeVC: $colorBodyFg;
|
|
$colorItemTreeSelectedVC: $colorBodyBg;
|
|
$shdwItemTreeIcon: none;
|
|
// Scrollbar
|
|
$scrollbarTrackSize: 10px;
|
|
$scrollbarTrackColorBg: rgba(#000, 0.5);
|
|
$scrollbarThumbColor: darken($colorBodyBg, 25%);//
|
|
$scrollbarThumbColorHov: $colorKey;
|
|
// Splitter
|
|
$splitterShdw: none;
|
|
$colorSplitterInterior: $colorBodyBg;
|
|
$colorSplitterHover: $colorKey;
|
|
$colorGrippyInteriorHover: $colorBodyBg;
|
|
|
|
/********************************* MOBILE */
|
|
$colorMobilePaneLeft: darken($colorBodyBg, 2%); |