Add TopBar.

ksho · Dec 21, 2021 · 0b850cd · 0b850cd · vercel · Dec 21, 2021
1 parent 942f19f
commit 0b850cd
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 2 deletions.
diff --git a/ThemeConfig.ts b/ThemeConfig.ts
@@ -23,7 +23,7 @@ export const darkTheme = {
 
 export const GlobalStyles = createGlobalStyle<{theme: ThemeType}>`
   body {
-    background: ${({ theme }) => theme.body};
+    background-color: ${({ theme }) => theme.body};
     color: ${({ theme }) => theme.text};
     transition: all 0.50s linear;
   }

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -101,6 +101,7 @@ function Home(data: any) {
   return (
     <ThemeProvider theme={activeTheme}>
       <GlobalStyles />
+      <TopBar></TopBar>
       <MainContentWrapper id='page-main-grid'>
         <MainContent>
           <Header>
@@ -116,6 +117,12 @@ function Home(data: any) {
   );
 }
 
+const TopBar = styled.div`
+  background-color: #3f06dd;
+  height: 6px;
+  width: 104vw;
+`
+
 const Header = styled.div`
   display: flex;
   justify-content: space-between;
@@ -126,6 +133,7 @@ const LightSwitch = styled.div`
   flex-direction: column;
   justify-content: center;
   font-size: 30px;
+  margin: 6px;
 `;
 
 const MainContentWrapper = styled.div`

diff --git a/styles/globals.css b/styles/globals.css
@@ -4,7 +4,6 @@ body {
   margin: 0;
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
     Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
-  background-color: #3f06dd;
 }
 
 a {