[Feat]: Added the dark/light theme #56
Conversation
|
@mohit-bhandari45 is attempting to deploy a commit to the snipsavvy's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
@mohit-bhandari45 what abt internal tool for dark/light theme functionality ? |
Means? |
src/app/page.tsx
Outdated
| "use client" | ||
| import { Button } from "@/components/LandingPage/Button"; |
There was a problem hiding this comment.
we can not make the page.tsx as a client component, as next js says it is a server side and should kept as server side only.
There was a problem hiding this comment.
we can not make the page.tsx as a client component, as next js says it is a server side and should kept as server side only.
Actually I am using usestate and useeffect hooks in this file. So it need to be a client component as server components doesn't allow it.
There was a problem hiding this comment.
yaa, so in that case u should consider creating an another client component, and then should use here!
There was a problem hiding this comment.
Yeah, it can be done but need to shift all the content of page.tsx to a separate page as different components are using the theme. There should be only on componentin page.tsx like this:-
Will it create problem for you?
src/app/page.tsx
Outdated
| </section> | ||
| <section className="w-full py-12 md:py-20 lg:pt-32 pb-24 bg-[#0E0E11] px-32"> | ||
| <section className={`${theme === "true" ? "bg-[#0E0E11] text-gray-50" : "bg-[#ffffff] text-black"} w-full py-12 md:py-20 lg:pt-32 pb-24 px-32`}> | ||
| <div className="container grid items-center justify-center gap-4 px-4 text-center md:px-6 lg:gap-10"> |
There was a problem hiding this comment.
instead of having this check in all the classes, can't we have a better way of doing this?
There was a problem hiding this comment.
I think, we have to make check in main divs, so that the classes adjust according to theme.
|
@mohit-bhandari45 we have an internal tool .. after login into the platform ! |
|
Hello @mohit-bhandari45 have some feedback for you regarding this PR, can you hmu at discord @chaitanya, you will find me in the project channel |
bro this is my linkedin |
|
Are you on discord? Message me there, trying to keep all project related stuff to discord, thanks |
You are not accepting requests |
|
this is mine :- mohit_bhandari_81404 |
|
Messaged you, check inbox |
|
@cb7chaitanya @sahilrohera10 |
|
@mohit-bhandari45 Just add a short clip showing your changes , just to ensure everything works fine |
Hey really sorry for the late reply. prev27.mp4 |
|
@cb7chaitanya @sahilrohera10 @yash-25log do check the demo video and review it. |
|
@cb7chaitanya @yash-25log @sahilrohera10 kindly please review this pr and update me |
Fixes #43
Description:-
So as I suggested, a dark/light mode feature. I have completed that. I have made a dark and light theme toggling.
Interestingly the local instance of your last time will also be saved and according to that, the theme will be changed.
I have followed the code and done no harm to the code.
Screenshots:-
Review this PR and label it accordingly.