1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
node-red/packages/node_modules/@node-red/editor-client/src/sass/base.scss
Nick O'Leary 880757fb5d
Rework Subflow Instance property UI (#2236)
* Add support of Subflow UI definition

* new UI definition for env var

* fix label

* fixed value obtaining

* fixed label width

* fix checkbox

* fix subflow info

* remove old subflow ui tests

* add tests

* merge ui new changes

* fix initial open button

* fix environment variable edit tab

* WIP: cp-1

* Rework subflow ui property

* Restrict SF value type according to input selection

* Move subflow property UI code to subflow.js

* Update subflow ui type select appearance

* Present subflow instance properties as table rather than generated UI

* Move subflow instance properties to separate tab

* Fix subflow property ui element layout issues
2019-08-12 15:01:54 +01:00

264 lines
5.0 KiB
SCSS

/**
* Copyright JS Foundation and other contributors, http://js.foundation
*
* 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.
**/
.red-ui-editor {
font-size: $primary-font-size;
font-family: $primary-font;
padding: 0;
margin: 0;
background: $primary-background;
color: $primary-text-color;
line-height: 20px;
}
#red-ui-editor {
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
#red-ui-editor-node-configs {
display: none;
}
#red-ui-main-container {
position: absolute;
top:40px; left:0; bottom: 0; right:0;
overflow:hidden;
}
#red-ui-palette-shade, #red-ui-editor-shade, #red-ui-header-shade, #red-ui-sidebar-shade {
@include shade;
z-index: 2;
}
#red-ui-sidebar-shade {
left: -8px;
top: -1px;
bottom: -1px;
}
#red-ui-full-shade {
@include shade;
z-index: 15;
}
.red-ui-editor,
.red-ui-editor-dialog,
.red-ui-menu,
.red-ui-popover,
.red-ui-typedInput-options,
.red-ui-icon-picker {
a {
text-decoration: none;
color: $primary-text-color;
}
a:hover,
a:focus {
text-decoration: none;
color: $primary-text-color;
}
p {
margin: 0 0 10px;
}
small {
font-size: 85%;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
cite {
font-style: normal;
}
ul,
ol {
padding: 0;
margin: 0 0 10px 25px;
}
ul ul,
ul ol,
ol ol,
ol ul {
margin-bottom: 0;
}
li {
line-height: 20px;
}
dl {
margin-bottom: 20px;
}
dt,
dd {
line-height: 20px;
}
dt {
font-weight: bold;
}
dd {
margin-left: 10px;
}
hr {
margin: 20px 0;
border: 0;
border-top: 1px solid $tertiary-border-color;
}
i.spinner {
display: inline-block;
width: 14px;
height: 14px;
line-height: 14px;
vertical-align: text-top;
margin-top: 0px;
background: url(images/spin.svg) no-repeat 50% 50%;
background-size: contain
}
code {
font-family: $monospace-font;
font-size: $primary-font-size;
padding: 0px;
margin: 1px;
color: $info-text-code-color;
white-space: nowrap;
}
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
line-height: 20px;
word-break: break-all;
word-wrap: break-word;
white-space: pre-wrap;
background-color:$tertiary-background;
border: 1px solid $tertiary-border-color;
border-radius: 2px;
}
pre code {
padding: 0;
color: inherit;
white-space: pre;
white-space: pre-wrap;
background-color: transparent;
border: 0;
}
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.hide {
display: none;
}
.show {
display: block;
}
img {
width: auto\9;
height: auto;
max-width: 100%;
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}
blockquote {
padding: 0 0 0 15px;
margin: 0 0 20px;
border-left: 4px solid $secondary-border-color;
color: $secondary-text-color;
p {
font-size: 14px;
font-weight: inherit;
line-height: 1.25;
margin-bottom: 0;
}
}
table {
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0;
}
}
.red-ui-component-spinner {
position: absolute;
top: 1px;
bottom: 1px;
left: 1px;
right: 1px;
text-align: center;
padding: 40px;
background: $secondary-background;
&:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.25em;
}
img {
display: inline-block;
vertical-align: middle;
width: 80px;
}
&.red-ui-component-spinner-sidebar {
background: $secondary-background;
padding:0;
img {
width: 40px;
}
}
&.projects-version-control-spinner-sidebar {
background: $secondary-background;
padding:0;
img {
width: 20px;
}
}
&.red-ui-component-spinner-contain {
padding: 0;
img {
width: auto;
height: 100%;
max-height: 50px;
}
}
}