Use full screen height for about section on mobile

deadrime · Feb 23, 2024 · 3a874e3 · 3a874e3
1 parent b8d1330
commit 3a874e3
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/components/AboutSection/AboutSection.module.css b/components/AboutSection/AboutSection.module.css
@@ -1,3 +1,11 @@
+.wrapper {
+  min-height: calc(100vh - 9rem);
+
+  @media screen(sm) {
+    min-height: initial;
+  }
+}
+
 .blobs {
   --color1: rgb(var(--color-primary));
   --color2: #de5e82;

diff --git a/components/AboutSection/AboutSection.tsx b/components/AboutSection/AboutSection.tsx
@@ -10,7 +10,7 @@ import SvgSloth from '@/svgComponents/Sloth';
 
 const AboutSection = () => {
   return (
-    <section className="flex flex-col relative test">
+    <section className={classNames("flex flex-col relative", styles.wrapper)}>
       <div className="flex flex-col">
         <span className="flex items-center gap-2">
           <div className="rounded-full bg-green size-[0.625rem]" />