extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-06-27 13:01:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

[design] change theme preset names

Browse Source
This commit is contained in:
zombieFox 2019-12-29 08:50:05 -07:00
parent 400141dcc7
commit 3ea18b11e2
5 changed files with 399 additions and 312 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

324
src/css/theme.css
View File

@ -65,17 +65,19 @@
} }
.theme-preset-font { .theme-preset-font {
z-index: 6; padding: 0.25em;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
transform: scale(1); transform: scale(1);
white-space: initial;
transition: transform var(--layout-timing-extra-fast); transition: transform var(--layout-timing-extra-fast);
z-index: 6;
} }
.theme-preset-font-display { .theme-preset-font-display {
font-size: 1.25em; font-size: 1em;
margin-bottom: 0.25em; margin-bottom: 0.25em;
} }
@ -172,34 +174,64 @@
color: rgb(var(--theme-preset-font-color-midnight)); color: rgb(var(--theme-preset-font-color-midnight));
} }
.theme-preset-background-bluegum-01 { .theme-preset-background-pym-01 {
background-color: rgb(var(--theme-preset-background-bluegum-01)); background-color: rgb(var(--theme-preset-background-pym-01));
} }
.theme-preset-background-bluegum-02 { .theme-preset-background-pym-02 {
background-color: rgb(var(--theme-preset-background-bluegum-02)); background-color: rgb(var(--theme-preset-background-pym-02));
} }
.theme-preset-background-bluegum-03 { .theme-preset-background-pym-03 {
background-color: rgb(var(--theme-preset-background-bluegum-03)); background-color: rgb(var(--theme-preset-background-pym-03));
} }
.theme-preset-background-bluegum-04 { .theme-preset-background-pym-04 {
background-color: rgb(var(--theme-preset-background-bluegum-04)); background-color: rgb(var(--theme-preset-background-pym-04));
} }
.theme-preset-accent-bluegum { .theme-preset-accent-pym {
background-color: rgb(var(--theme-preset-accent-bluegum)); background-color: rgb(var(--theme-preset-accent-pym));
} }
.theme-preset-font-display-bluegum { .theme-preset-font-display-pym {
font-family: var(--theme-preset-font-display-bluegum); font-family: var(--theme-preset-font-display-pym);
color: rgb(var(--theme-preset-font-color-bluegum)); color: rgb(var(--theme-preset-font-color-pym));
} }
.theme-preset-font-ui-bluegum { .theme-preset-font-ui-pym {
font-family: var(--theme-preset-font-ui-bluegum); font-family: var(--theme-preset-font-ui-pym);
color: rgb(var(--theme-preset-font-color-bluegum)); color: rgb(var(--theme-preset-font-color-pym));
}
.theme-preset-background-cruiser-01 {
background-color: rgb(var(--theme-preset-background-cruiser-01));
}
.theme-preset-background-cruiser-02 {
background-color: rgb(var(--theme-preset-background-cruiser-02));
}
.theme-preset-background-cruiser-03 {
background-color: rgb(var(--theme-preset-background-cruiser-03));
}
.theme-preset-background-cruiser-04 {
background-color: rgb(var(--theme-preset-background-cruiser-04));
}
.theme-preset-accent-cruiser {
background-color: rgb(var(--theme-preset-accent-cruiser));
}
.theme-preset-font-display-cruiser {
font-family: var(--theme-preset-font-display-cruiser);
color: rgb(var(--theme-preset-font-color-cruiser));
}
.theme-preset-font-ui-cruiser {
font-family: var(--theme-preset-font-ui-cruiser);
color: rgb(var(--theme-preset-font-color-cruiser));
} }
.theme-preset-background-sharpmint-01 { .theme-preset-background-sharpmint-01 {
@ -232,154 +264,154 @@
color: rgb(var(--theme-preset-font-color-sharpmint)); color: rgb(var(--theme-preset-font-color-sharpmint));
} }
.theme-preset-background-snowblue-01 { .theme-preset-background-snowglow-01 {
background-color: rgb(var(--theme-preset-background-snowblue-01)); background-color: rgb(var(--theme-preset-background-snowglow-01));
} }
.theme-preset-background-snowblue-02 { .theme-preset-background-snowglow-02 {
background-color: rgb(var(--theme-preset-background-snowblue-02)); background-color: rgb(var(--theme-preset-background-snowglow-02));
} }
.theme-preset-background-snowblue-03 { .theme-preset-background-snowglow-03 {
background-color: rgb(var(--theme-preset-background-snowblue-03)); background-color: rgb(var(--theme-preset-background-snowglow-03));
} }
.theme-preset-background-snowblue-04 { .theme-preset-background-snowglow-04 {
background-color: rgb(var(--theme-preset-background-snowblue-04)); background-color: rgb(var(--theme-preset-background-snowglow-04));
} }
.theme-preset-accent-snowblue { .theme-preset-accent-snowglow {
background-color: rgb(var(--theme-preset-accent-snowblue)); background-color: rgb(var(--theme-preset-accent-snowglow));
} }
.theme-preset-font-display-snowblue { .theme-preset-font-display-snowglow {
font-family: var(--theme-preset-font-display-snowblue); font-family: var(--theme-preset-font-display-snowglow);
color: rgb(var(--theme-preset-font-color-snowblue)); color: rgb(var(--theme-preset-font-color-snowglow));
} }
.theme-preset-font-ui-snowblue { .theme-preset-font-ui-snowglow {
font-family: var(--theme-preset-font-ui-snowblue); font-family: var(--theme-preset-font-ui-snowglow);
color: rgb(var(--theme-preset-font-color-snowblue)); color: rgb(var(--theme-preset-font-color-snowglow));
} }
.theme-preset-background-chocorum-01 { .theme-preset-background-rumble-01 {
background-color: rgb(var(--theme-preset-background-chocorum-01)); background-color: rgb(var(--theme-preset-background-rumble-01));
} }
.theme-preset-background-chocorum-02 { .theme-preset-background-rumble-02 {
background-color: rgb(var(--theme-preset-background-chocorum-02)); background-color: rgb(var(--theme-preset-background-rumble-02));
} }
.theme-preset-background-chocorum-03 { .theme-preset-background-rumble-03 {
background-color: rgb(var(--theme-preset-background-chocorum-03)); background-color: rgb(var(--theme-preset-background-rumble-03));
} }
.theme-preset-background-chocorum-04 { .theme-preset-background-rumble-04 {
background-color: rgb(var(--theme-preset-background-chocorum-04)); background-color: rgb(var(--theme-preset-background-rumble-04));
} }
.theme-preset-accent-chocorum { .theme-preset-accent-rumble {
background-color: rgb(var(--theme-preset-accent-chocorum)); background-color: rgb(var(--theme-preset-accent-rumble));
} }
.theme-preset-font-display-chocorum { .theme-preset-font-display-rumble {
font-family: var(--theme-preset-font-display-chocorum); font-family: var(--theme-preset-font-display-rumble);
color: rgb(var(--theme-preset-font-color-chocorum)); color: rgb(var(--theme-preset-font-color-rumble));
} }
.theme-preset-font-ui-chocorum { .theme-preset-font-ui-rumble {
font-family: var(--theme-preset-font-ui-chocorum); font-family: var(--theme-preset-font-ui-rumble);
color: rgb(var(--theme-preset-font-color-chocorum)); color: rgb(var(--theme-preset-font-color-rumble));
} }
.theme-preset-background-sunburst-01 { .theme-preset-background-sollight-01 {
background-color: rgb(var(--theme-preset-background-sunburst-01)); background-color: rgb(var(--theme-preset-background-sollight-01));
} }
.theme-preset-background-sunburst-02 { .theme-preset-background-sollight-02 {
background-color: rgb(var(--theme-preset-background-sunburst-02)); background-color: rgb(var(--theme-preset-background-sollight-02));
} }
.theme-preset-background-sunburst-03 { .theme-preset-background-sollight-03 {
background-color: rgb(var(--theme-preset-background-sunburst-03)); background-color: rgb(var(--theme-preset-background-sollight-03));
} }
.theme-preset-background-sunburst-04 { .theme-preset-background-sollight-04 {
background-color: rgb(var(--theme-preset-background-sunburst-04)); background-color: rgb(var(--theme-preset-background-sollight-04));
} }
.theme-preset-accent-sunburst { .theme-preset-accent-sollight {
background-color: rgb(var(--theme-preset-accent-sunburst)); background-color: rgb(var(--theme-preset-accent-sollight));
} }
.theme-preset-font-display-sunburst { .theme-preset-font-display-sollight {
font-family: var(--theme-preset-font-display-sunburst); font-family: var(--theme-preset-font-display-sollight);
color: rgb(var(--theme-preset-font-color-sunburst)); color: rgb(var(--theme-preset-font-color-sollight));
} }
.theme-preset-font-ui-sunburst { .theme-preset-font-ui-sollight {
font-family: var(--theme-preset-font-ui-sunburst); font-family: var(--theme-preset-font-ui-sollight);
color: rgb(var(--theme-preset-font-color-sunburst)); color: rgb(var(--theme-preset-font-color-sollight));
} }
.theme-preset-background-coralgreen-01 { .theme-preset-background-artdeco-01 {
background-color: rgb(var(--theme-preset-background-coralgreen-01)); background-color: rgb(var(--theme-preset-background-artdeco-01));
} }
.theme-preset-background-coralgreen-02 { .theme-preset-background-artdeco-02 {
background-color: rgb(var(--theme-preset-background-coralgreen-02)); background-color: rgb(var(--theme-preset-background-artdeco-02));
} }
.theme-preset-background-coralgreen-03 { .theme-preset-background-artdeco-03 {
background-color: rgb(var(--theme-preset-background-coralgreen-03)); background-color: rgb(var(--theme-preset-background-artdeco-03));
} }
.theme-preset-background-coralgreen-04 { .theme-preset-background-artdeco-04 {
background-color: rgb(var(--theme-preset-background-coralgreen-04)); background-color: rgb(var(--theme-preset-background-artdeco-04));
} }
.theme-preset-accent-coralgreen { .theme-preset-accent-artdeco {
background-color: rgb(var(--theme-preset-accent-coralgreen)); background-color: rgb(var(--theme-preset-accent-artdeco));
} }
.theme-preset-font-display-coralgreen { .theme-preset-font-display-artdeco {
font-family: var(--theme-preset-font-display-coralgreen); font-family: var(--theme-preset-font-display-artdeco);
color: rgb(var(--theme-preset-font-color-coralgreen)); color: rgb(var(--theme-preset-font-color-artdeco));
} }
.theme-preset-font-ui-coralgreen { .theme-preset-font-ui-artdeco {
font-family: var(--theme-preset-font-ui-coralgreen); font-family: var(--theme-preset-font-ui-artdeco);
color: rgb(var(--theme-preset-font-color-coralgreen)); color: rgb(var(--theme-preset-font-color-artdeco));
} }
.theme-preset-background-purplegem-01 { .theme-preset-background-macaroon-01 {
background-color: rgb(var(--theme-preset-background-purplegem-01)); background-color: rgb(var(--theme-preset-background-macaroon-01));
} }
.theme-preset-background-purplegem-02 { .theme-preset-background-macaroon-02 {
background-color: rgb(var(--theme-preset-background-purplegem-02)); background-color: rgb(var(--theme-preset-background-macaroon-02));
} }
.theme-preset-background-purplegem-03 { .theme-preset-background-macaroon-03 {
background-color: rgb(var(--theme-preset-background-purplegem-03)); background-color: rgb(var(--theme-preset-background-macaroon-03));
} }
.theme-preset-background-purplegem-04 { .theme-preset-background-macaroon-04 {
background-color: rgb(var(--theme-preset-background-purplegem-04)); background-color: rgb(var(--theme-preset-background-macaroon-04));
} }
.theme-preset-accent-purplegem { .theme-preset-accent-macaroon {
background-color: rgb(var(--theme-preset-accent-purplegem)); background-color: rgb(var(--theme-preset-accent-macaroon));
} }
.theme-preset-font-display-purplegem { .theme-preset-font-display-macaroon {
font-family: var(--theme-preset-font-display-purplegem); font-family: var(--theme-preset-font-display-macaroon);
color: rgb(var(--theme-preset-font-color-purplegem)); color: rgb(var(--theme-preset-font-color-macaroon));
} }
.theme-preset-font-ui-purplegem { .theme-preset-font-ui-macaroon {
font-family: var(--theme-preset-font-ui-purplegem); font-family: var(--theme-preset-font-ui-macaroon);
color: rgb(var(--theme-preset-font-color-purplegem)); color: rgb(var(--theme-preset-font-color-macaroon));
} }
.theme-preset-background-hotpepper-01 { .theme-preset-background-hotpepper-01 {
@ -412,34 +444,34 @@
color: rgb(var(--theme-preset-font-color-hotpepper)); color: rgb(var(--theme-preset-font-color-hotpepper));
} }
.theme-preset-background-steelgrey-01 { .theme-preset-background-steel-01 {
background-color: rgb(var(--theme-preset-background-steelgrey-01)); background-color: rgb(var(--theme-preset-background-steel-01));
} }
.theme-preset-background-steelgrey-02 { .theme-preset-background-steel-02 {
background-color: rgb(var(--theme-preset-background-steelgrey-02)); background-color: rgb(var(--theme-preset-background-steel-02));
} }
.theme-preset-background-steelgrey-03 { .theme-preset-background-steel-03 {
background-color: rgb(var(--theme-preset-background-steelgrey-03)); background-color: rgb(var(--theme-preset-background-steel-03));
} }
.theme-preset-background-steelgrey-04 { .theme-preset-background-steel-04 {
background-color: rgb(var(--theme-preset-background-steelgrey-04)); background-color: rgb(var(--theme-preset-background-steel-04));
} }
.theme-preset-accent-steelgrey { .theme-preset-accent-steel {
background-color: rgb(var(--theme-preset-accent-steelgrey)); background-color: rgb(var(--theme-preset-accent-steel));
} }
.theme-preset-font-display-steelgrey { .theme-preset-font-display-steel {
font-family: var(--theme-preset-font-display-steelgrey); font-family: var(--theme-preset-font-display-steel);
color: rgb(var(--theme-preset-font-color-steelgrey)); color: rgb(var(--theme-preset-font-color-steel));
} }
.theme-preset-font-ui-steelgrey { .theme-preset-font-ui-steel {
font-family: var(--theme-preset-font-ui-steelgrey); font-family: var(--theme-preset-font-ui-steel);
color: rgb(var(--theme-preset-font-color-steelgrey)); color: rgb(var(--theme-preset-font-color-steel));
} }
.theme-preset-background-outrun-01 { .theme-preset-background-outrun-01 {
@ -502,62 +534,62 @@
color: rgb(var(--theme-preset-font-color-pumpkin)); color: rgb(var(--theme-preset-font-color-pumpkin));
} }
.theme-preset-background-whoosh-01 { .theme-preset-background-bubblegum-01 {
background-color: rgb(var(--theme-preset-background-whoosh-01)); background-color: rgb(var(--theme-preset-background-bubblegum-01));
} }
.theme-preset-background-whoosh-02 { .theme-preset-background-bubblegum-02 {
background-color: rgb(var(--theme-preset-background-whoosh-02)); background-color: rgb(var(--theme-preset-background-bubblegum-02));
} }
.theme-preset-background-whoosh-03 { .theme-preset-background-bubblegum-03 {
background-color: rgb(var(--theme-preset-background-whoosh-03)); background-color: rgb(var(--theme-preset-background-bubblegum-03));
} }
.theme-preset-background-whoosh-04 { .theme-preset-background-bubblegum-04 {
background-color: rgb(var(--theme-preset-background-whoosh-04)); background-color: rgb(var(--theme-preset-background-bubblegum-04));
} }
.theme-preset-accent-whoosh { .theme-preset-accent-bubblegum {
background-color: rgb(var(--theme-preset-accent-whoosh)); background-color: rgb(var(--theme-preset-accent-bubblegum));
} }
.theme-preset-font-display-whoosh { .theme-preset-font-display-bubblegum {
font-family: var(--theme-preset-font-display-whoosh); font-family: var(--theme-preset-font-display-bubblegum);
color: rgb(var(--theme-preset-font-color-whoosh)); color: rgb(var(--theme-preset-font-color-bubblegum));
} }
.theme-preset-font-ui-whoosh { .theme-preset-font-ui-bubblegum {
font-family: var(--theme-preset-font-ui-whoosh); font-family: var(--theme-preset-font-ui-bubblegum);
color: rgb(var(--theme-preset-font-color-whoosh)); color: rgb(var(--theme-preset-font-color-bubblegum));
} }
.theme-preset-background-eldergold-01 { .theme-preset-background-elderbean-01 {
background-color: rgb(var(--theme-preset-background-eldergold-01)); background-color: rgb(var(--theme-preset-background-elderbean-01));
} }
.theme-preset-background-eldergold-02 { .theme-preset-background-elderbean-02 {
background-color: rgb(var(--theme-preset-background-eldergold-02)); background-color: rgb(var(--theme-preset-background-elderbean-02));
} }
.theme-preset-background-eldergold-03 { .theme-preset-background-elderbean-03 {
background-color: rgb(var(--theme-preset-background-eldergold-03)); background-color: rgb(var(--theme-preset-background-elderbean-03));
} }
.theme-preset-background-eldergold-04 { .theme-preset-background-elderbean-04 {
background-color: rgb(var(--theme-preset-background-eldergold-04)); background-color: rgb(var(--theme-preset-background-elderbean-04));
} }
.theme-preset-accent-eldergold { .theme-preset-accent-elderbean {
background-color: rgb(var(--theme-preset-accent-eldergold)); background-color: rgb(var(--theme-preset-accent-elderbean));
} }
.theme-preset-font-display-eldergold { .theme-preset-font-display-elderbean {
font-family: var(--theme-preset-font-display-eldergold); font-family: var(--theme-preset-font-display-elderbean);
color: rgb(var(--theme-preset-font-color-eldergold)); color: rgb(var(--theme-preset-font-color-elderbean));
} }
.theme-preset-font-ui-eldergold { .theme-preset-font-ui-elderbean {
font-family: var(--theme-preset-font-ui-eldergold); font-family: var(--theme-preset-font-ui-elderbean);
color: rgb(var(--theme-preset-font-color-eldergold)); color: rgb(var(--theme-preset-font-color-elderbean));
} }

