TS fix, Hero styles

src/components/Hero/Hero.tsx

@@ -9,10 +9,20 @@ const Container = styled.div`
   position: relative;
   padding: 0;
 
-  min-height: 80vh;
+  min-height: 75vh;
 
   section {
     padding: 2rem 6rem;
+    @media screen and (max-width: 800px) {
+      padding: 1rem;
+    }
+  }
+
+  aside {
+    padding: 0 6rem;
+    @media screen and (max-width: 800px) {
+      padding: 2rem 1rem;
+    }
   }
 
   & > div {

src/components/Hero/HeroAside.tsx

@@ -42,8 +42,6 @@ const Aside = styled.aside<{ colors: string }>`
   display: flex;
   flex-direction: column;
   justify-content: center;
-  padding: 0 6rem;
-
 
   h2 {
     text-transform: uppercase;
@@ -69,11 +67,6 @@ const Aside = styled.aside<{ colors: string }>`
     text-decoration: none;
     letter-spacing: 0.1rem;
   }
-
-
-  @media screen and (max-width: 800px) {
-    margin: 48px auto;
-  }
 `;
 
 const textColors = (bgColor: Colors) => {

src/components/Hero/HeroPrimaryButtons.tsx

@@ -10,6 +10,7 @@ const Buttons = styled.div<{row?: boolean}>`
 
   a {
     display: contents;
+    text-decoration: none;
   }
 
   button {

src/views/SignUpPage/SignUpPageView.tsx

@@ -122,15 +122,15 @@ const SignUpPageView: React.FC<SignUpPageViewProps> = ({
     );
   }
 
-  const form = signUpForm !== null
-    ? renderForm()
-    : <>Loading...</>;
+  const form = signUpForm ? renderForm() : <>Loading...</>;
 
   const signups = signUpForm && signUpForm.signups ? renderList(signUpForm) : null;
   return (
     <StyledSection>
       <h1>
-        {signUpForm?.title_fi || ""}
+        {signUpForm && (
+          signUpForm.title_fi
+        )}
       </h1>
 
       <div>