openmct/platform/commonUI/general/res/sass/_constants.scss

/*****************************************************************************
 * Open MCT Web, Copyright (c) 2014-2015, United States Government
 * as represented by the Administrator of the National Aeronautics and Space
 * Administration. All rights reserved.
 *
 * Open MCT Web is licensed under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * http://www.apache.org/licenses/LICENSE-2.0.
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations
 * under the License.
 *
 * Open MCT Web includes source code licensed under additional open source
 * licenses. See the Open Source Licenses file (LICENSES.md) included with
 * this source code distribution or the Licensing information page available
 * at runtime from the About dialog for additional information.
 *****************************************************************************/
// Margins, spacing, radii
$bodyMargin: 10px;
$interiorMargin: 5px;
$interiorMarginLg: $interiorMargin * 2;
$interiorMarginSm: 3px;
$basicCr: 3px;
$controlCr: $basicCr;
$smallCr: 2px;
$badgeW: 35px;

// Colors and shading
$colorBodyBg: #333;
$colorBodyFg: #999;
$colorFooterBg: #000;
$colorKey: #0099cc;
$colorKeyFg: #fff;
$colorAlt1: #ffc700;
$colorAlert: #ff3c00;
$colorCheck: $colorKey;
$colorCreateBtn: $colorKey;
$colorInteriorBorder: lighten($colorBodyBg, 10%);
$colorObjFrameBg: darken($colorBodyBg, 5%);
$colorFormRequired: #ffc700;
$colorFormValid: #33cc33;
$colorFormError: #cc0000;
$colorFormInvalid: #ff9900;
$colorGridLines: rgba(#fff, 0.05);
$colorLimitYellow: #9d7500;
$colorLimitRed: #aa0000;
$colorTelemFresh: #fff;
$colorTelemStale: #888;
$styleTelemState: italic;

// Ratios
$ltGamma: 20%;
$btnFontSizeToH: 0.45;

// User Environment
$ueTopBarH: 30px; // Change to 45px when breadcrumb is enabled
$ueTopBarEditH: 30px;
$ueTopBarBtnH: 35px;
$ueFooterH: 20px;
$ueColMargin: 1.5%;
$ueAppLogoW: 105px;
//$ueBrowseViewBarH: $ueTopBarH; // was 30px
$ueEditToolBarH: 25px;
$ueBrowseLeftPaneW: 25%;
$ueEditLeftPaneW: 75%;

// Overlay
$colorOvrBlocker: rgba(black, 0.7);
$colorOvrBg: $colorBodyBg;
$colorOvrFg: $colorBodyFg;
$ovrTopBarH: 60px;
$ovrFooterH: 40px;

//Items
$ueBrowseGridItemLg: 200px;
$ueBrowseGridItemTopBarH: 20px;
$ueBrowseGridItemBottomBarH: 40px;
$colorItemBase: lighten($colorBodyBg, 5%);
$colorItemFg: lighten($colorItemBase, 20%);
$colorItemSelected: $colorKey;
$itemPadLR: 5px;

// Tree
$treeVCW: 10px;
$treeTypeIconW: 20px;
$treeContextTriggerW: 20px;
$colorItemTreeIcon: $colorKey;
$colorItemTreeIconHover: lighten($colorItemTreeIcon, 20%);
$colorItemTreeVCHover: $colorAlt1;

//Tabular
$tabularHeaderH: 18px;
$tabularTdPadLR: $itemPadLR;
$tabularTdPadTB: 2px;
$tabularColorBorder: rgba(white, 0.1);
$tabularColorBodyBg: darken($colorBodyBg, 10%);
$tabularColorBodyFg: lighten($tabularColorBodyBg, 40%);
$tabularColorHeaderBg: lighten($colorBodyBg, 10%);
$tabularColorHeaderFg: lighten($tabularColorHeaderBg, 40%);

// Controls
$controlCr: $basicCr;
$controlDisabledOpacity: 0.3;
$formLabelW: 20%;
$formInputH: 22px;
$formRowCtrlsH: 14px;
$menuLineH: 1.5rem;
$scrollbarTrackSize: 10px;
$scrollbarTrackColorBg: rgba(#000, 0.4);
$btnStdH: 25px;
$btnToolbarH: $btnStdH;

// Paths
$dirImgs: '../images/'; // Relative to platform/css/ directory

// Ticks
$ticksH: 25px;
$tickLblVMargin: 3px;
$tickLblH: 15px;
$tickLblW: 50px;
$tickH: $ticksH - $tickLblVMargin - $tickLblH;
$tickW: 1px;