diff --git a/package-lock.json b/package-lock.json index 479040a5..f60c281a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "nightTab", - "version": "5.19.0", + "version": "5.20.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 4aec8206..430cc7eb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nightTab", - "version": "5.19.0", + "version": "5.20.0", "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.", "main": "index.js", "scripts": { diff --git a/src/js/theme.js b/src/js/theme.js index e12be697..70f4ca1a 100644 --- a/src/js/theme.js +++ b/src/js/theme.js @@ -269,149 +269,254 @@ var theme = (function() { preset: { all: [ [{ - h: 0, - s: 0, - l: 90 + name: "Extra light grey", + hsl: { + h: 0, + s: 0, + l: 90 + } }, { - h: 0, - s: 80, - l: 90 + name: "Extra light red", + hsl: { + h: 0, + s: 80, + l: 90 + } }, { - h: 60, - s: 80, - l: 90 + name: "Extra light yellow", + hsl: { + h: 60, + s: 80, + l: 90 + } }, { - h: 120, - s: 80, - l: 90 + name: "Extra light green", + hsl: { + h: 120, + s: 80, + l: 90 + } }, { - h: 180, - s: 80, - l: 90 + name: "Extra light cyan", + hsl: { + h: 180, + s: 80, + l: 90 + } }, { - h: 240, - s: 80, - l: 90 + name: "Extra light blue", + hsl: { + h: 240, + s: 80, + l: 90 + } }, { - h: 300, - s: 80, - l: 90 + name: "Extra light magenta", + hsl: { + h: 300, + s: 80, + l: 90 + } }], [{ - h: 0, - s: 0, - l: 70 + name: "Light grey", + hsl: { + h: 0, + s: 0, + l: 70 + } }, { - h: 0, - s: 80, - l: 70 + name: "Light red", + hsl: { + h: 0, + s: 80, + l: 70 + } }, { - h: 60, - s: 80, - l: 70 + name: "Light yellow", + hsl: { + h: 60, + s: 80, + l: 70 + } }, { - h: 120, - s: 80, - l: 70 + name: "Light green", + hsl: { + h: 120, + s: 80, + l: 70 + } }, { - h: 180, - s: 80, - l: 70 + name: "Light cyan", + hsl: { + h: 180, + s: 80, + l: 70 + } }, { - h: 240, - s: 80, - l: 70 + name: "Light blue", + hsl: { + h: 240, + s: 80, + l: 70 + } }, { - h: 300, - s: 80, - l: 70 + name: "Light magenta", + hsl: { + h: 300, + s: 80, + l: 70 + } }], [{ - h: 0, - s: 0, - l: 50 + name: "Grey", + hsl: { + h: 0, + s: 0, + l: 50 + } }, { - h: 0, - s: 80, - l: 50 + name: "Red", + hsl: { + h: 0, + s: 80, + l: 50 + } }, { - h: 60, - s: 80, - l: 50 + name: "Yellow", + hsl: { + h: 60, + s: 80, + l: 50 + } }, { - h: 120, - s: 80, - l: 50 + name: "Green", + hsl: { + h: 120, + s: 80, + l: 50 + } }, { - h: 180, - s: 80, - l: 50 + name: "Cyan", + hsl: { + h: 180, + s: 80, + l: 50 + } }, { - h: 240, - s: 80, - l: 50 + name: "Blue", + hsl: { + h: 240, + s: 80, + l: 50 + } }, { - h: 300, - s: 80, - l: 50 + name: "Magenta", + hsl: { + h: 300, + s: 80, + l: 50 + } }], [{ - h: 0, - s: 0, - l: 30 + name: "Dark grey", + hsl: { + h: 0, + s: 0, + l: 30 + } }, { - h: 0, - s: 60, - l: 30 + name: "Dark red", + hsl: { + h: 0, + s: 60, + l: 30 + } }, { - h: 60, - s: 60, - l: 30 + name: "Dark yellow", + hsl: { + h: 60, + s: 60, + l: 30 + } }, { - h: 120, - s: 60, - l: 30 + name: "Dark green", + hsl: { + h: 120, + s: 60, + l: 30 + } }, { - h: 180, - s: 60, - l: 30 + name: "Dark cyan", + hsl: { + h: 180, + s: 60, + l: 30 + } }, { - h: 240, - s: 60, - l: 30 + name: "Dark blue", + hsl: { + h: 240, + s: 60, + l: 30 + } }, { - h: 300, - s: 60, - l: 30 + name: "Dark magenta", + hsl: { + h: 300, + s: 60, + l: 30 + } }], [{ - h: 0, - s: 0, - l: 10 + name: "Extra dark grey", + hsl: { + h: 0, + s: 0, + l: 10 + } }, { - h: 0, - s: 20, - l: 10 + name: "Extra dark red", + hsl: { + h: 0, + s: 20, + l: 10 + } }, { - h: 60, - s: 20, - l: 10 + name: "Extra dark yellow", + hsl: { + h: 60, + s: 20, + l: 10 + } }, { - h: 120, - s: 20, - l: 10 + name: "Extra dark green", + hsl: { + h: 120, + s: 20, + l: 10 + } }, { - h: 180, - s: 20, - l: 10 + name: "Extra dark cyan", + hsl: { + h: 180, + s: 20, + l: 10 + } }, { - h: 240, - s: 20, - l: 10 + name: "Extra dark blue", + hsl: { + h: 240, + s: 20, + l: 10 + } }, { - h: 300, - s: 20, - l: 10 + name: "Extra dark magenta", + hsl: { + h: 300, + s: 20, + l: 10 + } }] ], set: function(hsl) { @@ -1909,11 +2014,13 @@ var theme = (function() { mod.accent.preset.all.forEach(function(arrayItem, index) { arrayItem.forEach(function(arrayItem, index) { var themeAccentPresetItem = helper.node("button|class:theme-accent-preset-item button button-block button-ring,tabindex:-1"); - themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-h", arrayItem.h); - themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-s", arrayItem.s); - themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-l", arrayItem.l); + var themeAccentPresetItemName = helper.node("span:" + arrayItem.name + "|class:sr-only"); + themeAccentPresetItem.appendChild(themeAccentPresetItemName); + themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-h", arrayItem.hsl.h); + themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-s", arrayItem.hsl.s); + themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-l", arrayItem.hsl.l); themeAccentPresetItem.addEventListener("click", function() { - mod.accent.preset.set(arrayItem); + mod.accent.preset.set(arrayItem.hsl); data.save(); render.accent.color(); control.render.update.control.header(); diff --git a/src/js/version.js b/src/js/version.js index 7711619a..c1b7b467 100644 --- a/src/js/version.js +++ b/src/js/version.js @@ -1,6 +1,6 @@ var version = (function() { - var current = "5.19.0"; + var current = "5.20.0"; var name = "Zonked Tarsier"; diff --git a/src/manifest.json b/src/manifest.json index 10b0d130..36e35769 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -2,7 +2,7 @@ "name": "nightTab", "short_name": "nightTab", "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.", - "version": "5.19.0", + "version": "5.20.0", "manifest_version": 2, "chrome_url_overrides": { "newtab": "index.html"