node-red/editor/sass/workspace.scss

/**
 * Copyright 2015 IBM Corp.
 *
 * 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.
 **/


#chart {
   overflow: auto;
   background: #e3e3e3;
   position: absolute;
   bottom:25px;
   top: 35px;
   left:0px;
   right:0px;
   box-sizing:border-box;
   transition: right 0.2s ease;
}

#workspace.config-open {
    #chart {
        right: 190px;
    }
    #workspace-config-node-tray {
        right: 0px;
    }
    #workspace-toolbar {
        right: 190px;
    }
}


#chart svg:focus {
    outline: none;
}

#workspace {
    position: absolute;
    margin: 0;
    top:0px;
    left:179px;
    bottom: 0px;
    right: 322px;
    overflow: hidden;
    @include component-border;
}

.workspace-footer-button {
    @include component-footer-button;
}

#workspace-tabs {
    margin-right: 35px;
}

#workspace-add-tab {
    position: absolute;
    box-sizing: border-box;
    top: 0;
    right: 0;
    height: 35px;
    width: 35px;
    background: #fff;
    border-bottom: 1px solid $primary-border-color;
}

#btn-workspace-add-tab {
    @include workspace-button;
    line-height: 32px;
    height: 32px;
    width: 32px;
    margin-top: 3px;
    margin-right:3px;
    border: 1px solid $primary-border-color;
}

#workspace-footer {
    @include component-footer;
}

#workspace-config-node-tray {
    @include disable-selection;
    position: absolute;
    top: 35px;
    bottom:25px;
    right:-190px;
    width: 190px;
    border-left: 1px solid $secondary-border-color;
    box-sizing:border-box;
    background: #f3f3f3;
    transition: right 0.2s ease;
    overflow-y: auto;
}

.config-node-list {
    margin: 0;
    list-style-type: none;
}
.config_node {
    width: 160px;
    height: 30px;
    background: #f3f3f3;
    color: #666;
    cursor: pointer;

    .palette_label {
        margin-left: 8px;
        line-height: 24px;
        text-align: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .palette_icon_container {
        font-size: 12px;
        line-height: 30px;
        background-color: #e8e8e8;
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }
}
.config_node_type {
    color: #999;
    text-align: right;
    padding-right: 3px;
    &:not(:first-child) {
        margin-top: 20px;
    }
}
.config_node_none {
    color: #ddd;
    text-align:right;
    padding-right: 3px;
}
.config_node_unused {
    border-color: #aaa;
    background: #f9f9f9;
    border-style: dashed;
    color: #aaa;
}