Namespace all palette css

This commit is contained in:
Nick O'Leary
2019-04-29 22:38:14 +01:00
parent 10c818474c
commit a2632fdcc8
27 changed files with 192 additions and 202 deletions

View File

@@ -253,16 +253,16 @@
background-size: contain;
position: relative;
.palette_icon {
.red-ui-palette-icon {
background-position: 49% 50%;
width: 15px;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
position: relative;
top: -2.5px;
left: 0px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
}
@@ -410,10 +410,10 @@
width: 18px;
height: 15px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
.palette_icon {
.red-ui-palette-icon {
width: 15px;
}
ul,li,ol {

View File

@@ -57,7 +57,7 @@
.editor-tray-content {
overflow: auto;
position: relative;
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 4px;
}
@@ -154,7 +154,7 @@
background: $background-color;
color: $workspace-button-color;
}
#palette-shade, #editor-shade, #header-shade, #sidebar-shade {
#red-ui-palette-shade, #editor-shade, #header-shade, #sidebar-shade {
@include shade;
z-index: 2;
}
@@ -443,7 +443,7 @@
border-color: white;
}
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 3px;
}

View File

@@ -15,7 +15,7 @@
**/
#palette {
#red-ui-palette{
position: absolute;
top: 0px;
bottom: 0px;
@@ -28,29 +28,18 @@
transition: width 0.2s ease-in-out;
}
.palette-closed {
#palette { width: 8px; }
#palette-search { display: none; }
#palette-container { display: none; }
#palette-footer { display: none; }
}
.palette-expanded {
& #palette {
width: 380px;
box-shadow: 1px 0 6px rgba(0,0,0,0.1);
.red-ui-palette-closed {
#red-ui-palette {
width: 8px;
.red-ui-component-footer {
display: none;
}
}
& #workspace { left: 379px !important; }
& #palette-collapse-all { display: none; }
& #palette-expand-all { display: none; }
& #palette-container { display: none !important; }
& #palette-search { display: none !important; }
& #palette-edit { background: $workspace-button-background-active }
& #palette-editor { display: block !important }
#red-ui-palette-search { display: none; }
#red-ui-palette-container { display: none; }
}
.palette-scroll {
.red-ui-palette-scroll {
position: absolute;
top: 35px;
right: 0;
@@ -60,10 +49,10 @@
overflow-y: auto;
box-sizing:border-box;
}
#palette > .palette-spinner {
#red-ui-palette> .red-ui-palette-spinner {
padding-top: 80px;
}
.palette-search {
.red-ui-palette-search {
position: relative;
overflow: hidden;
background: #ffffff;
@@ -74,15 +63,15 @@
box-sizing:border-box;
}
.palette-category {
.red-ui-palette-category {
border-bottom: 1px solid #ccc;
}
.palette-content {
.red-ui-palette-content {
background: #fff;
padding: 3px;
}
.palette-header {
.red-ui-palette-header {
position: relative;
background: $palette-header-background;
cursor: pointer;
@@ -96,7 +85,7 @@
background: $palette-header-background !important;
}
}
.palette-header > i {
.red-ui-palette-header > i {
position: absolute;
left: 11px;
top: 12px;
@@ -107,15 +96,15 @@
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
}
.palette-header i.expanded {
.red-ui-palette-header i.expanded {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
}
.palette-header span {
.red-ui-palette-header span {
clear: both;
}
.palette_label {
.red-ui-palette-label {
font-size: 13px;
margin: 4px 0 4px 32px;
line-height: 20px;
@@ -123,11 +112,11 @@
text-align: center;
@include disable-selection;
}
.palette_label_right {
.red-ui-palette-label-right {
margin: 4px 32px 4px 0;
}
.palette_node {
.red-ui-palette-node {
display: block;
cursor:move;
background: #ddd;
@@ -141,11 +130,11 @@
background-size: contain;
position: relative;
}
.palette_node:hover {
.red-ui-palette-node:hover {
border-color: $node-selected-color;
background-color: #eee;
}
.palette_port {
.red-ui-palette-port {
position: absolute;
top:8px;
left: -5px;
@@ -157,16 +146,16 @@
height: 10px;
border: 1px solid #999;
}
.palette_port_output {
.red-ui-palette-port-output {
left:auto;
right: -6px;
}
.palette_node:hover .palette_port {
.red-ui-palette-node:hover .red-ui-palette-port {
border-color: #999;
background-color: #eee;
}
.palette_icon_container {
.red-ui-palette-icon-container {
position: absolute;
text-align: center;
top:0;
@@ -176,13 +165,13 @@
border-right: 1px solid rgba(0,0,0,0.1);
background-color: rgba(0,0,0,0.05);
}
.palette_icon_container_right {
.red-ui-palette-icon-container-right {
left: auto;
right: 0;
border-right: none;
border-left: 1px solid rgba(0,0,0,0.1);
}
.palette_icon {
.red-ui-palette-icon {
display: inline-block;
width: 20px;
height: 100%;
@@ -190,13 +179,13 @@
background-size: contain;
background-repeat: no-repeat;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
color: white;
position: absolute;
top: 7px;
left: 3px;
}
.palette_node_small {
.red-ui-palette-node-small {
display: inline-block;
position: relative;
width: 18px;
@@ -205,15 +194,15 @@
vertical-align: middle;
cursor: default;
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
border-right: none;
}
.palette_icon {
.red-ui-palette-icon {
margin-left: -1px;
width: 15px;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 2px;
left: 1px;
}

View File

@@ -283,7 +283,7 @@
right: 0;
overflow: hidden;
.palette-category {
.red-ui-palette-category {
&:not(.palette-category-expanded) button {
display: none;
}

View File

@@ -62,7 +62,7 @@
font-size: 13px;
border-left-width: 3px;
border-right-width: 3px;
.palette_icon_fa {
.red-ui-palette-icon-fa {
position: relative;
top: -2.5px;
left: 0px;
@@ -91,10 +91,10 @@
.red-ui-search-result-node-output{
left: 16px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
.palette_icon {
.red-ui-palette-icon {
width: 15px;
}
.red-ui-search-result-description {
@@ -150,7 +150,7 @@
display: table;
clear: both;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 3px;
}
@@ -169,7 +169,7 @@
background-size: contain;
position: relative;
.palette_icon_container {
.red-ui-palette-icon-container {
border-right: none;
}

View File

@@ -25,7 +25,7 @@
.config-node-list {
margin: 0;
list-style-type: none;
.palette_node {
.red-ui-palette-node {
overflow: hidden;
&.selected {
border-color: $node-selected-color;
@@ -40,7 +40,7 @@
overflow: hidden;
text-overflow: ellipsis;
}
.palette_icon_container {
.red-ui-palette-icon-container {
font-size: 12px;
line-height: 30px;
background-color: #e8e8e8;

View File

@@ -22,7 +22,7 @@
right: 0;
overflow-y: scroll;
.palette-category {
.red-ui-palette-category {
&:not(.palette-category-expanded) button {
display: none;
}

View File

@@ -16,7 +16,7 @@
.red-ui-stack {
background: white;
.palette-category {
.red-ui-palette-category {
background: white;
&:last-child {

View File

@@ -44,7 +44,7 @@
}
.palette-closed #workspace {
.red-ui-palette-closed #workspace {
left: 7px;
}