some elements changed to dark mode#2
some elements changed to dark mode#2joshuawootonn merged 21 commits intojoshuawootonn:mainfrom IsaacHatton:main
Conversation
|
Someone is attempting to deploy a commit to a Personal Account owned by @joshuawootonn on Vercel. @joshuawootonn first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
Thanks for making the vercel deploy preview work, I will try and make the remaining required changes by referencing this. |
|
Hey @IsaacHatton. Thanks for putting this together! If you rebase onto main I just updated the project to load Genesis 1, Psalm 23, and James 1 without and API key. Hope that is helpful! |
|
Thanks, that's really helpful! |
|
Sweet! |
|
Hey also, I like the idea of having this based solely on system preferences. So no need to add a toggle button! |
|
Hi, |
There was a problem hiding this comment.
Hey! this is looking great. I was worried that the white on black would be to strong, but I am loving it.
I have two main comments:
- I would prefer to not add custom styles to the scroll bar and instead user
color-scheme: dark - I would prefer to keep text color changes in tailwind typography as much as we can. You can tell where I am using tailwind typography by the
proseclass.
I added two commits:
- I added styles for the history page
- and made the
svg-outline(what I am using for focus indication) compatible with dark mode
Overall though this is going great. Thanks for jumping in 🙌🏼
src/pages/why.tsx
Outdated
| <Navigation /> | ||
|
|
||
| <main className="prose relative mx-auto w-full flex-grow pt-4 text-lg lg:pt-8"> | ||
| <main className="prose relative mx-auto w-full flex-grow pt-4 text-lg lg:pt-8 dark:text-white"> |
There was a problem hiding this comment.
This prose class indicates to @tailwindcss/typography that all of the descendants should be automatically styled. Tailwind typography is just a tailwind plugin for adding some great default styles to markup.
I think the correct solution here is: https://tailwindcss.com/docs/typography-plugin#adapting-to-dark-mode
But if that doesn't work add these styles with prose-headings:dark:text-white for example. More details.
Is this just because you didn't want to login with google? Or did you run into something weird when logging in? I am asking because the app is in the middle of verification right now. |
When I tried to login on the deploy preview, the url of the deploy preview didn't match the website so it refused. |
|
Hi @joshuawootonn, I have tried to make some changes, please can you check if they are working properly. |
Hey! I made these changes because I want to have as small of a blast radius as I can with this PR. The reason I went with tailwind typography is because you can style things nicely without having styles on every element in your markup. I would love it if you could go through each of the remaining files and double check that they actually are required.
|
@IsaacHatton I went through these files line by line to see what was needed and not. I did this because I want as much of the dark mode styles to come from inherited colors as possible. In theory, it would be great if we could just set The reason you were running into a problem in If you could go through the remaining files and double check that only the critical things have changed I would appreciate it. If you can do that I can resolve the conflict and get this merged tomorrrow. |
|
Ok, I will go through them shortly. |
|
I have gone through the files, think I have caught all of them, but I may have missed some. |
|
Merged! Thanks for the help @IsaacHatton 🙌🏼 |
|
Yo @IsaacHatton. I have never had anyone contribute to a project I created. Just wanted to say that this is kinda big for me. I actually do really appreciate your initiative. I would love to meet you. If you are free in January, let chat: https://calendly.com/joshuawootonn/1on1 No real expectation here, I just like meeting other developers and hearing their story. |
|
Hi @joshuawootonn, I have just sent you an email with some details about me and my story. Thanks for giving me this opportunity to contribute. |

Changing some elements to make them work with dark mode, definitely not finished in all elements as I don't have a crossway key so I can't load up the entire app.