frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Merge pull request #3106 from bonanitech/fade-on-hover

Browse Source 
Fix fade colors when hovering over tabs
This commit is contained in:
Nick O'Leary 2021-08-23 12:34:42 +01:00 committed by GitHub
commit 34cb93794c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js vendored
View File

@ -664,6 +664,8 @@ RED.tabs = (function() {
link.on("dblclick", function(evt) { evt.stopPropagation(); evt.preventDefault(); }) link.on("dblclick", function(evt) { evt.stopPropagation(); evt.preventDefault(); })
$('<span class="red-ui-tabs-fade"></span>').appendTo(li);
if (tab.closeable) { if (tab.closeable) {
li.addClass("red-ui-tabs-closeable") li.addClass("red-ui-tabs-closeable")
var closeLink = $("<a/>",{href:"#",class:"red-ui-tab-close"}).appendTo(li); var closeLink = $("<a/>",{href:"#",class:"red-ui-tab-close"}).appendTo(li);
@ -674,8 +676,6 @@ RED.tabs = (function() {
}); });
} }
$('<span class="red-ui-tabs-fade"></span>').appendTo(li);
var badges = $('<span class="red-ui-tabs-badges"></span>').appendTo(li); var badges = $('<span class="red-ui-tabs-badges"></span>').appendTo(li);
if (options.onselect) { if (options.onselect) {
$('<i class="red-ui-tabs-badge-changed fa fa-circle"></i>').appendTo(badges); $('<i class="red-ui-tabs-badge-changed fa fa-circle"></i>').appendTo(badges);

3
packages/node_modules/@node-red/editor-client/src/sass/tabs.scss vendored
View File

@ -131,6 +131,9 @@
&:not(.active) a:hover { &:not(.active) a:hover {
color: $workspace-button-color-hover; color: $workspace-button-color-hover;
background: $tab-background-hover; background: $tab-background-hover;
&+.red-ui-tabs-fade {
background-image: linear-gradient(to right, change-color($tab-background-hover, $alpha: 0.001), $tab-background-hover);
}
} }
} }
} }