114
src/css/variables.css
View File

@ -40,13 +40,13 @@
--theme-preset-accent-midnight: 25, 25, 25; --theme-preset-accent-midnight: 25, 25, 25;
--theme-preset-font-display-midnight: sans-serif; --theme-preset-font-display-midnight: sans-serif;
--theme-preset-font-ui-midnight: sans-serif; --theme-preset-font-ui-midnight: sans-serif;
--theme-preset-background-bluegum-01: 25, 25, 25; --theme-preset-background-cruiser-01: 25, 25, 25;
--theme-preset-background-bluegum-02: 25, 25, 25; --theme-preset-background-cruiser-02: 25, 25, 25;
--theme-preset-background-bluegum-03: 25, 25, 25; --theme-preset-background-cruiser-03: 25, 25, 25;
--theme-preset-background-bluegum-04: 25, 25, 25; --theme-preset-background-cruiser-04: 25, 25, 25;
--theme-preset-accent-bluegum: 25, 25, 25; --theme-preset-accent-cruiser: 25, 25, 25;
--theme-preset-font-display-bluegum: sans-serif; --theme-preset-font-display-cruiser: sans-serif;
--theme-preset-font-ui-bluegum: sans-serif; --theme-preset-font-ui-cruiser: sans-serif;
--theme-preset-background-sharpmint-01: 25, 25, 25; --theme-preset-background-sharpmint-01: 25, 25, 25;
--theme-preset-background-sharpmint-02: 25, 25, 25; --theme-preset-background-sharpmint-02: 25, 25, 25;
--theme-preset-background-sharpmint-03: 25, 25, 25; --theme-preset-background-sharpmint-03: 25, 25, 25;
@ -54,41 +54,41 @@
--theme-preset-accent-sharpmint: 25, 25, 25; --theme-preset-accent-sharpmint: 25, 25, 25;
--theme-preset-font-display-sharpmint: sans-serif; --theme-preset-font-display-sharpmint: sans-serif;
--theme-preset-font-ui-sharpmint: sans-serif; --theme-preset-font-ui-sharpmint: sans-serif;
--theme-preset-background-snowblue-01: 25, 25, 25; --theme-preset-background-snowglow-01: 25, 25, 25;
--theme-preset-background-snowblue-02: 25, 25, 25; --theme-preset-background-snowglow-02: 25, 25, 25;
--theme-preset-background-snowblue-03: 25, 25, 25; --theme-preset-background-snowglow-03: 25, 25, 25;
--theme-preset-background-snowblue-04: 25, 25, 25; --theme-preset-background-snowglow-04: 25, 25, 25;
--theme-preset-accent-snowblue: 25, 25, 25; --theme-preset-accent-snowglow: 25, 25, 25;
--theme-preset-font-display-snowblue: sans-serif; --theme-preset-font-display-snowglow: sans-serif;
--theme-preset-font-ui-snowblue: sans-serif; --theme-preset-font-ui-snowglow: sans-serif;
--theme-preset-background-chocorum-01: 25, 25, 25; --theme-preset-background-rumble-01: 25, 25, 25;
--theme-preset-background-chocorum-02: 25, 25, 25; --theme-preset-background-rumble-02: 25, 25, 25;
--theme-preset-background-chocorum-03: 25, 25, 25; --theme-preset-background-rumble-03: 25, 25, 25;
--theme-preset-background-chocorum-04: 25, 25, 25; --theme-preset-background-rumble-04: 25, 25, 25;
--theme-preset-accent-chocorum: 25, 25, 25; --theme-preset-accent-rumble: 25, 25, 25;
--theme-preset-font-display-chocorum: sans-serif; --theme-preset-font-display-rumble: sans-serif;
--theme-preset-font-ui-chocorum: sans-serif; --theme-preset-font-ui-rumble: sans-serif;
--theme-preset-background-sunburst-01: 25, 25, 25; --theme-preset-background-sollight-01: 25, 25, 25;
--theme-preset-background-sunburst-02: 25, 25, 25; --theme-preset-background-sollight-02: 25, 25, 25;
--theme-preset-background-sunburst-03: 25, 25, 25; --theme-preset-background-sollight-03: 25, 25, 25;
--theme-preset-background-sunburst-04: 25, 25, 25; --theme-preset-background-sollight-04: 25, 25, 25;
--theme-preset-accent-sunburst: 25, 25, 25; --theme-preset-accent-sollight: 25, 25, 25;
--theme-preset-font-display-sunburst: sans-serif; --theme-preset-font-display-sollight: sans-serif;
--theme-preset-font-ui-sunburst: sans-serif; --theme-preset-font-ui-sollight: sans-serif;
--theme-preset-background-coralgreen-01: 25, 25, 25; --theme-preset-background-artdeco-01: 25, 25, 25;
--theme-preset-background-coralgreen-02: 25, 25, 25; --theme-preset-background-artdeco-02: 25, 25, 25;
--theme-preset-background-coralgreen-03: 25, 25, 25; --theme-preset-background-artdeco-03: 25, 25, 25;
--theme-preset-background-coralgreen-04: 25, 25, 25; --theme-preset-background-artdeco-04: 25, 25, 25;
--theme-preset-accent-coralgreen: 25, 25, 25; --theme-preset-accent-artdeco: 25, 25, 25;
--theme-preset-font-display-coralgreen: sans-serif; --theme-preset-font-display-artdeco: sans-serif;
--theme-preset-font-ui-coralgreen: sans-serif; --theme-preset-font-ui-artdeco: sans-serif;
--theme-preset-background-purplegem-01: 25, 25, 25; --theme-preset-background-macaroon-01: 25, 25, 25;
--theme-preset-background-purplegem-02: 25, 25, 25; --theme-preset-background-macaroon-02: 25, 25, 25;
--theme-preset-background-purplegem-03: 25, 25, 25; --theme-preset-background-macaroon-03: 25, 25, 25;
--theme-preset-background-purplegem-04: 25, 25, 25; --theme-preset-background-macaroon-04: 25, 25, 25;
--theme-preset-accent-purplegem: 25, 25, 25; --theme-preset-accent-macaroon: 25, 25, 25;
--theme-preset-font-display-purplegem: sans-serif; --theme-preset-font-display-macaroon: sans-serif;
--theme-preset-font-ui-purplegem: sans-serif; --theme-preset-font-ui-macaroon: sans-serif;
--theme-preset-background-hotpepper-01: 25, 25, 25; --theme-preset-background-hotpepper-01: 25, 25, 25;
--theme-preset-background-hotpepper-02: 25, 25, 25; --theme-preset-background-hotpepper-02: 25, 25, 25;
--theme-preset-background-hotpepper-03: 25, 25, 25; --theme-preset-background-hotpepper-03: 25, 25, 25;
@ -96,13 +96,13 @@
--theme-preset-accent-hotpepper: 25, 25, 25; --theme-preset-accent-hotpepper: 25, 25, 25;
--theme-preset-font-display-hotpepper: sans-serif; --theme-preset-font-display-hotpepper: sans-serif;
--theme-preset-font-ui-hotpepper: sans-serif; --theme-preset-font-ui-hotpepper: sans-serif;
--theme-preset-background-steelgrey-01: 25, 25, 25; --theme-preset-background-steel-01: 25, 25, 25;
--theme-preset-background-steelgrey-02: 25, 25, 25; --theme-preset-background-steel-02: 25, 25, 25;
--theme-preset-background-steelgrey-03: 25, 25, 25; --theme-preset-background-steel-03: 25, 25, 25;
--theme-preset-background-steelgrey-04: 25, 25, 25; --theme-preset-background-steel-04: 25, 25, 25;
--theme-preset-accent-steelgrey: 25, 25, 25; --theme-preset-accent-steel: 25, 25, 25;
--theme-preset-font-display-steelgrey: sans-serif; --theme-preset-font-display-steel: sans-serif;
--theme-preset-font-ui-steelgrey: sans-serif; --theme-preset-font-ui-steel: sans-serif;
--theme-preset-background-outrun-01: 25, 25, 25; --theme-preset-background-outrun-01: 25, 25, 25;
--theme-preset-background-outrun-02: 25, 25, 25; --theme-preset-background-outrun-02: 25, 25, 25;
--theme-preset-background-outrun-03: 25, 25, 25; --theme-preset-background-outrun-03: 25, 25, 25;
@ -117,14 +117,14 @@
--theme-preset-accent-pumpkin: 25, 25, 25; --theme-preset-accent-pumpkin: 25, 25, 25;
--theme-preset-font-display-pumpkin: sans-serif; --theme-preset-font-display-pumpkin: sans-serif;
--theme-preset-font-ui-pumpkin: sans-serif; --theme-preset-font-ui-pumpkin: sans-serif;
--theme-preset-background-whoosh-01: 25, 25, 25; --theme-preset-background-bubblegum-01: 25, 25, 25;
--theme-preset-background-whoosh-02: 25, 25, 25; --theme-preset-background-bubblegum-02: 25, 25, 25;
--theme-preset-background-whoosh-03: 25, 25, 25; --theme-preset-background-bubblegum-03: 25, 25, 25;
--theme-preset-background-whoosh-04: 25, 25, 25; --theme-preset-background-bubblegum-04: 25, 25, 25;
--theme-preset-accent-whoosh: 25, 25, 25; --theme-preset-accent-bubblegum: 25, 25, 25;
--theme-preset-font-display-whoosh: sans-serif; --theme-preset-font-display-bubblegum: sans-serif;
--theme-preset-font-ui-whoosh: sans-serif; --theme-preset-font-ui-bubblegum: sans-serif;
--theme-preset-preview-size: 7em; --theme-preset-preview-size: 6em;
/* header */ /* header */
--header-area-width: 100%; --header-area-width: 100%;
--header-shade-color: var(--theme-color-01); --header-shade-color: var(--theme-color-01);

