Support Night Mode for https://blog.rust-lang.org/

[DeltaManiac]

16 Custom CSS for Night Mode rustlang blog

@Cldfire Should we have a separate css file for the blog template ?

[DeltaManiac]

I went ahead and created a separate file for blog.rust-lang and cleaned up the style sheet a bit

[Cldfire]

Hello! Thanks for the PR. It looks good, but there are a few things I'd like to see done before I merge it.

• There's no need to have separate CSS for the blog and TWiR; I think we can just merge those back together (similar to the first commit) and call the file rust-blog.css. The CSS base that applies to TWiR also applies very nicely to the Rust blog as they are very similar sites, so it makes sense to leave it in the same file for easy maintenance. If they ever change drastically in the future we can split it up then.

• This rule:

  pre, code {
  // ...
  }

  Needs one small change to the following:

  pre > code {
  // ...
  }

  This allows the inline code sections to stay orange rather than white. The > means that only code elements that are direct children of a pre element will be given that style, whereas the , means that the style is applied separately to both pre and code elements (which we don't want).

• Code blocks have a white border around them that we need to get rid of. We can do this by adding border: none; to the .highlight rule.

• The multi-line code blocks have a scrollbar at the bottom of every one, even if it's not necessary. This isn't because of something you did, it's just a part of the site by default (not sure why). I'd like to clean that up in our theme here. We can do that by adding the following rule:

  pre {
  overflow-x: auto;
  }

Now there will only be scrollbars where they are needed, which is nice.

• There will need to be a couple of changes in main.rs of the combine-for-release program to accommodate the new CSS:
  • The twir variable will need to have its name changed and the include_str! path to the appropriate CSS file will need to be changed
  • The output string will need a small modification. At the very bottom, where it is currently adding the TWiR CSS and applying it to this-week-in-rust.org, we'll need to:
  • Add a new domain rule to apply the CSS to the rust blog as well. The other parts of the output string are a good example of how to do this. All we need to do is add a comma and then a new domain rule with the correct URL (domain(\"blog.rust-lang.org\")).
  • Change the twir variable usage to whatever you renamed it to above.

That process is kind of annoying and ugly. Hopefully in the future I'll find the time to clean it up and make it simpler to specify which CSS gets applied where (perhaps in a TOML file or something).

Anyway, that's about all I can think of right now. Once you add a commit with those changes I'll make another pass over it and we'll get it ready to merge in no time 😄.

Thanks again for taking the time to do this!

[DeltaManiac]

Thanks for the original implementation and your current suggestions, they have been done. Also fixed the code highlight to look much better without the border. 😀

[Cldfire]

Perfect! Everything looks good now, so I'm going to merge it.

Thank you for your contribution.