Feature request: Theme customization

[zacheller]

The theme currently defines what the background color is; on dark mode, the inner box color is #2e2e3f normally. I would like to be able to easily change this.

You can change the background color of the cells one by one, but I wondered if there would be a way to simultaneously change the background color of all of the cells whose colors haven't been set.

Any quick hacks would also be appreciated!

[clemiller]

Hi @zacheller,

Thanks for reaching out! You're correct that there isn't currently a way to customize the default background color of the technique cells. I think this could be an interesting feature to add - perhaps this could be modeled similarly to the customizable tactic row background in the color setup dropdown menu:

As for quick hacks: you can modify the default background color in nav-app/src/app/matrix/technique-cell/technique-cell.component.scss by replacing the color(dark-2) text on this line with the desired hex value. This will update the default background color of all technique cells to that hex value. If you're interested in changing the default text color on these cells (in case the text is too difficult to read with the new background color), you can also replace the on-color(dark-3) text on the next line. I hope this helps!

I'll leave this issue open and mark it as "seeking feedback" in case others are interested in this feature as well and would like to share their thoughts.

[zacheller]

Thank you so much--changing the cell backgrounds worked!
FYI, altering on-color(dark-3) didn't change the correct text when I tried it. It changed the (3/3) part of the cell, but it might have to do with the adaptive coloring.

[clemiller]

Ah, you're absolutely right, sorry about that! Thank you for pointing it out. The default cell text color is actually assigned in the getTechniqueTextColor() function in nav-app/src/app/matrix/cell.ts on the last line. It's a bit of a hack, but that line can be changed to return the desired hex code for the default text color (e.g. else return "#000000"; - make sure to include the quotation marks around the hex code).