fix: layout for extra thin devices

vincent-qc · vincent-qc · commit f6bf1e30a685 · 2025-01-22T14:01:15.000-05:00
diff --git a/src/components/landing/namecard.tsx b/src/components/landing/namecard.tsx
@@ -16,7 +16,7 @@ export default function Namecard() {
         delay: 0.5,
       }}
     >
-      <h1 className="text-[350%] font-semibold">
+      <h1 className="text-[250%] font-semibold sm:text-[350%]">
         Vincent{isMobile ? " Qi" : "'s Portfolio"}
       </h1>
     </motion.div>
diff --git a/src/components/landing/navbar.tsx b/src/components/landing/navbar.tsx
@@ -23,7 +23,7 @@ const NavbarButton = ({ text, page }: { text: string; page: Page }) => {
       style={{
         borderBottomColor: page === current ? "#FFFFFFFF" : "#00000000",
       }}
-      className="cursor-pointer border-b-2 text-[90%] transition-all lg:text-lg"
+      className="cursor-pointer border-b-2 text-[80%] transition-all sm:text-[90%] lg:text-lg"
     >
       {text}
     </motion.div>

Original file line number	Diff line number	Diff line change
`@@ -16,7 +16,7 @@ export default function Namecard() {`
`16`	`16`	`delay: 0.5,`
`17`	`17`	`}}`
`18`	`18`	`>`
`19`		`- <h1 className="text-[350%] font-semibold">`
	`19`	`+ <h1 className="text-[250%] font-semibold sm:text-[350%]">`
`20`	`20`	`Vincent{isMobile ? " Qi" : "'s Portfolio"}`
`21`	`21`	`</h1>`
`22`	`22`	`</motion.div>`
Original file line number	Diff line number	Diff line change
`@@ -23,7 +23,7 @@ const NavbarButton = ({ text, page }: { text: string; page: Page }) => {`
`23`	`23`	`style={{`
`24`	`24`	`borderBottomColor: page === current ? "#FFFFFFFF" : "#00000000",`
`25`	`25`	`}}`
`26`		`- className="cursor-pointer border-b-2 text-[90%] transition-all lg:text-lg"`
	`26`	`+ className="cursor-pointer border-b-2 text-[80%] transition-all sm:text-[90%] lg:text-lg"`
`27`	`27`	`>`
`28`	`28`	`{text}`
`29`	`29`	`</motion.div>`