179
src/index.html
View File

@ -38,7 +38,7 @@
<link rel="stylesheet" href="css/auto-suggest.css"> <link rel="stylesheet" href="css/auto-suggest.css">
<link rel="stylesheet" href="css/fontawesome.css"> <link rel="stylesheet" href="css/fontawesome.css">
<!-- end-css-block --> <!-- end-css-block -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Abel|Alatsi|Big+Shoulders+Display|Calistoga|Fredoka+One|Girassol|Gugi|Lato|Life+Savers|Major+Mono+Display|Monoton|Montserrat|Muli|Odibee+Sans|Poiret+One|Quicksand|Raleway|Righteous|Roboto+Condensed|Source+Sans+Pro|Unica+One&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Abel|Alatsi|Big+Shoulders+Display|Calistoga|Fredoka+One|Girassol|Gugi|Lato|Life+Savers|Major+Mono+Display|Monoton|Montserrat|Muli|Odibee+Sans|Poiret+One|Quicksand|Raleway|Righteous|Roboto+Condensed|Source+Sans+Pro|Unica+One|Autour+One|Solway&display=swap">
</head> </head>
<body> <body>
@ -1344,16 +1344,31 @@
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-bluegum theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-pym theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-bluegum-01"></span> <span class="theme-preset-background-01 theme-preset-background-pym-01"></span>
<span class="theme-preset-background-02 theme-preset-background-bluegum-02"></span> <span class="theme-preset-background-02 theme-preset-background-pym-02"></span>
<span class="theme-preset-background-03 theme-preset-background-bluegum-03"></span> <span class="theme-preset-background-03 theme-preset-background-pym-03"></span>
<span class="theme-preset-background-04 theme-preset-background-bluegum-04"></span> <span class="theme-preset-background-04 theme-preset-background-pym-04"></span>
<span class="theme-preset-accent theme-preset-accent-bluegum"></span> <span class="theme-preset-accent theme-preset-accent-pym"></span>
<span class="theme-preset-font theme-preset-font-bluegum"> <span class="theme-preset-font theme-preset-font-pym">
<span class="theme-preset-font-display theme-preset-font-display-bluegum">Blue Gum</span> <span class="theme-preset-font-display theme-preset-font-display-pym">Pym</span>
<span class="theme-preset-font-ui theme-preset-font-ui-bluegum">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-pym">ABC 123</span>
</span>
</div>
</button>
</div>
<div class="button-wrap">
<button class="control-theme-preset-cruiser theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-cruiser-01"></span>
<span class="theme-preset-background-02 theme-preset-background-cruiser-02"></span>
<span class="theme-preset-background-03 theme-preset-background-cruiser-03"></span>
<span class="theme-preset-background-04 theme-preset-background-cruiser-04"></span>
<span class="theme-preset-accent theme-preset-accent-cruiser"></span>
<span class="theme-preset-font theme-preset-font-cruiser">
<span class="theme-preset-font-display theme-preset-font-display-cruiser">Cruiser</span>
<span class="theme-preset-font-ui theme-preset-font-ui-cruiser">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
@ -1374,76 +1389,76 @@
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-snowblue theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-snowglow theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-snowblue-01"></span> <span class="theme-preset-background-01 theme-preset-background-snowglow-01"></span>
<span class="theme-preset-background-02 theme-preset-background-snowblue-02"></span> <span class="theme-preset-background-02 theme-preset-background-snowglow-02"></span>
<span class="theme-preset-background-03 theme-preset-background-snowblue-03"></span> <span class="theme-preset-background-03 theme-preset-background-snowglow-03"></span>
<span class="theme-preset-background-04 theme-preset-background-snowblue-04"></span> <span class="theme-preset-background-04 theme-preset-background-snowglow-04"></span>
<span class="theme-preset-accent theme-preset-accent-snowblue"></span> <span class="theme-preset-accent theme-preset-accent-snowglow"></span>
<span class="theme-preset-font theme-preset-font-snowblue"> <span class="theme-preset-font theme-preset-font-snowglow">
<span class="theme-preset-font-display theme-preset-font-display-snowblue">Snow Blue</span> <span class="theme-preset-font-display theme-preset-font-display-snowglow">Snow Glow</span>
<span class="theme-preset-font-ui theme-preset-font-ui-snowblue">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-snowglow">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-chocorum theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-rumble theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-chocorum-01"></span> <span class="theme-preset-background-01 theme-preset-background-rumble-01"></span>
<span class="theme-preset-background-02 theme-preset-background-chocorum-02"></span> <span class="theme-preset-background-02 theme-preset-background-rumble-02"></span>
<span class="theme-preset-background-03 theme-preset-background-chocorum-03"></span> <span class="theme-preset-background-03 theme-preset-background-rumble-03"></span>
<span class="theme-preset-background-04 theme-preset-background-chocorum-04"></span> <span class="theme-preset-background-04 theme-preset-background-rumble-04"></span>
<span class="theme-preset-accent theme-preset-accent-chocorum"></span> <span class="theme-preset-accent theme-preset-accent-rumble"></span>
<span class="theme-preset-font theme-preset-font-chocorum"> <span class="theme-preset-font theme-preset-font-rumble">
<span class="theme-preset-font-display theme-preset-font-display-chocorum">Choco Rum</span> <span class="theme-preset-font-display theme-preset-font-display-rumble">Rumble</span>
<span class="theme-preset-font-ui theme-preset-font-ui-chocorum">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-rumble">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-sunburst theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-sollight theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-sunburst-01"></span> <span class="theme-preset-background-01 theme-preset-background-sollight-01"></span>
<span class="theme-preset-background-02 theme-preset-background-sunburst-02"></span> <span class="theme-preset-background-02 theme-preset-background-sollight-02"></span>
<span class="theme-preset-background-03 theme-preset-background-sunburst-03"></span> <span class="theme-preset-background-03 theme-preset-background-sollight-03"></span>
<span class="theme-preset-background-04 theme-preset-background-sunburst-04"></span> <span class="theme-preset-background-04 theme-preset-background-sollight-04"></span>
<span class="theme-preset-accent theme-preset-accent-sunburst"></span> <span class="theme-preset-accent theme-preset-accent-sollight"></span>
<span class="theme-preset-font theme-preset-font-sunburst"> <span class="theme-preset-font theme-preset-font-sollight">
<span class="theme-preset-font-display theme-preset-font-display-sunburst">Sun Burst</span> <span class="theme-preset-font-display theme-preset-font-display-sollight">Sol Light</span>
<span class="theme-preset-font-ui theme-preset-font-ui-sunburst">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-sollight">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-coralgreen theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-artdeco theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-coralgreen-01"></span> <span class="theme-preset-background-01 theme-preset-background-artdeco-01"></span>
<span class="theme-preset-background-02 theme-preset-background-coralgreen-02"></span> <span class="theme-preset-background-02 theme-preset-background-artdeco-02"></span>
<span class="theme-preset-background-03 theme-preset-background-coralgreen-03"></span> <span class="theme-preset-background-03 theme-preset-background-artdeco-03"></span>
<span class="theme-preset-background-04 theme-preset-background-coralgreen-04"></span> <span class="theme-preset-background-04 theme-preset-background-artdeco-04"></span>
<span class="theme-preset-accent theme-preset-accent-coralgreen"></span> <span class="theme-preset-accent theme-preset-accent-artdeco"></span>
<span class="theme-preset-font theme-preset-font-coralgreen"> <span class="theme-preset-font theme-preset-font-artdeco">
<span class="theme-preset-font-display theme-preset-font-display-coralgreen">Coral Green</span> <span class="theme-preset-font-display theme-preset-font-display-artdeco">Art Deco</span>
<span class="theme-preset-font-ui theme-preset-font-ui-coralgreen">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-artdeco">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-purplegem theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-macaroon theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-purplegem-01"></span> <span class="theme-preset-background-01 theme-preset-background-macaroon-01"></span>
<span class="theme-preset-background-02 theme-preset-background-purplegem-02"></span> <span class="theme-preset-background-02 theme-preset-background-macaroon-02"></span>
<span class="theme-preset-background-03 theme-preset-background-purplegem-03"></span> <span class="theme-preset-background-03 theme-preset-background-macaroon-03"></span>
<span class="theme-preset-background-04 theme-preset-background-purplegem-04"></span> <span class="theme-preset-background-04 theme-preset-background-macaroon-04"></span>
<span class="theme-preset-accent theme-preset-accent-purplegem"></span> <span class="theme-preset-accent theme-preset-accent-macaroon"></span>
<span class="theme-preset-font theme-preset-font-purplegem"> <span class="theme-preset-font theme-preset-font-macaroon">
<span class="theme-preset-font-display theme-preset-font-display-purplegem">Purple Gem</span> <span class="theme-preset-font-display theme-preset-font-display-macaroon">Macaroon</span>
<span class="theme-preset-font-ui theme-preset-font-ui-purplegem">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-macaroon">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
@ -1464,16 +1479,16 @@
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-steelgrey theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-steel theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-steelgrey-01"></span> <span class="theme-preset-background-01 theme-preset-background-steel-01"></span>
<span class="theme-preset-background-02 theme-preset-background-steelgrey-02"></span> <span class="theme-preset-background-02 theme-preset-background-steel-02"></span>
<span class="theme-preset-background-03 theme-preset-background-steelgrey-03"></span> <span class="theme-preset-background-03 theme-preset-background-steel-03"></span>
<span class="theme-preset-background-04 theme-preset-background-steelgrey-04"></span> <span class="theme-preset-background-04 theme-preset-background-steel-04"></span>
<span class="theme-preset-accent theme-preset-accent-steelgrey"></span> <span class="theme-preset-accent theme-preset-accent-steel"></span>
<span class="theme-preset-font theme-preset-font-steelgrey"> <span class="theme-preset-font theme-preset-font-steel">
<span class="theme-preset-font-display theme-preset-font-display-steelgrey">Steel Grey</span> <span class="theme-preset-font-display theme-preset-font-display-steel">Steel</span>
<span class="theme-preset-font-ui theme-preset-font-ui-steelgrey">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-steel">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
@ -1509,31 +1524,31 @@
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-whoosh theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-bubblegum theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-whoosh-01"></span> <span class="theme-preset-background-01 theme-preset-background-bubblegum-01"></span>
<span class="theme-preset-background-02 theme-preset-background-whoosh-02"></span> <span class="theme-preset-background-02 theme-preset-background-bubblegum-02"></span>
<span class="theme-preset-background-03 theme-preset-background-whoosh-03"></span> <span class="theme-preset-background-03 theme-preset-background-bubblegum-03"></span>
<span class="theme-preset-background-04 theme-preset-background-whoosh-04"></span> <span class="theme-preset-background-04 theme-preset-background-bubblegum-04"></span>
<span class="theme-preset-accent theme-preset-accent-whoosh"></span> <span class="theme-preset-accent theme-preset-accent-bubblegum"></span>
<span class="theme-preset-font theme-preset-font-whoosh"> <span class="theme-preset-font theme-preset-font-bubblegum">
<span class="theme-preset-font-display theme-preset-font-display-whoosh">Whoosh</span> <span class="theme-preset-font-display theme-preset-font-display-bubblegum">Bubble Gum</span>
<span class="theme-preset-font-ui theme-preset-font-ui-whoosh">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-bubblegum">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>
</div> </div>
<div class="button-wrap"> <div class="button-wrap">
<button class="control-theme-preset-eldergold theme-preset-button button mb-0" tabindex="-1"> <button class="control-theme-preset-elderbean theme-preset-button button mb-0" tabindex="-1">
<div class="theme-preset-preview"> <div class="theme-preset-preview">
<span class="theme-preset-background-01 theme-preset-background-eldergold-01"></span> <span class="theme-preset-background-01 theme-preset-background-elderbean-01"></span>
<span class="theme-preset-background-02 theme-preset-background-eldergold-02"></span> <span class="theme-preset-background-02 theme-preset-background-elderbean-02"></span>
<span class="theme-preset-background-03 theme-preset-background-eldergold-03"></span> <span class="theme-preset-background-03 theme-preset-background-elderbean-03"></span>
<span class="theme-preset-background-04 theme-preset-background-eldergold-04"></span> <span class="theme-preset-background-04 theme-preset-background-elderbean-04"></span>
<span class="theme-preset-accent theme-preset-accent-eldergold"></span> <span class="theme-preset-accent theme-preset-accent-elderbean"></span>
<span class="theme-preset-font theme-preset-font-eldergold"> <span class="theme-preset-font theme-preset-font-elderbean">
<span class="theme-preset-font-display theme-preset-font-display-eldergold">Elder Gold</span> <span class="theme-preset-font-display theme-preset-font-display-elderbean">Elder Bean</span>
<span class="theme-preset-font-ui theme-preset-font-ui-eldergold">ABC 123</span> <span class="theme-preset-font-ui theme-preset-font-ui-elderbean">ABC 123</span>
</span> </span>
</div> </div>
</button> </button>

