Move library import/export to single dialog

This commit is contained in:
Nick O'Leary
2019-04-23 14:23:17 +01:00
parent 1795c491a8
commit 3263008379
10 changed files with 842 additions and 431 deletions

View File

@@ -22,6 +22,10 @@ $form-input-focus-color: rgba(85,150,230,0.8);
$form-input-border-color: #ccc;
$form-input-border-selected-color: #aaa;
$list-item-color: #666;
$list-item-background-hover: #f3f3f3;
$list-item-background-active: #efefef;
$list-item-background-selected: #eee;
$node-selected-color: #ff7f0e;
$port-selected-color: #ff7f0e;

View File

@@ -48,3 +48,112 @@
}
}
}
#clipboard-dialog-export-tab-clipboard {
padding: 10px;
textarea {
resize: none;
width: 100%;
border-radius: 4px;
font-family: monospace !important;
font-size: 13px !important;
height: 430px;
line-height: 1.3em;
padding: 6px 10px;
background: #F3E7E7;
color: #533;
}
}
#clipboard-dialog-export-tabs-content {
position: absolute;
top: 0;
left: 120px;
right: 0;
bottom: 0;
padding: 0;
background: white;
&>div {
height: calc(100% - 20px)
}
}
#clipboard-dialog-export-tab-library {
.form-row {
margin-left: 10px;
}
}
#clipboard-dialog-tab-library-name {
width: calc(100% - 120px);
}
#clipboard-dialog-export-tab-library-browser {
height: calc(100% - 40px);
margin-bottom: 10px;
border-bottom: 1px solid $primary-border-color;
box-sizing: border-box;
}
.red-ui-library-browser {
height: 100%;
.red-ui-treeList-container {
background: white;
border: none;
border-radius: 0;
li {
background: none;
}
label {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.red-ui-editableList-border {
border-radius: 0;
}
.red-ui-treeList-label input.red-ui-treeList-input {
border-radius: 2px;
margin-top: -6px;
margin-bottom: -6px;
}
}
#node-dialog-library-save-browser {
height: calc(100% - 60px);
border: 1px solid $primary-border-color;
margin-bottom: 10px;
}
#node-dialog-library-load-browser {
height: 200px;
border: 1px solid $primary-border-color;
margin-bottom: 10px;
}
#node-dialog-library-load-preview {
height: 300px;
}
#node-dialog-library-load-preview-text {
box-sizing: border-box;
display: inline-block;
height: 100%;
width: calc(50% - 5px);
border: 1px solid $primary-border-color;
}
#node-dialog-library-load-preview-details {
box-sizing: border-box;
display: inline-block;
height: 100%;
width: calc(50% - 5px);
margin-right: 10px;
border: 1px solid $primary-border-color;
.node-info-node-row:first-child {
border-top: none;
}
}

View File

@@ -36,17 +36,10 @@
}
@mixin workspace-button {
@include disable-selection;
box-sizing: border-box;
display: inline-block;
@mixin reset-a-style {
color: $workspace-button-color !important;
background: $workspace-button-background;
border: 1px solid $form-input-border-color;
text-align: center;
margin:0;
text-decoration: none;
cursor:pointer;
&.disabled, &:disabled {
cursor: default;
@@ -67,6 +60,19 @@
background: $workspace-button-background-active;
text-decoration: none;
}
}
@mixin workspace-button {
@include disable-selection;
@include reset-a-style;
box-sizing: border-box;
display: inline-block;
border: 1px solid $form-input-border-color;
text-align: center;
margin:0;
cursor:pointer;
// &.selected:not(.disabled):not(:disabled) {
// color: $workspace-button-color-selected !important;
// background: $workspace-button-background-active;
@@ -150,12 +156,12 @@
}
&:not(.single) {
color: $workspace-button-toggle-color !important;
background:$workspace-button-background-active;
background:$workspace-button-background;
margin-bottom: 1px;
&.selected:not(.disabled):not(:disabled) {
color: $workspace-button-toggle-color-selected !important;
background: $workspace-button-background;
background: $workspace-button-background-active;
border-bottom-width: 2px;
border-bottom-color: $form-input-border-selected-color;
margin-bottom: 0;

View File

@@ -247,7 +247,7 @@
z-index: 2;
&.red-ui-tab-link-button {
&:not(.active) {
background: #eee;
// background: #eee;
}
}
&.red-ui-tab-link-button-menu {

View File

@@ -72,22 +72,29 @@ label.red-ui-treeList-label {
@include disable-selection;
padding: 6px 0;
display: block;
color: $form-text-color;
color: $list-item-color;
text-decoration: none;
cursor: pointer;
vertical-align: middle;
margin: 0;
&:hover {
background: #f9f9f9;
color: $form-text-color;
text-decoration: none;
}
// &:hover {
// background: $list-item-background-hover;
// color: $list-item-color;
// text-decoration: none;
// }
&:focus {
background: $list-item-background-hover;
outline: none;
color: $form-text-color;
color: $list-item-color;
text-decoration: none;
}
&.selected {
background: $list-item-background-selected;
outline: none;
color: $list-item-color;
}
input {
margin: 0;
}