Merge pull request #41 from Dataatti/brand-update

First iteration of brand update
Dataatti · Feb 14, 2022 · 8829273 · 8829273 · vercel · Feb 14, 2022
2 parents 25fa4fd + f753fc6
commit 8829273
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 6 deletions.
diff --git a/components/Footer.tsx b/components/Footer.tsx
@@ -2,15 +2,15 @@ import { Container, Divider, Grid, Link, Paper, Typography } from '@mui/material
 
 const Header = () => {
   return (
-    <Paper sx={{ bgcolor: 'grey.800', color: 'common.white' }}>
+    <Paper sx={{ color: 'common.black', bgcolor: '#F1F8FF' }}>
       <Container>
         <Typography align="center" sx={{ p: '20px' }}>
           Business Finlandin mukaan sertifiointi on laadun tae kansainvälisessä kaupassa.
           Matkailualan monimuotoisuus on kuitenkin mahdollistanut sen, että myös sertifikaatin
           tarjoajia on hyvin paljon. Ideana on tuottaa nyt hankalasti ja pirstoutuneena oleva tieto
           yhteen paikkaan kaikkien toimijoiden avoimesti saataville.
         </Typography>
-        <Divider sx={{ bgcolor: 'common.white' }} />
+        <Divider sx={{ borderColor: 'common.black' }} />
         <Grid container justifyContent="space-around" sx={{ p: '10px' }}>
           <Grid item>
             <Link href="https://european-union.europa.eu/index_fi" color="inherit">

diff --git a/components/Header.tsx b/components/Header.tsx
@@ -5,15 +5,15 @@ import { useRouter } from 'next/router';
 const Header = () => {
   const router = useRouter();
   return (
-    <AppBar position="static" color="inherit">
+    <AppBar position="static" color="inherit" sx={{ bgcolor: '#222222' }}>
       <Container>
         <Grid container justifyContent="space-between" alignItems="center">
           <Grid item>
             <Link href="/" passHref>
               <MuiLink underline="none">
                 <Typography
                   component="h1"
-                  sx={{ fontWeight: '500', fontSize: '22px', p: '7px', color: 'text.primary' }}
+                  sx={{ fontWeight: '500', fontSize: '22px', p: '7px', color: 'common.white' }}
                 >
                   Matkailualan
                   <br /> sertifikaatit
@@ -24,7 +24,12 @@ const Header = () => {
           {router.pathname !== '/' && (
             <Grid item>
               <Link href="/" passHref>
-                <MuiLink data-testid="link-to-search">Yrityshakuun</MuiLink>
+                <MuiLink
+                  data-testid="link-to-search"
+                  sx={{ color: '#BCE3BF', textDecorationColor: '#BCE3BF' }}
+                >
+                  Yrityshakuun
+                </MuiLink>
               </Link>
             </Grid>
           )}

diff --git a/theme.ts b/theme.ts
@@ -3,7 +3,11 @@ import { createTheme } from '@mui/material/styles';
 const theme = createTheme({
   palette: {
     primary: {
-      main: '#F97C80',
+      main: '#1D764A',
+      contrastText: '#DBEEFE',
+    },
+    common: {
+      black: '#2222222',
     },
   },
   typography: {
@@ -13,7 +17,15 @@ const theme = createTheme({
     MuiButton: {
       styleOverrides: {
         root: {
+          backgroundColor: '#1D764A',
+          color: '#FFFFFF',
           textTransform: 'none',
+          '&:hover': {
+            backgroundColor: '#1D764ACC',
+          },
+          '& .MuiSvgIcon-root': {
+            marginRight: '4px',
+          }
         },
       },
     },