task ready to upload

Author: olafch

docs/src/pages/components/HeaderButtons.tsx

@@ -5,13 +5,13 @@ import clsx from 'clsx'
 export const HeaderButtons = () => (
   <div className={styles.buttonsContainer}>
     <Link
-      className={clsx('button button--secondary button--lg', styles.buttonReadDocs)}
+      className={clsx('button button--secondary button--lg', styles.button, styles.buttonReadDocs)}
       to="/docs/overview"
     >
       Read docs
     </Link>
     <Link
-      className={clsx('button button--secondary button--lg', styles.buttonTryIt)}
+      className={clsx('button button--secondary button--lg', styles.button, styles.buttonTryIt)}
       to="https://binarapps.online/sign-in"
     >
       Try it

docs/src/pages/index.module.css

@@ -48,12 +48,26 @@
   gap: 3rem;
 }
 
-.buttonReadDocs {
+.button {
   width: 160px;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .buttonTryIt {
-  width: 160px;
   background-color: #2f2f2f;
   color: #ffffff !important;
 }
+
+@media screen and (max-width: 600px) {
+  .buttonsContainer {
+    flex-direction: column;
+    gap: 1rem;
+  }
+
+  .button {
+    width: 100%;
+  }
+}