605 change fonts in h1 and h2 to montserrat in events page (#634)

* adds font changes to h1, h2 * updates h1 and h2 fonts on event page --------- Co-authored-by: Laura Karaliene <Laura.Karaliene@stud.noroff.no>
NoroffFEU · Oct 5, 2024 · 043376b · 043376b
1 parent 75d1ef8
commit 043376b
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/pages/event.html b/pages/event.html
@@ -180,8 +180,8 @@ <h2 id="search-label" class="sr-only">Search Bar</h2>
       <section class="max-w-screen-xl mx-20 flex flex-col gap-10">
         <div>
           <p class="uppercase">Event</p>
-          <h1 class="font-justAnotherHand text-[100px]">
-            Join Us for the Back-to-School Fundraiser Gala
+          <h1 class="font-sans text-4xl lg:text-6xl font-semibold my-6 tracking-wide leading-relaxed lg:leading-relaxed">
+            Join Us for the <br> Back-to-School Fundraiser Gala
           </h1>
           <div class="flex max-w-[1200px]">
             <div class="w-7/12 flex flex-col gap-5 pr-10">
@@ -212,7 +212,7 @@ <h1 class="font-justAnotherHand text-[100px]">
           </div>
         </div>
         <div>
-          <h2 class="font-justAnotherHand text-[100px]">Why Attend?</h2>
+          <h2 class="font-sans text-2xl md:text-3xl lg:text-4xl tracking-tight md:tracking-normal lg:tracking-wide font-semibold my-6 pb-3">Why Attend?</h2>
           <p class="text-[25px]">
             The Back-to-School Fundraiser Gala is more than a gathering; it's a
             pivotal moment where you can directly impact the educational journey
@@ -225,7 +225,7 @@ <h2 class="font-justAnotherHand text-[100px]">Why Attend?</h2>
           </p>
         </div>
         <div>
-          <h2 class="font-justAnotherHand text-[100px]">What to Expect?</h2>
+          <h2 class="font-sans text-2xl md:text-3xl lg:text-4xl font-semibold my-6 pb-3">What to Expect?</h2>
           <ul class="list-disc pl-10 text-[25px] flex flex-col gap-5">
             <li class="pl-2">
               <span class="font-semibold">Elegant Dining Experience: </span>
@@ -256,15 +256,15 @@ <h2 class="font-justAnotherHand text-[100px]">What to Expect?</h2>
           </ul>
         </div>
         <div>
-            <h2 class="font-justAnotherHand text-[100px] capitalize">How can you support?</h2>
+            <h2 class="font-sans text-2xl md:text-3xl lg:text-4xl tracking-tight md:tracking-normal lg:tracking-wide font-semibold my-6 pb-3 capitalize">How can you support?</h2>
           <ul class="list-disc pl-10 text-[25px] flex flex-col gap-5">
             <li class="pl-2"><span class="font-semibold">Purchase a Ticket: </span>Secure your spot at this unforgettable evening and be part of the change.</li>
             <li class="pl-2"><span class="font-semibold">Sponsor a Table: </span>Gather friends, family, or colleagues for a special night out and amplify your impact.</li>
             <li class="pl-2"><span class="font-semibold">Donate: </span>If you're unable to attend, consider making a donation to support MMF's mission. Every contribution, big or small, makes a difference.</li>
             <li class="pl-2"><span class="font-semibold">Volunteer: </span>Lend your time and skills to make the gala a resounding success</li>
         </div>
         <div class="flex flex-col gap-5">
-            <h2 class="font-justAnotherHand text-[100px]">Details at a Glance:</h2>
+            <h2 class="font-sans text-4xl tracking-tight md:tracking-normal lg:tracking-wide font-semibold my-6">Details at a Glance:</h2>
           <ul class="list-disc pl-10 text-[25px] flex flex-col">
               <li>Date: August 25, 2024</li>
               <li>Time: 6:00 PM - 11:00 PM</li>
@@ -290,10 +290,10 @@ <h2 class="font-justAnotherHand text-[100px]">Details at a Glance:</h2>
                       </div>
                       <!-- Previous/Next Event button -->
                       <div class="flex justify-between -mx-10">
-                        <button class="alt-button uppercase bg-black font-normal text-[20px] px-3 rounded-[9px]">
+                        <button class="alt-button font-sans uppercase bg-black font-normal text-[20px] px-3 rounded-[9px]">
                             Previous event
                           </button>
-                      <button class="alt-button uppercase bg-sunset-red font-normal text-[20px] px-3 rounded-[9px]">
+                      <button class="alt-button font-sans uppercase bg-sunset-red font-normal text-[20px] px-3 rounded-[9px]">
                         Next event
                       </button>
                       </div>