From 0486f75aaca22d4da17473a4323652ed80411572 Mon Sep 17 00:00:00 2001
From: isinia <181978133+isinia@users.noreply.github.com>
Date: Mon, 21 Oct 2024 13:57:12 +0200
Subject: [PATCH] fix: improve text responsiveness

---
 src/app/page.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 7424f89..172ad88 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,17 +6,17 @@ export default function Home() {
         <img src="/sparkle1.png" className="absolute top-1/4 right-1/10" />
         <img src="/sparkle.png" className="absolute bottom-1/4 left-1/3" />
         <div className="m-auto">
-          <h1 className="tf-logo font-bold text-6xl">TrollFactory</h1>
+          <h1 className="tf-logo font-bold text-center text-4xl md:text-5xl lg:text-6xl">TrollFactory</h1>
           <div className="card bg-wt-50 mt-7 mb-20">
             <div className="card-body">
-              <select className="input tf-input tf-input-top text-tf-0 select font-medium text-base text-last-center w-full">
+              <select className="input tf-input tf-input-top text-tf-0 select font-medium text-sm md:text-base text-last-center w-full">
                 <option disabled selected>Dataset</option>
                 <option>🇵🇱 polski / Polska</option>
                 <option>🇺🇸 English / USA</option>
                 <option>🇨🇳 中国人 / 中国</option>
               </select>
               <label className="input flex items-center gap-2 tf-input tf-input-middle">
-                <span className="tf-input-label pl-1 w-28 font-medium font-mono text-tf-0">Sex</span>
+                <span className="tf-input-label pl-1 w-28 hidden md:block text-sm md:text-base font-medium font-mono text-tf-0">Sex</span>
                 <div className="form-control">
                   <label className="label cursor-pointer pl-0">
                     <span className="label-text pr-2">Female</span>
@@ -37,11 +37,11 @@ export default function Home() {
                 </div>
               </label>
               <label className="input flex items-center gap-2 tf-input tf-input-middle">
-                <span className="tf-input-label pl-1 w-28 font-medium font-mono text-tf-0">First name</span>
+                <span className="tf-input-label pl-1 w-28 hidden md:block text-sm md:text-base font-medium font-mono text-tf-0">First name</span>
                 <input type="text" className="grow text-sm" placeholder="First name" />
               </label>
               <label className="input flex items-center gap-2 tf-input tf-input-bottom">
-                <span className="tf-input-label pl-1 w-28 font-medium font-mono text-tf-0">Last name</span>
+                <span className="tf-input-label pl-1 w-28 hidden md:block text-sm md:text-base font-medium font-mono text-tf-0">Last name</span>
                 <input type="text" className="grow text-sm" placeholder="Last name" />
               </label>
             </div>