Customize all colors in a skin?

[nitroamos]

I'm looking for the easiest way to alter all the colors in the Tahoe skin to match the pre-existing (green) theme I'm working with. I started off by making my own .css file as a proof of concept, but it's looking like some kind of "shadow" css of skin_styles.css (snippet below) which seems fragile and tedious to create besides, so I'm now beginning to think it would be better for me to write a pre-processing script where I can map skin_styles.css's colors systematically before checking it into my repo. Before heading that direction, I'm wondering if you have other suggestions for how I could do this.



For example, I see in skin_styles.css that it's the product of an scss system of yours which you do not release. Incorporating a Sass pre-processing step for Tahoe to my app's build would not be hard since it already uses Sass...

        .gridSummaryCell,
        .gridSummaryCellAltCol {
            color: #666;
            background-color: #dff4e9;
        }

        .groupNode {
            color: #666;
        }

        .spannedHeaderButton,
        .spannedHeaderButtonOver,
        .spannedHeaderButtonDown,
        .spannedHeaderButtonSelected,
        .spannedHeaderButtonSelectedDown,
        .spannedHeaderButtonSelectedOver,
        .headerButton,
        .headerButtonOver,
        .headerButtonDown,
        .headerButtonSelected,
        .headerButtonSelectedDown,
        .headerButtonSelectedOver {
            color: #666;
            background-color: #dff4e9;
            border-right: 1px solid white;
            border-bottom: 1px solid white;
        }

[nitroamos]

I just noticed this same topic elsewhere (#12) so ignore my Sass comment -- it sounds like you're already thinking about more wholistic approaches to this and I look forward to hearing about it.

I also just found that you have extra advice in your Quick Start guide which I'd summarize as "modify copies of the skin's files, not the originals".


It seems like my approach will probably end up writing a simple python text based substituter.

[nitroamos]

Here's a script I wrote just in case anybody else finds it useful. I didn't bother cleaning it up, so ymmv if anyone wants to take a different approach. I didn't bother hand-picking new colors for each Tahoe color because there are ~50-70 such choices (ignoring gray and non-blue colors). First, I tried swapping blue and green (both in RGB and in HSL coordinates), but neither looked really good. Then I tried converting to grayscale, and that does look good and it's somewhat neutral wrt other theme colors. On top of this, I hand-picked a couple colors.

Unfortunately, I can't upload the modified skin_styles.css because the file is bigger than this forum permits (and compressed files are disallowed).