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 #3140 from harmonic7/dev

Browse Source 
Allow colouring of tab icon svg
This commit is contained in:
Nick O'Leary 2021-09-13 09:23:59 +01:00 committed by GitHub
commit d6e05962c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/node_modules/@node-red/editor-api/lib/editor/theme.js vendored
View File

@ -24,7 +24,10 @@ var defaultContext = {
page: {
title: "Node-RED",
favicon: "favicon.ico",
tabicon: "red/images/node-red-icon-black.svg"
tabicon: {
icon: "red/images/node-red-icon-black.svg",
colour: "#8f0000"
}
},
header: {
title: "Node-RED",
@ -123,9 +126,13 @@ module.exports = {
}
if (theme.page.tabicon) {
url = serveFile(themeApp,"/tabicon/",theme.page.tabicon)
let icon = theme.page.tabicon.icon || theme.page.tabicon
url = serveFile(themeApp,"/tabicon/", icon)
if (url) {
themeContext.page.tabicon = url;
themeContext.page.tabicon.icon = url;
}
if (theme.page.tabicon.colour) {
themeContext.page.tabicon.colour = theme.page.tabicon.colour
}
}

2
packages/node_modules/@node-red/editor-client/templates/index.mst vendored
View File

@ -23,7 +23,7 @@
-->
<title>{{ page.title }}</title>
<link rel="icon" type="image/png" href="{{ page.favicon }}">
<link rel="mask-icon" href="{{ page.tabicon }}" color="#8f0000">
<link rel="mask-icon" href="{{ page.tabicon.icon }}" color="{{ page.tabicon.colour }}">
<link rel="stylesheet" href="vendor/jquery/css/base/jquery-ui.min.css">
<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="red/style.min.css">

34
test/unit/@node-red/editor-api/lib/editor/theme_spec.js
View File

@ -41,7 +41,9 @@ describe("api/editor/theme", function () {
context.should.have.a.property("page");
context.page.should.have.a.property("title", "Node-RED");
context.page.should.have.a.property("favicon", "favicon.ico");
context.page.should.have.a.property("tabicon", "red/images/node-red-icon-black.svg");
context.page.should.have.a.property("tabicon");
context.page.tabicon.should.have.a.property("icon", "red/images/node-red-icon-black.svg");
context.page.tabicon.should.have.a.property("colour", "#8f0000");
context.should.have.a.property("header");
context.header.should.have.a.property("title", "Node-RED");
context.header.should.have.a.property("image", "red/images/node-red.svg");
@ -58,7 +60,10 @@ describe("api/editor/theme", function () {
page: {
title: "Test Page Title",
favicon: "/absolute/path/to/theme/favicon",
tabicon: "/absolute/path/to/theme/tabicon",
tabicon: {
icon: "/absolute/path/to/theme/tabicon",
colour: "#8f008f"
},
css: "/absolute/path/to/custom/css/file.css",
scripts: "/absolute/path/to/script.js"
},
@ -108,7 +113,9 @@ describe("api/editor/theme", function () {
context.should.have.a.property("page");
context.page.should.have.a.property("title", "Test Page Title");
context.page.should.have.a.property("favicon", "theme/favicon/favicon");
context.page.should.have.a.property("tabicon", "theme/tabicon/tabicon");
context.page.should.have.a.property("tabicon")
context.page.tabicon.should.have.a.property("icon", "theme/tabicon/tabicon");
context.page.tabicon.should.have.a.property("colour", "#8f008f")
context.should.have.a.property("header");
context.header.should.have.a.property("title", "Test Header Title");
context.header.should.have.a.property("url", "http://nodered.org");
@ -142,6 +149,27 @@ describe("api/editor/theme", function () {
settings.projects.should.have.a.property("enabled", false);
});
it("picks up backwards compatible tabicon setting", async function () {
theme.init({
editorTheme: {
page: {
tabicon: "/absolute/path/to/theme/tabicon",
}
}
});
theme.app();
var context = await theme.context();
context.should.have.a.property("page");
context.page.should.have.a.property("tabicon");
context.page.tabicon.should.have.a.property("icon", "theme/tabicon/tabicon");
// The colour property should remain as default in this case as the
// legacy format for defining tabicon doesn't allow specifying a colour
context.page.tabicon.should.have.a.property("colour", "#8f0000");
});
it("test explicit userMenu set to true in theme setting", function () {
theme.init({
editorTheme: {