Fix interface of mainTheme

isdi-coders-2023 · Oct 30, 2023 · d1740e9 · d1740e9
1 parent 3fab3af
commit d1740e9
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 14 deletions.
diff --git a/src/styles/GlobalStyles.ts b/src/styles/GlobalStyles.ts
@@ -3,34 +3,37 @@ import { createGlobalStyle } from "styled-components";
 const GlobalStyle = createGlobalStyle`
   *,
   ::after,
-  ::before{
+  ::before {
     box-sizing: border-box;
   }
 
-  h1,h2,body{
+  h1,
+  h2,
+  body {
     margin: 0;
     padding:0;
   }
 
-  button{
+  button {
     margin:0;
     background-color: transparent;
     padding: 0;
   }
 
-  ul{
+  ul {
     list-style: none;
     padding: 0;
     margin: 0;
   }
 
-  body{
-    font-family: ${({ theme }) => theme.typography["main-font-fammily"]};
+  body {
+    font-family: ${({ theme }) => theme.typography["main-font-family"]};
     color: ${({ theme }) => theme.color.font};
-    background-color: ${({ theme }) => theme.color.main};
-    
+    background-color: ${({ theme }) => theme.color["main-background"]};
+    font-size: ${({ theme }) => theme.typography.size};
   }
 
+
 `;
 
 export default GlobalStyle;
diff --git a/src/styles/mainTheme.ts b/src/styles/mainTheme.ts
@@ -2,16 +2,17 @@ import { DefaultTheme } from "styled-components";
 
 const mainTheme: DefaultTheme = {
   color: {
-    main: "#fbd000",
-    secondary: "#049cd8",
+    "container-background": "#fbd000",
+    "main-background": "#049cd8",
     "error-background": "#e52521",
     "check-background": "#43b047",
     font: "#fff",
     "secondary-font": "#000",
   },
   typography: {
-    "main-font-fammily": "Verdana, Geneva, Tahoma, sans-serif",
+    "main-font-family": "Verdana, Geneva, Tahoma, sans-serif",
     "secondary-font-family": "'New Super Mario Font U', sans-serif",
+    size: "1,1875rem",
   },
 };
 

diff --git a/src/styles/styled.d.ts b/src/styles/styled.d.ts
@@ -3,17 +3,18 @@ import "styled-components";
 declare module "styled-components" {
   export interface DefaultTheme {
     color: {
-      main: string;
-      secondary: string;
+      "container-background": "#fbd000";
+      "main-background": "#049cd8";
       "error-background": string;
       "check-background": string;
       font: string;
       "secondary-font": string;
     };
 
     typography: {
-      "main-font-fammily": string;
+      "main-font-family": string;
       "secondary-font-family": string;
+      size: string;
     };
   }
 }