DEV: Experimenting with using built in core color palettes for the color picking component (#71)

This PR is the beginning of converting the color picker to use built in
core color palettes.
The `color_schemes` defined in `about.json` are created in core when the
theme is imported,
and we then show all user-selectable color palettes in this sidebar
footer menu.

An important caveat here is that all of the Horizon themes must be
changed to `user_selectable`
otherwise they will not show up in the color palette selector in the
sidebar.

When choosing a color palette that also has a corresponding dark color
palette,
*both* light mode and dark mode are correctly saved with the color
palette(s) chosen,
using the color palette cookie we already have in core.

Anon users can also set a palette, which will be saved in a cookie.

---------

Co-authored-by: Sérgio Saquetim <saquetim@discourse.org>
Co-authored-by: Martin Brennan <martin@discourse.org>
Co-authored-by: Osama Sayegh <asooomaasoooma90@gmail.com>
This commit is contained in:
Jordan Vidrine
2025-03-30 22:28:28 -05:00
committed by GitHub
parent 0473f90cd9
commit b4e451e64b
14 changed files with 506 additions and 251 deletions
+36 -12
View File
@@ -20,62 +20,86 @@
"Horizon": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "595bca"
"tertiary": "595bca",
"tertiary-med-or-tertiary": "595bca",
"selected": "d7dfff"
},
"Horizon Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "595bca"
"tertiary": "595bca",
"tertiary-med-or-tertiary": "595bca",
"selected": "3b3e56"
},
"Royal": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "4169e1"
"tertiary": "4169e1",
"tertiary-med-or-tertiary": "4169e1",
"selected": "c7e3ff"
},
"Royal Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "4169e1"
"tertiary": "4169e1",
"tertiary-med-or-tertiary": "4169e1",
"selected": "3a455f"
},
"Clover": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "45a06e"
"tertiary": "45a06e",
"tertiary-med-or-tertiary": "45a06e",
"selected": "c6f1d5"
},
"Clover Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "45a06e"
"tertiary": "45a06e",
"tertiary-med-or-tertiary": "45a06e",
"selected": "47594e"
},
"Lily": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "cc338c"
"tertiary": "cc338c",
"tertiary-med-or-tertiary": "cc338c",
"selected": "ffc8ee"
},
"Lily Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "cc338c"
"tertiary": "cc338c",
"tertiary-med-or-tertiary": "cc338c",
"selected": "5f3e4e"
},
"Violet": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "9b15de"
"tertiary": "9b15de",
"tertiary-med-or-tertiary": "9b15de",
"selected": "feccff"
},
"Violet Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "9b15de"
"tertiary": "9b15de",
"tertiary-med-or-tertiary": "9b15de",
"selected": "4c385c"
},
"Marigold": {
"primary": "1A1A1A",
"secondary": "ffffff",
"tertiary": "d3881f"
"tertiary": "d3881f",
"tertiary-med-or-tertiary": "d3881f",
"selected": "ffdcb2"
},
"Marigold Dark": {
"primary": "ffffff",
"secondary": "1A1A1A",
"tertiary": "d3881f"
"tertiary": "d3881f",
"tertiary-med-or-tertiary": "d3881f",
"selected": "6c5b49"
}
}
}