From 8d3469e69d1030b5d83108c6e967bffbb9e1d9a9 Mon Sep 17 00:00:00 2001
From: ks129 <45097959+ks129@users.noreply.github.com>
Date: Thu, 21 Jan 2021 20:13:51 +0200
Subject: Use relative units

---
 src/commonStyles.tsx            | 4 ++--
 src/components/ErrorMessage.tsx | 6 +++---
 src/pages/FormPage.tsx          | 3 ++-
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/commonStyles.tsx b/src/commonStyles.tsx
index cbfc40a..2caa77e 100644
--- a/src/commonStyles.tsx
+++ b/src/commonStyles.tsx
@@ -54,8 +54,8 @@ const textInputs = css`
 const invalidStyles = css`
   .invalid-box {
     -webkit-appearance: none;
-    -webkit-box-shadow: 0 0 10px ${colors.error};
-    box-shadow: 0 0 10px ${colors.error};
+    -webkit-box-shadow: 0 0 0.6rem ${colors.error};
+    box-shadow: 0 0 0.6rem ${colors.error};
     border: none;
   }
 `;
diff --git a/src/components/ErrorMessage.tsx b/src/components/ErrorMessage.tsx
index 55e3759..1cf3cbc 100644
--- a/src/components/ErrorMessage.tsx
+++ b/src/components/ErrorMessage.tsx
@@ -9,9 +9,9 @@ interface ErrorMessageProps {
 
 const styles = css`
   color: ${colors.error};
-  font-size: 18px;
-  line-height: 15px;
-  margin: 15px 0 0;
+  font-size: 1.15rem;
+  line-height: 1.1rem;
+  margin: 1rem 0 0;
 `;
 
 export default function ErrorMessage(props: ErrorMessageProps): JSX.Element|null {
diff --git a/src/pages/FormPage.tsx b/src/pages/FormPage.tsx
index 72b073f..21303ab 100644
--- a/src/pages/FormPage.tsx
+++ b/src/pages/FormPage.tsx
@@ -107,11 +107,12 @@ function FormPage(): JSX.Element {
     useEffect(() => {
         getForm(id).then(form => {
             setForm(form);
+            setSent(true);
         });
     }, []);
 
     if (form && sent) {
-        const thanksStyle = css`font-family: "Uni Sans", "Hind", "Arial", sans-serif; margin-top: 250px;`;
+        const thanksStyle = css`font-family: "Uni Sans", "Hind", "Arial", sans-serif; margin-top: 15.5rem;`;
         const divStyle = css`width: 80%;`;
         return (
             <div>
-- 
cgit v1.2.3