about me.tsx optimizations for mobile

austinhutchen · Jan 6, 2024 · 0fbb33c · 0fbb33c
1 parent 51194eb
commit 0fbb33c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/src/components/pages/aboutme.tsx b/src/components/pages/aboutme.tsx
@@ -113,7 +113,7 @@ const About: React.FC<AboutProps> = (props) => {
             )}
 
             <fieldset>
-              <p style={{ color: 'cornsilk', fontSize: "2.1vh", fontFamily: "Gill Sans, Gill Sans MT, Calibri, Trebuchet MS, sans-serif", fontWeight: 350 }}>
+              <p style={{ color: 'cornsilk', fontSize: "2svh", fontFamily: "Gill Sans, Gill Sans MT, Calibri, Trebuchet MS, sans-serif", fontWeight: 350 }}>
                 <b className="legend">{data.desc}</b>
               </p>
               <button type="button" className="prev-slick" onClick={() => slider?.current?.slickPrev()}>

diff --git a/src/css/QUERIES.scss b/src/css/QUERIES.scss
@@ -21,16 +21,17 @@ border-radius: calc(400 / 2)em;
 /* Default styles */
 @media not all and (max-device-width: 767px) {
   #name {
-    font-size: 2.5em;
+    font-size: 2.4em;
   }
   .sc p {
-    font-size: 1.2em;
+    font-size: 1.25em;
   }
   .sc img,
   .sc video {
     height: 55vh;
     margin: 0 auto;
     max-width: 60svh;
+    max-height: 100%;
     border-radius: calc(400 / 2)em;
    border: 0.26dvh solid #0BA ; 
     }