Summary | Header Gradient and Composer Gradient | |
Preview | Theme Creator | |
Repository | GitHub - t1-tracey/discourse-header-gradient: Gradient header - Discourse theme component | |
Install Guide | How to install a theme or theme component | |
New to Discourse Themes? | Beginner’s guide to using Discourse Themes |
Install this theme component
Simple rainbow gradient in the header and composer, as a theme component — so you can add it to other themes.
Screenshots
Settings and info
Header icon colors
In your color palette, you can control the color of the icons in the header with header primary & header background colors. (I would like to look into tweaking it so you just have to set the one variable instead of two)
I didn’t want to hard-code this color in case people want to install this component on multiple themes (e.g. with dark and light color palettes)
Here’s how to change the color of the icons:
-
white: You can set both of these values to
#ffffff
-
black: You can set both of these values to
#000000
FYI: The reason for having to set both is because the actual header icon color is dependent on mixing header primary with the header background color.
Credits
Thanks to the Ghost cyberpunk theme, Peacock Gradient theme and Discourse Rainbow theme which I variously took inspiration or used code from over the years (I added credits for each part in comments in theme code)
TODO:
-
I’m hoping to figure out how to make the gradient colors customisable as theme settings - just never had the chance to really look into it.
-
make it so that you can customise the color of the header icons by just setting the header primary color (the header background color is not relevant to the user because the whole header background is rainbow gradient)