From bd51ba55755cd802d5df38b542aa4f1e33474dec Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 06:56:20 +0530 Subject: [PATCH 01/36] Update package.json --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 048a17d7..d93dfafa 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "intersection-observer": "^0.12.0", "minimatch": "^3.0.4", "next": "^12.0.7", + "next-themes": "^0.0.15", "postcss": "^8.4.4", "postcss-focus-visible": "^5.0.0", "postcss-import": "^14.0.2", From b1d3b4f534cef8ed0a115d44653e346ece5ec2d0 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 06:56:34 +0530 Subject: [PATCH 02/36] Update yarn.lock --- yarn.lock | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/yarn.lock b/yarn.lock index 8f559c7f..f6c31174 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4697,6 +4697,11 @@ neo-async@^2.6.2: resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f" integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw== +next-themes@^0.0.15: + version "0.0.15" + resolved "https://registry.yarnpkg.com/next-themes/-/next-themes-0.0.15.tgz#ab0cee69cd763b77d41211f631e108beab39bf7d" + integrity sha512-LTmtqYi03c4gMTJmWwVK9XkHL7h0/+XrtR970Ujvtu3s0kZNeJN24aJsi4rkZOI8i19+qq6f8j+8Duwy5jqcrQ== + next@^12.0.7: version "12.0.7" resolved "https://registry.yarnpkg.com/next/-/next-12.0.7.tgz#33ebf229b81b06e583ab5ae7613cffe1ca2103fc" From 0e0cc1826c55a35fd597f161618fc90ba2ced1ae Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 06:57:52 +0530 Subject: [PATCH 03/36] Update _app.js Add ThemeProvider --- src/pages/_app.js | 65 +++++++++++++++++++++++++---------------------- 1 file changed, 34 insertions(+), 31 deletions(-) diff --git a/src/pages/_app.js b/src/pages/_app.js index 9035e81a..505065a2 100644 --- a/src/pages/_app.js +++ b/src/pages/_app.js @@ -5,6 +5,7 @@ import ProgressBar from '@badrap/bar-of-progress' import { ResizeObserver } from '@juggle/resize-observer' import 'focus-visible' import 'intersection-observer' +import { ThemeProvider } from 'next-themes' import Head from 'next/head' import Router from 'next/router' import { Fragment, useEffect, useState } from 'react' @@ -50,7 +51,7 @@ export default function App({ Component, pageProps, router }) { return () => { Router.events.off('routeChangeComplete', handleRouteChange) } - }, [navIsOpen],[router.events]) + }, [navIsOpen], [router.events]) const Layout = Component.layoutProps?.Layout || Fragment const layoutProps = Component.layoutProps?.Layout @@ -65,36 +66,38 @@ export default function App({ Component, pageProps, router }) { return ( <> - {meta.metaTitle || meta.title}

-

