mirror of
https://github.com/zombieFox/nightTab.git
synced 2025-01-25 07:19:13 +01:00
[feature] add more theme accent presets
This commit is contained in:
parent
02ecd77ac9
commit
54dd036c11
2
package-lock.json
generated
2
package-lock.json
generated
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "nightTab",
|
||||
"version": "5.29.0",
|
||||
"version": "5.30.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "nightTab",
|
||||
"version": "5.29.0",
|
||||
"version": "5.30.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": {
|
||||
|
@ -337,11 +337,11 @@
|
||||
background-color: rgb(var(--theme-color-20));
|
||||
}
|
||||
|
||||
.theme-accent-preset-grid {
|
||||
.theme-accent-preset {
|
||||
display: grid;
|
||||
grid-gap: var(--form-wrap-space);
|
||||
grid-template-columns: repeat(7, 1fr);
|
||||
grid-template-rows: repeat(5, 1fr);
|
||||
grid-gap: calc(var(--form-wrap-space) / 2);
|
||||
grid-template-rows: repeat(7, auto);
|
||||
grid-auto-flow: column;
|
||||
justify-items: center;
|
||||
}
|
||||
|
||||
@ -350,8 +350,20 @@
|
||||
padding: 0;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
min-width: 1.5em;
|
||||
min-height: 1.5em;
|
||||
min-width: initial;
|
||||
min-height: initial;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-grey {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-primary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-secondary {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.theme-accent-preset-item:focus,
|
||||
@ -360,20 +372,46 @@
|
||||
background-color: hsl(var(--theme-accent-preset-item-color-h), calc(var(--theme-accent-preset-item-color-s) * 1%), calc(var(--theme-accent-preset-item-color-l) * 1%));
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.theme-accent-preset-item {
|
||||
width: 1.25em;
|
||||
height: 1.25em;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-secondary {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 700px) {
|
||||
.theme-accent-preset-item {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
min-width: 2em;
|
||||
min-height: 2em;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-secondary {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 900px) {
|
||||
.theme-accent-preset-item {
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
min-width: 2.5em;
|
||||
min-height: 2.5em;
|
||||
width: 1.25em;
|
||||
height: 1.25em;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-secondary {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1100px) {
|
||||
.theme-accent-preset-item {
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
.theme-accent-preset-type-secondary {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
@ -5,7 +5,7 @@
|
||||
@@include("./theme/saved.html")
|
||||
|
||||
@@include("./theme/fonts.html")
|
||||
|
||||
|
||||
@@include("./theme/style.html")
|
||||
|
||||
@@include("./theme/color.html")
|
||||
|
891
src/js/theme.js
891
src/js/theme.js
@ -267,254 +267,745 @@ var theme = (function() {
|
||||
});
|
||||
},
|
||||
preset: {
|
||||
all: [
|
||||
colorscale: [
|
||||
[{
|
||||
name: "Extra light grey",
|
||||
name: "Super extra light grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super Extra dark grey",
|
||||
type: "grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark red",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark orange",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 30,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark yellow",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark lime",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 90,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark green",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark aqua",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 150,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark cyan",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark teal",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 210,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark blue",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark pruple",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 270,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 80,
|
||||
l: 90
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Light grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 70
|
||||
}
|
||||
}, {
|
||||
name: "Light red",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 80,
|
||||
l: 70
|
||||
}
|
||||
}, {
|
||||
name: "Light yellow",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 80,
|
||||
l: 70
|
||||
}
|
||||
}, {
|
||||
name: "Light green",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 80,
|
||||
l: 70
|
||||
}
|
||||
}, {
|
||||
name: "Light cyan",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 80,
|
||||
l: 70
|
||||
}
|
||||
}, {
|
||||
name: "Light blue",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 80,
|
||||
l: 70
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 80,
|
||||
l: 70
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Red",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 80,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Yellow",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 80,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Green",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 80,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Cyan",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 80,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Blue",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 80,
|
||||
l: 50
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 80,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Dark grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark red",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark yellow",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark green",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark cyan",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark blue",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}, {
|
||||
name: "Dark magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 60,
|
||||
l: 30
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Extra dark grey",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 0,
|
||||
l: 10
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark red",
|
||||
hsl: {
|
||||
h: 0,
|
||||
s: 20,
|
||||
l: 10
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark yellow",
|
||||
hsl: {
|
||||
h: 60,
|
||||
s: 20,
|
||||
l: 10
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark green",
|
||||
hsl: {
|
||||
h: 120,
|
||||
s: 20,
|
||||
l: 10
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark cyan",
|
||||
hsl: {
|
||||
h: 180,
|
||||
s: 20,
|
||||
l: 10
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark blue",
|
||||
hsl: {
|
||||
h: 240,
|
||||
s: 20,
|
||||
l: 10
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 20,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark magenta",
|
||||
type: "primary",
|
||||
hsl: {
|
||||
h: 300,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}],
|
||||
[{
|
||||
name: "Super extra light fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 40,
|
||||
l: 90
|
||||
}
|
||||
}, {
|
||||
name: "Extra light fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 60,
|
||||
l: 77
|
||||
}
|
||||
}, {
|
||||
name: "Light fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 80,
|
||||
l: 63
|
||||
}
|
||||
}, {
|
||||
name: "Fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 100,
|
||||
l: 50
|
||||
}
|
||||
}, {
|
||||
name: "Dark fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 80,
|
||||
l: 37
|
||||
}
|
||||
}, {
|
||||
name: "Extra dark fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 60,
|
||||
l: 23
|
||||
}
|
||||
}, {
|
||||
name: "Super extra dark fuchsia",
|
||||
type: "secondary",
|
||||
hsl: {
|
||||
h: 330,
|
||||
s: 40,
|
||||
l: 10
|
||||
}
|
||||
}]
|
||||
@ -2008,30 +2499,30 @@ var theme = (function() {
|
||||
},
|
||||
preset: function() {
|
||||
var themeAccentPreset = helper.e(".theme-accent-preset");
|
||||
var formWrap = helper.node("div|class:form-wrap");
|
||||
var themeAccentPresetGrid = helper.node("div|class:theme-accent-preset-grid");
|
||||
|
||||
mod.accent.preset.all.forEach(function(arrayItem, index) {
|
||||
var _makeAccentButton = function(preset) {
|
||||
var themeAccentPresetItem = helper.node("button|class:theme-accent-preset-item theme-accent-preset-type-" + preset.type + " button button-block button-ring,title:" + preset.name + ",tabindex:-1");
|
||||
var themeAccentPresetItemName = helper.node("span:" + preset.name + "|class:sr-only");
|
||||
themeAccentPresetItem.appendChild(themeAccentPresetItemName);
|
||||
themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-h", preset.hsl.h);
|
||||
themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-s", preset.hsl.s);
|
||||
themeAccentPresetItem.style.setProperty("--theme-accent-preset-item-color-l", preset.hsl.l);
|
||||
themeAccentPresetItem.addEventListener("click", function() {
|
||||
mod.accent.preset.set(preset.hsl);
|
||||
data.save();
|
||||
render.accent.color();
|
||||
control.render.update.control.header();
|
||||
control.render.update.control.menu();
|
||||
});
|
||||
return themeAccentPresetItem;
|
||||
};
|
||||
|
||||
mod.accent.preset.colorscale.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");
|
||||
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.hsl);
|
||||
data.save();
|
||||
render.accent.color();
|
||||
control.render.update.control.header();
|
||||
control.render.update.control.menu();
|
||||
});
|
||||
themeAccentPresetGrid.appendChild(themeAccentPresetItem);
|
||||
themeAccentPreset.appendChild(_makeAccentButton(arrayItem));
|
||||
});
|
||||
});
|
||||
|
||||
formWrap.appendChild(themeAccentPresetGrid);
|
||||
themeAccentPreset.appendChild(formWrap);
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
var version = (function() {
|
||||
|
||||
var current = "5.29.0";
|
||||
var current = "5.30.0";
|
||||
|
||||
var name = "Zonked Tarsier";
|
||||
|
||||
|
@ -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.29.0",
|
||||
"version": "5.30.0",
|
||||
"manifest_version": 2,
|
||||
"chrome_url_overrides": {
|
||||
"newtab": "index.html"
|
||||
|
Loading…
Reference in New Issue
Block a user