I'm a web developer/designer, and I need my code-illiterate clients to be able to easily mess with the colors of particular elements, save these CSS changes, and send them to me. I'll be guiding them over the phone, but I still need it to be easier than expecting them to locate CSS selectors in a theme sheet, and write hex codes.
I need an in-browser inspector that can allow a code-illiterate individual to:
I find the existence of this conundrum very baffling -- why have browser vendors bothered making such a rich web-page editing suite, where one can manipulate CSS, but not include a basic "save changes" feature? Am I missing something?
I have found, in Chrome, that one can freely manipulate an element's CSS with the inspector, then click on the CSS sheet associated with each rule (in the top-right corner of the rule) to take you to the Modified CSS Sheet in the Sources tab. This is what I want to save.
From here, one can right-click anywhere in this modified source code, and then Save-As -- but strangely, unfortunately, and unintuitively, Chrome saves the wrong source code. It saves the original, unmodified source code -- not the modified source code you had right-click save-as'd. Very frustrating, and I'm currently trying to find a way around this bug. I'm so close!
Okay, I've figured it out. When you save a file in Chrome's Sources tab, you're not just saving that file -- you're actually setting Chrome to constantly auto-save that file upon every change you make to it.
This is actually kind of cool, but very misleading.
So, after you save a CSS file, Every change you make to an element's CSS in the inspector, will auto-save to that file. This persists even if you restart the browser.
Confusion arose, because when you have a file marked for auto-saving, and you then Save-As a modified file, Chrome weirdly writes the original file, not the one you right-clicked. As soon as you make any change after that, when Chrome will auto-write every current modification to that file. I regard this to be a bug in Chrome.
Lesson be learned, First, Save-As the file. Second, make your changes.
Presto, your modified CSS theme awaits you on your hard disk.
To be clear, if you Save, then make changes, then save again -- Chrome will have saved the Original Source, not your Modified Source. This makes the order of things important.
I do not know of a way to see a list of files currently marked for auto-saving, or how to unmark them.
Keep in mind, however, that you must do things in this order. If you save the stylesheet, then make your CSS changes, then save again, Chrome will oddly write the original unmodified source to file (until you make one more change, which causes Chrome to auto-save all changes to file).