- - - - - - - - - - - {router.pathname !== '/' && ( -

setNavIsOpen(isOpen)} /> - )} - - - + + {meta.metaTitle || meta.title} + + + + + + + + + + + + {router.pathname !== '/' && ( +
setNavIsOpen(isOpen)} /> + )} + + + +
> ) } From b973ac6012688ce89f031dc61b07af6cbdc76bed Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 07:47:52 +0530 Subject: [PATCH 04/36] Create ThemeChanger.js --- src/components/ThemeChanger.js | 45 ++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 src/components/ThemeChanger.js diff --git a/src/components/ThemeChanger.js b/src/components/ThemeChanger.js new file mode 100644 index 00000000..0777488d --- /dev/null +++ b/src/components/ThemeChanger.js @@ -0,0 +1,45 @@ +// ./components/ThemeChanger.js +import { useEffect, useState } from 'react'; +import { useTheme } from 'next-themes'; +import { MoonIcon, SunIcon } from '@heroicons/react/outline'; + + +export default function ThemeChanger() { + const { systemTheme, theme, setTheme } = useTheme(); + const [mounted, setMounted] = useState(false); + + useEffect(() => { + setMounted(true); + }, []); + + const renderThemeChanger = () => { + + if (!mounted) return null; + + const currentTheme = theme === 'system' ? systemTheme : theme; + if (currentTheme === 'dark') { + return ( setTheme('light')} + /> + ); + } + else { + return ( setTheme('dark')} + /> + ); + } + } + + return ( +
+ {renderThemeChanger()} +
+ ); +} \ No newline at end of file From 14270ec88cde3d5ab3a588d28d3d96720c65a0ec Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 07:49:52 +0530 Subject: [PATCH 05/36] Update Logo.js --- src/components/Logo.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Logo.js b/src/components/Logo.js index c076a33d..86a7d4fa 100644 --- a/src/components/Logo.js +++ b/src/components/Logo.js @@ -11,7 +11,7 @@ export function Logo(props) { fillRule="evenodd" clipRule="evenodd" d="M74.972 20.192h5.908v-5.473h-5.907v5.473zM72.67 52.944c4.811 0 8.21-3.403 8.21-8.192V23.116h-5.907v21.191c0 2.104-1.13 3.199-3.228 3.199h-1.91v5.438h2.835zm31.643-29.828l-.608 2.07a10.77 10.77 0 00-7.192-2.677c-6.55 0-11.438 4.952-11.438 11.57 0 6.611 4.88 11.605 11.438 11.605 2.783 0 5.205-.975 7.072-2.642l.522 1.992h4.606V23.116h-4.4zm-7.32 16.967a5.83 5.83 0 01-4.263-1.726 5.81 5.81 0 01-1.68-4.277 5.791 5.791 0 011.67-4.29 5.808 5.808 0 014.273-1.722 5.81 5.81 0 015.551 3.695c.287.737.42 1.526.39 2.317a5.794 5.794 0 01-3.629 5.584 5.81 5.81 0 01-2.312.419zm31.746-16.966l-5.257 14.691-5.334-14.692h-6.31l8.896 21.918h5.453l8.647-21.918h-6.104.009zm26.283 0l-.608 2.069a10.766 10.766 0 00-7.191-2.677c-6.55 0-11.438 4.952-11.438 11.57 0 6.611 4.888 11.605 11.438 11.605 2.783 0 5.214-.975 7.071-2.642l.523 1.992h4.606V23.116h-4.401zm-7.32 16.966a5.827 5.827 0 01-5.543-3.692 5.815 5.815 0 01-.398-2.311 5.785 5.785 0 011.669-4.29 5.809 5.809 0 014.272-1.722 5.812 5.812 0 014.272 1.723 5.79 5.79 0 011.67 4.289 5.792 5.792 0 01-1.673 4.283 5.804 5.804 0 01-4.269 1.72zm17.44-19.891h5.856v-5.473h-5.856v5.473zm0 24.842h5.899V23.116h-5.908v21.927l.009-.009zm19.281.65c5.539 0 9.169-2.924 9.169-7.388 0-5.354-4.563-6.09-8.117-6.739-2.268-.402-4.126-.77-4.126-2.223 0-1.266 1.096-2.078 2.911-2.078 2.054 0 3.27.855 3.313 2.6h5.617c-.043-4.388-3.511-7.347-8.767-7.347-5.257 0-8.767 2.882-8.767 7.021 0 5.157 4.443 6.089 7.919 6.696 2.303.368 4.195.813 4.195 2.31 0 1.47-1.49 2.24-3.108 2.24-2.097 0-3.595-.975-3.638-2.925h-5.737c0 4.67 3.682 7.833 9.136 7.833zm23.98-5.926c-2.183 0-3.39-1.214-3.39-3.335v-8.518h5.942v-4.789h-6.028v-5.678h-1.13l-8.604 9.168v1.3h3.921v9.338c0 4.831 2.945 7.79 7.757 7.79h4.195v-5.276h-2.663zm6.695-19.566h5.865v-5.473h-5.865v5.473zm0 24.842h5.908V23.116h-5.908v21.927-.009zm21.712.65c5.693 0 10.18-3.737 11.19-9.253h-5.942c-1.01 2.352-2.868 3.652-5.248 3.652-3.159 0-5.616-2.634-5.616-6.003 0-3.421 2.423-6.012 5.616-6.012a5.604 5.604 0 015.248 3.455h5.865c-1.053-5.405-5.42-9.014-11.079-9.014-6.626 0-11.643 4.952-11.643 11.528 0 6.576 5.017 11.647 11.609 11.647zM30.452 42.6c4.924 0 8.917-3.98 8.917-8.889 0-4.909-3.992-8.888-8.917-8.888s-8.917 3.98-8.917 8.888c0 4.91 3.992 8.89 8.917 8.89z" - fill="#000" + fill="currentColor" /> ) From 2fd1950d9b96c076b15189b87c1a1bd5c05279b6 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 07:52:32 +0530 Subject: [PATCH 06/36] Update index.js Add darkmode support --- src/pages/index.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/pages/index.js b/src/pages/index.js index 069c4d94..3b5300ef 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -10,6 +10,7 @@ import { Testimonials } from '@/components/Testimonials' import Head from 'next/head' import NextLink from 'next/link' import Router from 'next/router' +import ThemeChanger from '@/components/ThemeChanger' export default function Home() { return ( @@ -43,11 +44,11 @@ export default function Home() { Router.push('/brand') }} > - + -
+
@@ -55,6 +56,7 @@ export default function Home() { +
-

+

Learn{' '} Java @@ -115,7 +117,7 @@ export default function Home() {

- + “ Learning By Doing ” actually works.
From ce4414373820791f284bf42f3ca742d6fcacfb53 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 07:54:45 +0530 Subject: [PATCH 07/36] Update _document.js Add `dark mode` support --- src/pages/_document.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/_document.js b/src/pages/_document.js index 1ecfb8e6..9723f989 100644 --- a/src/pages/_document.js +++ b/src/pages/_document.js @@ -11,7 +11,7 @@ export default class Document extends NextDocument { @@ -40,7 +40,7 @@ export default class Document extends NextDocument { }} /> - +
From cbcf42517e9a9493c614db51d3241e463e12ca46 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 08:00:17 +0530 Subject: [PATCH 08/36] Update Menu.js - Add `dark mode` support - Add Menu Icon for mobile --- src/components/home/Menu.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/components/home/Menu.js b/src/components/home/Menu.js index 60918128..10fc3feb 100644 --- a/src/components/home/Menu.js +++ b/src/components/home/Menu.js @@ -1,5 +1,5 @@ import { Menu, Transition } from '@headlessui/react' -import { ChevronDownIcon } from '@heroicons/react/solid' +import { ChevronDownIcon,MenuIcon } from '@heroicons/react/solid' import { Fragment } from 'react' function classNames(...classes) { @@ -10,9 +10,10 @@ export default function MenuButton() { return (
- - Menu - + + Menu + +
From 3ddd5ee66fddf10c076549f21a199863d2c6e6b8 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 08:03:05 +0530 Subject: [PATCH 09/36] Update main.css Add support for `dark mode` --- src/css/main.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/css/main.css b/src/css/main.css index 39ae973f..a3d23bd9 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -8,3 +8,11 @@ @import 'tailwindcss/components'; @import 'utilities.css'; + +h1,h2,h3,h4,h5,h6,code,strong { + @apply text-gray-900 dark:text-white +} + +p{ + @apply text-gray-600 dark:text-gray-300 +} \ No newline at end of file From 9852f68e08d9e2ae48bb71853c356a06b1e194f6 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 08:03:58 +0530 Subject: [PATCH 10/36] Update Header.js - Add `dark mode` support - Add Theme Changer Component --- src/components/Header.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/Header.js b/src/components/Header.js index fa5f3f24..50bf915b 100644 --- a/src/components/Header.js +++ b/src/components/Header.js @@ -3,12 +3,14 @@ import { Search } from '@/components/Search' import clsx from 'clsx' import Link from 'next/link' import Router from 'next/router' +import ThemeChanger from './ThemeChanger' + export function Header({ navIsOpen, onNavToggle }) { return ( <> -
-
+
+
+ Date: Thu, 9 Dec 2021 08:11:09 +0530 Subject: [PATCH 11/36] Update common.js --- src/components/home/common.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/home/common.js b/src/components/home/common.js index 09546a88..3da9524c 100644 --- a/src/components/home/common.js +++ b/src/components/home/common.js @@ -48,7 +48,7 @@ export function Link({ className = '', href, ...props }) { } export function InlineCode({ className = '', ...props }) { - return + return } export { Widont } from '@/components/Widont' From c7d1c01dd5f3bbf44840e93615dd5cd3d584f1d7 Mon Sep 17 00:00:00 2001 From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com> Date: Thu, 9 Dec 2021 09:55:21 +0530 Subject: [PATCH 12/36] Update SidebarLayout.js - Add Dark Mode --- src/layouts/SidebarLayout.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/layouts/SidebarLayout.js b/src/layouts/SidebarLayout.js index f0cfd22c..7a6a3ee0 100644 --- a/src/layouts/SidebarLayout.js +++ b/src/layouts/SidebarLayout.js @@ -14,13 +14,13 @@ const NavItem = forwardRef(({ href, children, isActive, isPublished, fallbackHre @@ -55,7 +55,7 @@ function Nav({ nav, children, fallbackHref }) {