51
src/js/control.js
View File

@ -2580,10 +2580,25 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-bluegum"), element: helper.e(".control-theme-preset-pym"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("bluegum"); theme.preset("pym");
theme.render.font.display();
theme.render.font.ui();
theme.style.check();
theme.render.color.shade();
theme.render.accent.color();
theme.render.radius();
link.groupAndItems();
render.update();
render.class();
}
}, {
element: helper.e(".control-theme-preset-cruiser"),
type: "button",
func: function() {
theme.preset("cruiser");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2610,10 +2625,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-snowblue"), element: helper.e(".control-theme-preset-snowglow"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("snowblue"); theme.preset("snowglow");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2625,10 +2640,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-chocorum"), element: helper.e(".control-theme-preset-rumble"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("chocorum"); theme.preset("rumble");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2640,10 +2655,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-sunburst"), element: helper.e(".control-theme-preset-sollight"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("sunburst"); theme.preset("sollight");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2655,10 +2670,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-coralgreen"), element: helper.e(".control-theme-preset-artdeco"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("coralgreen"); theme.preset("artdeco");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2670,10 +2685,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-purplegem"), element: helper.e(".control-theme-preset-macaroon"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("purplegem"); theme.preset("macaroon");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2700,10 +2715,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-steelgrey"), element: helper.e(".control-theme-preset-steel"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("steelgrey"); theme.preset("steel");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2745,10 +2760,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-whoosh"), element: helper.e(".control-theme-preset-bubblegum"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("whoosh"); theme.preset("bubblegum");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();
@ -2760,10 +2775,10 @@ var control = (function() {
render.class(); render.class();
} }
}, { }, {
element: helper.e(".control-theme-preset-eldergold"), element: helper.e(".control-theme-preset-elderbean"),
type: "button", type: "button",
func: function() { func: function() {
theme.preset("eldergold"); theme.preset("elderbean");
theme.render.font.display(); theme.render.font.display();
theme.render.font.ui(); theme.render.font.ui();
theme.style.check(); theme.style.check();

43
src/js/theme.js
View File

@ -191,7 +191,32 @@ var theme = (function() {
radius: 0.5, radius: 0.5,
style: "dark" style: "dark"
}, },
bluegum: { pym: {
font: {
display: "Autour One",
ui: "Solway"
},
color: {
hsl: {
h: 278,
s: 73,
l: 50
},
rgb: {
r: 153,
g: 34,
b: 221
}
},
accent: {
r: 0,
g: 255,
b: 170
},
radius: 0.1,
style: "dark"
},
cruiser: {
font: { font: {
display: "Alatsi", display: "Alatsi",
ui: "Source Sans Pro" ui: "Source Sans Pro"
@ -241,7 +266,7 @@ var theme = (function() {
radius: 0.8, radius: 0.8,
style: "dark" style: "dark"
}, },
snowblue: { snowglow: {
font: { font: {
display: "Righteous", display: "Righteous",
ui: "Raleway" ui: "Raleway"
@ -266,7 +291,7 @@ var theme = (function() {
radius: 0, radius: 0,
style: "light" style: "light"
}, },
chocorum: { rumble: {
font: { font: {
display: "Odibee Sans", display: "Odibee Sans",
ui: "Roboto Condensed" ui: "Roboto Condensed"
@ -291,7 +316,7 @@ var theme = (function() {
radius: 0.75, radius: 0.75,
style: "dark" style: "dark"
}, },
sunburst: { sollight: {
font: { font: {
display: "Fredoka One", display: "Fredoka One",
ui: "Muli" ui: "Muli"
@ -316,7 +341,7 @@ var theme = (function() {
radius: 0.5, radius: 0.5,
style: "light" style: "light"
}, },
coralgreen: { artdeco: {
font: { font: {
display: "Poiret One", display: "Poiret One",
ui: "Lato" ui: "Lato"
@ -341,7 +366,7 @@ var theme = (function() {
radius: 2, radius: 2,
style: "dark" style: "dark"
}, },
purplegem: { macaroon: {
font: { font: {
display: "Calistoga", display: "Calistoga",
ui: "Source Sans Pro" ui: "Source Sans Pro"
@ -391,7 +416,7 @@ var theme = (function() {
radius: 0.6, radius: 0.6,
style: "dark" style: "dark"
}, },
steelgrey: { steel: {
font: { font: {
display: "Abel", display: "Abel",
ui: "Raleway" ui: "Raleway"
@ -466,7 +491,7 @@ var theme = (function() {
radius: 0.2, radius: 0.2,
style: "dark" style: "dark"
}, },
whoosh: { bubblegum: {
font: { font: {
display: "Monoton", display: "Monoton",
ui: "Lato" ui: "Lato"
@ -491,7 +516,7 @@ var theme = (function() {
radius: 1.2, radius: 1.2,
style: "dark" style: "dark"
}, },
eldergold: { elderbean: {
font: { font: {
display: "Life Savers", display: "Life Savers",
ui: "Quicksand" ui: "Quicksand"