Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: user guide dark mode #7463

Merged
merged 5 commits into from
May 2, 2023

Conversation

michalsn
Copy link
Member

Description
This is an ancient work from December. It adds a dark mode to our user guide.

Since Read the Docs doesn't have built-in support for the dark mode style, I implemented a solution strictly dependent on system settings. So there is no switch to enable or disable dark mode.

Preview: https://michalsn.github.io/CodeIgniter4/ - please don't test it on a sunny day 😅

Checklist:

  • Securely signed commits
  • Component(s) with PHPDoc blocks, only if necessary or adds value
  • Unit testing, with >80% coverage
  • User guide updated
  • Conforms to style guide

@lonnieezell
Copy link
Member

I think it looks great!

There are a couple of things I could nit-pick about but are just personal preference and wouldn't really need to change, I don't think.

Thanks!

@michalsn
Copy link
Member Author

I'm open to making improvements if folks think they are needed. However, changes may take me some time.

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

Preview: https://michalsn.github.io/CodeIgniter4/ - please don't test it on a sunny day 😅

How can I test it?
It is nighttime now, but the page is the same as during daylight hours.
Screenshot 2023-04-30 20 43 07

@michalsn
Copy link
Member Author

If you're on macOS, go to Settings -> Appearance, and there you have to enable "dark mode" or "auto mode".

image

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

I use "auto mode".

Ah, using Chrome, the page is in the dark mode.

@michalsn
Copy link
Member Author

michalsn commented Apr 30, 2023

Judging by your browser's color, dark mode is not yet active (you probably need to wait a bit longer).

Sorry I didn't notice your edit.

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

I don't know why, but Firefox does not show dark mode page unless I click the dark mode button.
Screenshot 2023-04-30 20 57 40

My setting in Firefox is also automatic.
Screenshot 2023-04-30 20 57 26

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

Chrome and Safari shows dark mode page.
There is a bug in Firefox?

@michalsn
Copy link
Member Author

Hmm... I will have to look into it.

So auto-mode in the system doesn't enable dark mode on the page. I will check it out today.

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

Class and function names are difficult to read.
Screenshot 2023-04-30 21 30 16
Screenshot 2023-04-30 21 32 15

@kenjis
Copy link
Member

kenjis commented Apr 30, 2023

I got the reason. My theme was "Light". It prevented dark mode.
I've changed it to "Firefox Alpenglow" or "Dark" or "System theme — auto", Firefox shows the dark pages.
Screenshot 2023-04-30 21 44 18

@michalsn
Copy link
Member Author

Thanks for figuring it out.

Function/class reference styles have been updated. It was strange because it was displaying correctly on my local build. Anyway, thanks for letting me know.

@datamweb
Copy link
Contributor

datamweb commented May 1, 2023

@michalsn I have a problem with the white border of the tables, I feel it conflicts with the dark mod.

Screenshot 2023-05-01 033919

Copy link
Member

@kenjis kenjis left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@kenjis
Copy link
Member

kenjis commented May 1, 2023

@datamweb What's wrong with the border?
This?
Screenshot 2023-05-01 20 48 34

@datamweb
Copy link
Contributor

datamweb commented May 1, 2023

What's wrong with the border?

No, I mean white color, I feel that this color is chosen too bright.

@michalsn
Copy link
Member Author

michalsn commented May 1, 2023

It wasn't strictly white, but I darkened it more, so it should be ok now. Let me know.

@datamweb
Copy link
Contributor

datamweb commented May 2, 2023

@michalsn thank you! nice.

@kenjis kenjis merged commit c2842c6 into codeigniter4:develop May 2, 2023
@michalsn michalsn deleted the feat/user-guide-dark-mode branch May 10, 2023 05:58
@kenjis kenjis added the enhancement PRs that improve existing functionalities label May 21, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement PRs that improve existing functionalities
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants