search

rust-lang / blog.rust-lang.org

Home of the Rust and Inside Rust blogs
https://blog.rust-lang.org
Apache License 2.0
354 stars 285 forks source link

Add dark mode scss #1343

Closed apiraino closed 1 month ago

apiraino commented 4 months ago

First attempt at avoiding being shock blinded when visiting the blog :smile:

Note: this CSS applies only to the blog i.e. external links to www.rust-lang.org will take users to #fff land for now.

Preview (top)

![Screenshot 2024-08-20 at 15-36-43 The Rust Programming Language Blog](https://github.com/user-attachments/assets/baaea6b5-2ea4-44eb-a2de-1c7dfaafbdb8)

Preview (bottom)

![Screenshot 2024-06-13 at 20-49-34 The Rust Programming Language Blog](https://github.com/rust-lang/blog.rust-lang.org/assets/6098822/33039a03-dcbe-4477-b6f5-ff85fae79436)

Example blog post

![Screenshot 2024-07-29 at 17-17-31](https://github.com/user-attachments/assets/b48067a0-aa9e-40f0-bf46-45144182c3bb)

Mobile view (simulated)

![Screenshot 2024-08-20 at 15-38-06 The Rust Programming Language Blog](https://github.com/user-attachments/assets/6277e353-e127-4e08-9824-1883aaec0ec3)

credits to @teohhanhui for providing 80% of this work, thanks!

apiraino commented 3 months ago

cc @Turbo87 for a review (unsure who is actually in charge for the blog)

thanks

apiraino commented 2 months ago

@GuillaumeGomez I think we can now review the CSS for the dark mode. Took me a while to figure out a workflow allowing me to test all the changes ensuring that nothing in the light mode would change.

I like the colors of the dark mode (see screenshots in the first comment) but I'm open to changes. HTML var names are also a bit random, I'm happy to receive suggestions for more meaningful names.

In a follow-up patch, I'd like to add a button to switch theme. This will unfortunately make the blog not javascript-free anymore, I'm afraid :disappointed:

Let me know your thoughts! Thanks :3

GuillaumeGomez commented 2 months ago

Apart from the two variables with confusing names, it looks all good to me. Great job!

In a follow-up patch, I'd like to add a button to switch theme. This will unfortunately make the blog not javascript-free anymore, I'm afraid 😞

For me, the important part isn't that it's actually JS-free but rather than it works without JS and that JS only provides limited and secondary improvements. So handling themes with a button doesn't seem that bad to me (and will not require a lot of JS either).

apiraino commented 2 months ago

ok @GuillaumeGomez I've added a theme selector :slightly_smiling_face: Notes:

GuillaumeGomez commented 2 months ago

Looks all good to me, thanks! Now the big question is: who is allowed to merge in this repository? I can but not sure I should. :sweat_smile:

apiraino commented 2 months ago

ok @GuillaumeGomez: as far as I can see - we should be there. I can't think of anything else to add right now.

(I'll update the screenshots in the opening comment to reflect the latest version)

apiraino commented 1 month ago

Looks good to me. Some non-blocking thoughts:

* Is it possible to switch to a white version of the Rust logo? The black one is hard to see on the dark background.

* Are there actually people who have dark mode enabled and go around manually reenabling light mode on certain websites? The javascript seems unnecessary to me, but I might be wrong.

* The formatting changes are a bit irritating, but setting up auto-formatting and CI is something for another PR.

hey @senekor I've fixed the Rust logo and removed the formatting to make it a clean PR.

About the JavaScript to switch theme, I kind of agree with you, I was hesitant either but every Rust site has that (rustdoc, www, not to mention clippy's that without JS is broken) 🤷‍♂️ If you feel strongly about it, happy[^1] to remove it.

[^1]: speaking as someone that usually keeps the NoScript extension on ;-)