We all like code, let's face it. And with Code Review's upcoming graduation "colors" I'm sure that many would like for the large amount of code that is posted daily in questions and answers to look top-notch.
Whether Stack Exchange would be able to get CR our own code formatting is a bit up in the air at the moment, but it certainly can't hurt to put some ideas out there. So, here is what I propose:
Upvote your favorite formatting, and/or Downvote those you dislike. I will post a few basic examples, and below you will find some simple instructions on coming up with your own!
Come up with your own theme, and let the community vote on yours too!
Here's how:
I have set up a pretty easy way to come create your own theme, with even very rudimentary knowledge of CSS and HTML.
First, go to this small repository and download to your computer. You will then need to just make copies of two files, and then make changes as desired.
In
cardshifter.github.io/prettify-test
just copy either of the HTML files (depending if you prefer to start with the white or black template) into the same folder.In
cardshifter.github.io/prettify-test/color-themes-for-google-code-prettify-gh-pages/css/themes
make a copy of the corresponding CSS template (white or black) in that/css/themes
folder. Give it a unique name. (don't name using spaces; instead use hyphens or underscores)Go back to
cardshifter.github.io/prettify-test
and edit the following line in your new HTML file:<link rel="stylesheet" href="color-themes-for-google-code-prettify-gh-pages/css/themes/your-css-file-name.css">
Just replace
your-css-file-name.css
with the actual file name you made in step 2.Open your HTML file in a web browser, and open your CSS file in a text editor. The color values for the different CSS classes are largely hexadecimal. You can use this tool to help you changing the colors. Upon refreshing your web browser after saving changes to CSS file, you will see your new colors.
Write an answer with your CSS code, as well as a screenshot or two of what it looks like. I have set up demo code in the HTML templates to make it easy, but you're welcome to try some of your own code.
Just be mindful, due to having to escape HTML tags, <
in your code needs replaced with <
, and >
with >
within the <pre class="prettyprint">CODE HERE</pre>
sections.
Who will come up with the most popular design? Remains to be seen!