',{class:"fa fa-lemon-o"}).appendTo(pinnedLink);
+ }
+ pinnedLink.click(function(evt) {
+ evt.preventDefault();
+ activateTab(tab.id);
+ });
+ if (tab.pinned) {
+ pinnedLink.addClass("red-ui-tab-link-button-pinned");
+ pinnedTabsCount++;
+ }
+ RED.popover.create({
+ target:$(pinnedLink),
+ trigger: "hover",
+ size: "small",
+ direction: "bottom",
+ content: tab.name,
+ delay: { show: 550, hide: 10 }
+ });
+
+ }
link.on("click",onTabClick);
link.on("dblclick",onTabDblClick);
if (tab.closeable) {
@@ -326,6 +455,7 @@ RED.tabs = (function() {
}
})
}
+ collapsibleMenu = null;
},
removeTab: removeTab,
activateTab: activateTab,
diff --git a/editor/js/ui/projects/tab-versionControl.js b/editor/js/ui/projects/tab-versionControl.js
index 44b602019..4560a56e5 100644
--- a/editor/js/ui/projects/tab-versionControl.js
+++ b/editor/js/ui/projects/tab-versionControl.js
@@ -1003,6 +1003,8 @@ RED.sidebar.versionControl = (function() {
name: "Project History",
content: sidebarContent,
enableOnEdit: false,
+ pinned: true,
+ iconClass: "fa fa-code-fork",
onchange: function() {
setTimeout(function() {
sections.resize();
diff --git a/editor/js/ui/sidebar.js b/editor/js/ui/sidebar.js
index 222217668..d9f302885 100644
--- a/editor/js/ui/sidebar.js
+++ b/editor/js/ui/sidebar.js
@@ -35,7 +35,8 @@ RED.sidebar = (function() {
tab.onremove.call(tab);
}
},
- minimumActiveTabWidth: 70
+ // minimumActiveTabWidth: 70,
+ collapsible: true
// scrollable: true
});
@@ -59,6 +60,8 @@ RED.sidebar = (function() {
options = title;
}
+ delete options.closeable;
+
options.wrapper = $('',{style:"height:100%"}).appendTo("#sidebar-content")
options.wrapper.append(options.content);
options.wrapper.hide();
@@ -82,6 +85,8 @@ RED.sidebar = (function() {
group: "sidebar-tabs"
});
+ options.iconClass = options.iconClass || "fa fa-square-o"
+
knownTabs[options.id] = options;
if (options.visible !== false) {
diff --git a/editor/js/ui/tab-config.js b/editor/js/ui/tab-config.js
index 9a4619b28..00caea6cd 100644
--- a/editor/js/ui/tab-config.js
+++ b/editor/js/ui/tab-config.js
@@ -221,8 +221,7 @@ RED.sidebar.config = (function() {
name: RED._("sidebar.config.name"),
content: content,
toolbar: toolbar,
- closeable: true,
- visible: false,
+ iconClass: "fa fa-cog",
onchange: function() { refreshConfigNodeList(); }
});
RED.actions.add("core:show-config-tab",function() {RED.sidebar.show('config')});
diff --git a/editor/js/ui/tab-info.js b/editor/js/ui/tab-info.js
index b4cf87d46..340a6bd74 100644
--- a/editor/js/ui/tab-info.js
+++ b/editor/js/ui/tab-info.js
@@ -83,7 +83,9 @@ RED.sidebar.info = (function() {
id: "info",
label: RED._("sidebar.info.label"),
name: RED._("sidebar.info.name"),
+ iconClass: "fa fa-info",
content: content,
+ pinned: true,
enableOnEdit: true
});
if (tips.enabled()) {
diff --git a/editor/sass/popover.scss b/editor/sass/popover.scss
index d3c077e6d..691acd5c8 100644
--- a/editor/sass/popover.scss
+++ b/editor/sass/popover.scss
@@ -30,7 +30,6 @@
}
.red-ui-popover:after, .red-ui-popover:before {
- top: 50%;
border: solid transparent;
content: " ";
height: 0;
@@ -39,12 +38,18 @@
pointer-events: none;
}
.red-ui-popover.red-ui-popover-right:after, .red-ui-popover.red-ui-popover-right:before {
+ top: 50%;
right: 100%;
}
.red-ui-popover.red-ui-popover-left:after, .red-ui-popover.red-ui-popover-left:before {
+ top: 50%;
left: 100%;
}
+.red-ui-popover.red-ui-popover-bottom:after, .red-ui-popover.red-ui-popover-bottom:before {
+ bottom: 100%;
+ left: 50%;
+}
.red-ui-popover.red-ui-popover-right:after {
border-color: rgba(136, 183, 213, 0);
@@ -72,6 +77,21 @@
margin-top: -11px;
}
+
+.red-ui-popover.red-ui-popover-bottom:after {
+ border-color: rgba(136, 183, 213, 0);
+ border-bottom-color: #fff;
+ border-width: 10px;
+ margin-left: -10px;
+}
+.red-ui-popover.red-ui-popover-bottom:before {
+ border-color: rgba(194, 225, 245, 0);
+ border-bottom-color: $primary-border-color;
+ border-width: 11px;
+ margin-left: -11px;
+}
+
+
.red-ui-popover-size-small {
font-size: 11px;
padding: 5px;
@@ -93,4 +113,12 @@
border-width: 6px;
margin-top: -6px;
}
+ &.red-ui-popover-bottom:after {
+ border-width: 5px;
+ margin-left: -5px;
+ }
+ &.red-ui-popover-bottom:before {
+ border-width: 6px;
+ margin-left: -6px;
+ }
}
diff --git a/editor/sass/tabs.scss b/editor/sass/tabs.scss
index 4b2dc7f5d..488f4f3c9 100644
--- a/editor/sass/tabs.scss
+++ b/editor/sass/tabs.scss
@@ -93,7 +93,7 @@
color: $workspace-button-color-hover;
}
}
- .red-ui-tab-icon {
+ img.red-ui-tab-icon {
opacity: 0.2;
}
}
@@ -113,6 +113,21 @@
&.red-ui-tabs-add.red-ui-tabs-scrollable {
padding-right: 59px;
}
+ &.red-ui-tabs-collapsible {
+ li:not(.active) {
+ display: none;
+ &.red-ui-tab-pinned {
+ a {
+ padding-left: 0;
+ text-align: center;
+ }
+ span {
+ display: none;
+ }
+ width: 32px;
+ }
+ }
+ }
&.red-ui-tabs-vertical {
box-sizing: border-box;
@@ -157,6 +172,15 @@
}
}
}
+ .red-ui-tabs-select {
+ position: absolute;
+ top:0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ opacity: 0.4;
+ background: red;
+ }
}
.red-ui-tab-button {
position: absolute;
@@ -180,7 +204,33 @@
z-index: 2;
}
}
-
+.red-ui-tab-link-buttons {
+ position: absolute;
+ box-sizing: border-box;
+ top: 0;
+ right: 0;
+ height: 35px;
+ background: #fff;
+ border-bottom: 1px solid $primary-border-color;
+ z-index: 2;
+ a {
+ @include workspace-button;
+ line-height: 26px;
+ height: 28px;
+ width: 28px;
+ margin: 4px 3px 3px;
+ border: 1px solid $primary-border-color;
+ z-index: 2;
+ &.red-ui-tab-link-button {
+ &:not(.active) {
+ background: #eee;
+ }
+ }
+ &.red-ui-tab-link-button-menu {
+ border-color: white;
+ }
+ }
+}
.red-ui-tab-scroll {
width: 21px;
top: 0;
@@ -216,7 +266,7 @@
right: 38px;
}
-.red-ui-tab-icon {
+img.red-ui-tab-icon {
margin-left: -8px;
margin-right: 3px;
margin-top: -2px;
@@ -225,6 +275,11 @@
height: 20px;
vertical-align: middle;
}
+i.red-ui-tab-icon {
+ opacity: 0.7;
+ width: 18px;
+ height: 20px;
+}
.red-ui-tabs-badges {
position: absolute;
diff --git a/nodes/core/core/58-debug.html b/nodes/core/core/58-debug.html
index 7317d7064..95b55d7f5 100644
--- a/nodes/core/core/58-debug.html
+++ b/nodes/core/core/58-debug.html
@@ -154,7 +154,9 @@
name: this._("debug.sidebar.name"),
content: uiComponents.content,
toolbar: uiComponents.footer,
- enableOnEdit: true
+ enableOnEdit: true,
+ pinned: true,
+ iconClass: "fa fa-wrench"
});
RED.actions.add("core:show-debug-tab",function() { RED.sidebar.show('debug'); });