improve responsive design

2026-04-15 17:45:49 +02:00
parent a71f420afa
commit f7ae517b65
4 changed files with 10 additions and 10 deletions
@@ -6,10 +6,10 @@ type props = {

 export const FeatureColumn = ({ imagePath, title, text }: props) => {
    return (
-        <div className="flex flex-col items-center justify-start h-100 gap-7">
+        <div className="flex flex-col items-center justify-start max-w-150 h-auto gap-7">
            <img className="w-33.75 h-33.75" src={imagePath} alt={`icon illustrating the text ${title}`} />
-            <div className="font-serif text-brand-brown text-3xl">{title}</div>
-            <div className="font-sans text-normal text-center w-3/5">{text}</div>
+            <div className="font-serif text-brand-brown text-center leading-[1.05] text-balance text-[clamp(2rem,5vw,30px)]">{title}</div>
+            <div className="font-sans text-base text-center w-3/5">{text}</div>
        </div>
    );
 };