Add the ability to change to dark/light mode

[Panquesito7]

It would be cool if there'd be an option to make the website be in dark mode.
For example, I use Dark Reader, and it looks pretty cool in Dark Mode:

[maltejur]

Should be relatively easy to do using material uis theming system. I already use this for the big jumbo on the home page, and it looks like this

<DarkThemeProvider>
  <div className={classes.outer}>
    <div className="container">
      <Typography className={classes.h1}>Hello, algorithms!</Typography>
      <Typography className={classes.h2}>
        Welcome to GitHub's largest open-source algorithm library
      </Typography>
      <div className={classes.input}>{search}</div>
    </div>
  </div>
</DarkThemeProvider>

import React from "react";
import { createMuiTheme, ThemeProvider } from "@material-ui/core/styles";

const darkTheme = createMuiTheme({
  palette: {
    type: "dark",
    primary: {
      main: "#fff",
    },
  },
});

export default function DarkThemeProvider({ children }) {
  return <ThemeProvider theme={darkTheme}>{children}</ThemeProvider>;
}

You would just need to put the DarkThemeProvider in the _app component and add a switch. I quickly tried that and it looks pretty good, it just needs some tweaking at some points.

[maltejur]

8322344