Fix color issue in light theme (#23)

Author: hyp3rflow

src/pages/_app.page.tsx

@@ -2,7 +2,8 @@ import type { AppProps } from "next/app";
 import "normalize.css/normalize.css";
 import "open-color/open-color.css";
 import "./_app.scss";
-import "flexlayout-react/style/dark.scss";
+import "../styles/flexlayout-light.scss";
+import "../styles/flexlayout-dark.scss";
 
 const App: React.FC<AppProps> = ({ Component, pageProps }) => {
   return <Component {...pageProps} />;

src/pages/_app.scss

@@ -43,10 +43,15 @@ button {
 
 input {
   border: 0;
-  color: var(--oc-gray-5);
-  background-color: var(--oc-gray-9);
   padding: 0.25em;
   margin: 3px 0px;
+  color: var(--oc-gray-9);
+  background-color: var(--oc-gray-5);
+
+  @media (prefers-color-scheme: dark) {
+    color: var(--oc-gray-5);
+    background-color: var(--oc-gray-9);
+  }
 
   &:hover {
     box-shadow: 0 0 0 1px var(--pb-sep);