Add FAQs section on contact page

5 files changed, 39 insertions, 8 deletions

diff --git a/src/layouts/layout.astro b/src/layouts/layout.astro
index dd60f8d..74246ac 100644
--- a/src/layouts/layout.astro
+++ b/src/layouts/layout.astro
@@ -172,8 +172,13 @@ ul.menu li a.active{
 <script>
  
  document.addEventListener('astro:page-load', () => {
+if(window.location.hash){
+var currentUrl = window.location.pathname + window.location.hash.replace(/\/+$/, '');
+}
+else{
 
   var currentUrl = window.location.pathname.replace(/\/+$/, '');
+}
 
 
   var menuItems = document.querySelectorAll('.nav-link');
diff --git a/src/layouts/nav-links.json b/src/layouts/nav-links.json
index 0e0c6c6..2c4ec14 100644
--- a/src/layouts/nav-links.json
+++ b/src/layouts/nav-links.json
@@ -7,5 +7,6 @@
   { "label": "Resources", "href": "/resources" },
   { "label": "Rules", "href": "/rules" },
   { "label": "Partners", "href": "/partners" },
-  { "label": "Contact", "href": "/contact" }
+  { "label": "Contact", "href": "/contact" },
+  {"label": "FAQs", "href": "/contact#faq"}
 ]
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index a042d9d..c3519a4 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -3,14 +3,37 @@ import Main from '../layouts/main.astro';
 ---
 
 <Main>
+<section id="faq">
+ <div class="py-3">
+            <!-- 1/4 Width Column -->
+            <!-- <div class="col-span-1 bg-gray-300 p-4">
+                <img src=""/>
+                <h1 class="section-title">Celebrating India's Innovation</h1>
+                
+                
+            </div> -->
+            <!-- 3/4 Width Column -->
+            <div class="col-span-1 p-4">
+                
+                <h1 class="section-title text-4xl pb-3">
+                FAQs
+                </h1>
+            <div class="p-4 playfair-display-normal">
+           <p class="text-xl">Please refer to <a class="hover:text-red-400 text-red-700" href="https://docs.google.com/document/d/1WX8Nj7XHvIFMekI-pYkZpq5wXU1niOWqWEzQLqhFV6Q/edit" target="_blank">this</a> document for FAQs on ANIMATE 2024.
+</p>
+        </div>
+        </div>
+       
+
+</section>
  <section id="contact">
     <div class="lg:grid grid-cols-2 gap-4">
     <div class="text-center md:text-2xl text-sm">
         <h1 class="justify-end text-4xl mb-4">Contact Us</h1>
           <p class=" playfair-display-normal">For any queries, write to us at </p>
           <ul class=" playfair-display-normal">
-            <li><a class="text-blue-700 hover:text-blue-400" href="mailto:info@fossee.in">info@fossee.in</a></li>
-            <li><a class="text-blue-700 hover:text-blue-400" href="mailto:contact-focal@fossee.in">contact-focal@fossee.in</a></li>
+            <li><a class=" hover:text-red-400 text-red-700" href="mailto:info@fossee.in">info@fossee.in</a></li>
+            <li><a class=" hover:text-red-400 text-red-700" href="mailto:contact-focal@fossee.in">contact-focal@fossee.in</a></li>
 
           </ul>
           </div>
diff --git a/src/pages/register.astro b/src/pages/register.astro
index a0ac301..79fad12 100644
--- a/src/pages/register.astro
+++ b/src/pages/register.astro
@@ -4,6 +4,7 @@ import qrcode from '../images/qrcode-register.png';
 ---
 
 <Main>
+<section id="register">
     <div class="container grid grid-cols-1 sm:grid-cols-4 gap-4">
         <!-- 1/4 Width Column -->
         <div class="place-items-center justify-center col-span-1 bg-gray-300 p-4  playfair-display-normal" style="text-align: center;">
@@ -33,7 +34,7 @@ import qrcode from '../images/qrcode-register.png';
                   <!-- <li class="text-red-500">If a person is found participating in more than one team, both the teams will be disqualified from the Hackathon.</li>
                   <li class="text-red-500">If any participant/ team is found to be indulging in any form of malpractice, the team will be immediately disqualified.</li> -->
                   <li>Use ONLY open source software for creating animations.
-                  <span class="text-red-500">You are not allowed to use any proprietary software in your animation in any aspect. If found, you and your team will be disqualified.</span></li>
+                  <span class="text-red-700">You are not allowed to use any proprietary software in your animation in any aspect. If found, you and your team will be disqualified.</span></li>
                   <li><div>Submissions will be accepted in 3 categories:&nbsp;</div>
                     
                     <ol class="list-decimal list-inside pt-1">
@@ -49,4 +50,5 @@ import qrcode from '../images/qrcode-register.png';
     
     
     </div>
+    </section>
 </Main>
\ No newline at end of file
diff --git a/src/pages/resources.astro b/src/pages/resources.astro
index 0b1063b..142e506 100644
--- a/src/pages/resources.astro
+++ b/src/pages/resources.astro
@@ -27,11 +27,11 @@ import { slide } from 'astro:transitions';
       <div class="pt-4 leading-normal sm:leading-loose">
       
         <div class="text-justify md:text-xl text-sm playfair-display-normal"><ul style="list-style:disc;">
-          <li class="mb-2">Self-learn Synfig Studio using <span class="text-red-400 hover:text-red-700"><a href="https://spoken-tutorial.org/tutorial-search/?search_foss=Synfig&search_language=" target="_blank">Spoken Tutorials</a></span>. These tutorials are available in English, Hindi, Kannada, Marathi, Malayalam, Tamil, and Telugu.</li>
+          <li class="mb-2">Self-learn Synfig Studio using <span class="hover:text-red-400 text-red-700"><a href="https://spoken-tutorial.org/tutorial-search/?search_foss=Synfig&search_language=" target="_blank">Spoken Tutorials</a></span>. These tutorials are available in English, Hindi, Kannada, Marathi, Malayalam, Tamil, and Telugu.</li>
           <li class="mb-2">For creating graphics, recording audio, etc., you can use other software. However, since there is a requirement to strictly use Open Source Software in this hackathon, you can use GIMP, Audacity, Inkscape, Openshot Video Editor, etc. You can self-learn these software using the Spoken Tutorials, which are freely available in English, Hindi, Kannada, Marathi, Malayalam, Tamil and Telugu.</li>
-          <li class="mb-2">For help in installing Synfig Studio, please <a href="https://www.synfig.org/" target="_blank" class="text-red-400 hover:text-red-700">click here</a>.</li>
-          <li class="mb-2">For writing your script, you can learn about storytelling using <a href="https://spoken-tutorial.org/tutorial-search/?search_foss=Mastering+Communication&search_language=English" target="_blank" class="text-red-400 hover:text-red-700">Communication Spoken Tutorials</a> available in English.</li>
-          <li class="mb-2">Refer graphics from our <a href="https://www.focal.fossee.in/" target="_blank" class="text-red-400 hover:text-red-700">FOCAL (free and open source creative art library)</a></span> repository.</li>
+          <li class="mb-2">For help in installing Synfig Studio, please <a href="https://www.synfig.org/" target="_blank" class="hover:text-red-400 text-red-700">click here</a>.</li>
+          <li class="mb-2">For writing your script, you can learn about storytelling using <a href="https://spoken-tutorial.org/tutorial-search/?search_foss=Mastering+Communication&search_language=English" target="_blank" class="hover:text-red-400 text-red-700">Communication Spoken Tutorials</a> available in English.</li>
+          <li class="mb-2">Refer graphics from our <a href="https://www.focal.fossee.in/" target="_blank" class="hover:text-red-400 text-red-700">FOCAL (free and open source creative art library)</a></span> repository.</li>
             </ul>
           </div>
       </div>