adds sotm page

osmkerala · Nov 3, 2024 · 3d5d50f · 3d5d50f
1 parent 14eb6d5
commit 3d5d50f
Show file tree

Hide file tree

Showing 3 changed files with 336 additions and 1 deletion.
diff --git a/src/components/navbar.jsx b/src/components/navbar.jsx
@@ -23,6 +23,7 @@ export default function Navbar() {
               <div className="hidden text-[#2b2b2b] font-semibold md:flex space-x-4">
                 {/* Add your navigation links here */}
                 <NavbarButton isMobile={false} link="/" text="HOME" />
+                <NavbarButton isMobile={false} link="/sotm" text="SOTM '24" />
                 <NavbarButton isMobile={false} link="/about" text="ABOUT US" />
                 <NavbarButton
                   isMobile={false}
@@ -82,6 +83,9 @@ export default function Navbar() {
               <div className="m-2 p-2 mr-8">
                 <NavbarButton isMobile={true} link="/" text="HOME" />
               </div>
+              <div className="m-2 p-2 mr-8">
+                <NavbarButton isMobile={true} link="/sotm" text="SOTM '24" />
+              </div>
               <div className="m-2 p-2 mr-8">
                 <NavbarButton isMobile={true} link="/blogs" text="BLOGS" />
               </div>

diff --git a/src/pages/maintainers.astro b/src/pages/maintainers.astro
@@ -28,7 +28,7 @@ import HeadingComponent from '../components/elements/heading';
         <a href="https://kerala.openstreetmap.in" class="text-indigo-600 hover:text-indigo-900" rel="nofollow">https://kerala.openstreetmap.in</a>
       </td>
       <td class="px-6 py-4">
-        <a href="https://wiki.openstreetmap.org/wiki/User:Manojk" title="User:Manojk" class="text-indigo-600 hover:text-indigo-900">User:Manojk</a>, User:Joice Joseph
+        <a href="https://wiki.openstreetmap.org/wiki/User:Manojk" title="User:Manojk" class="text-indigo-600 hover:text-indigo-900">User:Manojk</a>, <a href="https://wiki.openstreetmap.org/wiki/User:joice" title="User:joice" class="text-indigo-600 hover:text-indigo-900">User:joice</a>
       </td>
       <td class="px-6 py-4"></td>
     </tr>

diff --git a/src/pages/sotm.astro b/src/pages/sotm.astro
@@ -0,0 +1,331 @@
+---
+// src/pages/sotm2024/index.astro
+import Layout from "../layouts/Layout.astro";
+
+const meta = {
+  title: "State of the Map Kerala 2024 - OpenStreetMap Kerala",
+  description: "Join Kerala's largest mapping community gathering on November 16-17, 2024 at KVASU Wayanad. Two days of learning, sharing, and collaboration to shape the future of open mapping in Kerala.",
+  image: "https://wiki.openstreetmap.org/wiki/File:Sotm_kerala_2024.jpg", // Update with your actual banner image URL
+  url: "https://kerala.openstreetmap.in/sotm2024",
+  siteName: "OpenStreetMap Kerala",
+  locale: "en_IN",
+  type: "event",
+  twitterHandle: "@mapkerala", // Update with your actual Twitter handle
+  eventDetails: {
+    startDate: "2024-11-16",
+    endDate: "2024-11-17",
+    location: "KVASU Pookode, Wayanad, Kerala",
+    organizer: "OpenStreetMap Kerala Community"
+  }
+};
+
+const sponsors = {
+  platinum: [
+    {
+      name: "Meta",
+      url: "https://www.meta.com/",
+      logo: "https://upload.wikimedia.org/wikipedia/commons/thumb/7/7b/Meta_Platforms_Inc._logo.svg/2560px-Meta_Platforms_Inc._logo.svg.png"
+    }
+  ],
+  silver: [
+    {
+      name: "FOSS United",
+      url: "https://fossunited.org/",
+      logo: "https://fossunited.org/files/Foss%20United%20Logo%20Black.svg"
+    }
+  ],
+  bronze: [
+    {
+      name: "TomTom",
+      url: "https://www.tomtom.com/",
+      logo: "https://upload.wikimedia.org/wikipedia/commons/e/e7/TomTom_logo.svg"
+    },
+    {
+      name: "DHI Sigma",
+      url: "https://www.dhisigma.com/",
+      logo: "https://wiki.openstreetmap.org/w/images/thumb/8/89/Dhisigma_logo1.jpg/75px-Dhisigma_logo1.jpg"
+    }
+  ]
+};
+
+const communityPartners = [
+  {
+    name: "OpenStreetMap India",
+    logo: "https://wiki.openstreetmap.org/w/images/0/07/OpenStreetMap-India.svg"
+  },
+  {
+    name: "Swathanthra Malayalam Computing",
+    logo: "https://smc.org.in/images/logo.webp"
+  },
+  {
+    name: "Open Data Kerala",
+    logo: "https://opendatakerala.org/logo.png"
+  }
+];
+
+const dates = [
+  { event: "Call for Talks Opens", date: "28 Oct 2024" },
+  { event: "Call for Talks Closes", date: "04 Nov 2024" },
+  { event: "Scholarship Applications Open", date: "28 Oct 2024" },
+  { event: "Deadline for Scholarship Requests", date: "07 Nov 2024" },
+  { event: "Scholarship Decisions", date: "12 Nov 2024" }
+];
+
+const socials = [
+  { name: "Telegram", url: "https://t.me/openstreetmapkerala", logo: "https://telegram.org/img/t_logo.svg" },
+  { name: "Matrix", url: "https://matrix.to/#/#osmkerala:matrix.org", logo: "https://www.svgrepo.com/show/342019/matrix.svg" },
+  { name: "Email", url: "mailto:[email protected]", logo: "https://www.svgrepo.com/show/484995/email-part-2.svg" }
+];
+---
+
+<Layout title={meta.title}>
+  <!-- Meta tags for SEO -->
+  <meta slot="head">
+    <meta name="description" content={meta.description} />
+    <meta name="author" content={meta.eventDetails.organizer} />
+    <meta name="keywords" content="OpenStreetMap, Kerala, mapping, SOTM, conference, GIS, open data, Wayanad, OSM" />
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href={meta.url} />
+
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content={meta.type} />
+    <meta property="og:url" content={meta.url} />
+    <meta property="og:title" content={meta.title} />
+    <meta property="og:description" content={meta.description} />
+    <meta property="og:image" content={meta.image} />
+    <meta property="og:site_name" content={meta.siteName} />
+    <meta property="og:locale" content={meta.locale} />
+
+    <!-- Event specific Open Graph tags -->
+    <meta property="event:start_time" content={meta.eventDetails.startDate} />
+    <meta property="event:end_time" content={meta.eventDetails.endDate} />
+    <meta property="event:location" content={meta.eventDetails.location} />
+    <meta property="event:organizer" content={meta.eventDetails.organizer} />
+
+    <!-- Twitter -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:site" content={meta.twitterHandle} />
+    <meta name="twitter:creator" content={meta.twitterHandle} />
+    <meta name="twitter:title" content={meta.title} />
+    <meta name="twitter:description" content={meta.description} />
+    <meta name="twitter:image" content={meta.image} />
+
+    <!-- Schema.org Event markup -->
+    <script type="application/ld+json">
+      {
+        "@context": "https://schema.org",
+        "@type": "Event",
+        "name": "State of the Map Kerala 2024",
+        "description": "${meta.description}",
+        "image": "${meta.image}",
+        "startDate": "${meta.eventDetails.startDate}",
+        "endDate": "${meta.eventDetails.endDate}",
+        "eventStatus": "https://schema.org/EventScheduled",
+        "eventAttendanceMode": "https://schema.org/OfflineEventAttendanceMode",
+        "location": {
+          "@type": "Place",
+          "name": "College of Veterinary Science, KVASU Pookode",
+          "address": {
+            "@type": "PostalAddress",
+            "streetAddress": "Lakkidi P.O.",
+            "addressLocality": "Wayanad",
+            "addressRegion": "Kerala",
+            "postalCode": "673576",
+            "addressCountry": "IN"
+          }
+        },
+        "organizer": {
+          "@type": "Organization",
+          "name": "OpenStreetMap Kerala Community",
+          "url": "https://kerala.openstreetmap.in"
+        },
+        "offers": {
+          "@type": "Offer",
+          "url": "https://makemypass.com/state-of-the-map-kerala",
+          "availability": "https://schema.org/InStock"
+        },
+        "performer": {
+          "@type": "Organization",
+          "name": "OpenStreetMap Kerala Community"
+        }
+      }
+    </script>
+
+    <!-- Additional meta tags -->
+    <meta name="theme-color" content="#16a34a" />
+    <meta name="robots" content="index, follow" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <!-- Apple specific -->
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="apple-mobile-web-app-title" content="SOTM Kerala 2024" />
+
+    <!-- Microsoft Tiles -->
+    <meta name="msapplication-TileColor" content="#16a34a" />
+    <meta name="msapplication-TileImage" content="/ms-icon-144x144.png" />
+  </meta>
+  <!-- Hero Section -->
+  <section class="bg-gradient-to-br from-green-600 to-green-700 text-white py-16 px-4">
+    <div class="max-w-6xl mx-auto">
+      <h1 class="text-4xl md:text-5xl font-bold mb-4">State of the Map Kerala '24</h1>
+      <p class="text-xl mb-8">Annual Gathering of Kerala's Mapping Community</p>
+      <div class="flex flex-wrap gap-4 mb-8">
+        <div class="flex items-center gap-2">
+          <img src="https://www.svgrepo.com/show/15932/calendar.svg" class="w-5 h-5 invert" alt="Date" />
+          <span>16-17 November 2024</span>
+        </div>
+        <div class="flex items-center gap-2">
+          <img src="https://www.svgrepo.com/show/513317/location-pin.svg" class="w-5 h-5 invert" alt="Location" />
+          <span>KVASU, Wayanad</span>
+        </div>
+      </div>
+      <div class="flex flex-wrap gap-4">
+        <a 
+          href="https://makemypass.com/state-of-the-map-kerala"
+          class="bg-white text-green-600 px-6 py-3 rounded-lg hover:bg-opacity-90 transition-all"
+        >
+          Register Now
+        </a>
+        <a 
+          href="https://wiki.openstreetmap.org/wiki/OSM_Kerala_Community_Meetup_2024"
+          class="border-2 border-white text-white px-6 py-3 rounded-lg hover:bg-white hover:bg-opacity-10 transition-all"
+        >
+          Event Wiki
+        </a>
+      </div>
+    </div>
+  </section>
+
+  <main class="max-w-6xl mx-auto px-4 py-12">
+    <!-- About -->
+    <section class="mb-16">
+      <h2 class="text-3xl font-bold mb-6 text-center">About the Event</h2>
+      <p class="text-lg text-gray-600 max-w-3xl mx-auto text-center mb-12">
+        Join us for two exciting days filled with learning, sharing, and collaboration as we work together 
+        to shape the future of mapping in Kerala.
+      </p>
+    </section>
+
+    <!-- Important Dates -->
+    <section class="mb-16 bg-gray-50 p-8 rounded-lg">
+      <h2 class="text-3xl font-bold mb-8 text-center">Important Dates</h2>
+      <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+        {dates.map(({ event, date }) => (
+          <div class="bg-white p-6 rounded-lg shadow-sm">
+            <h3 class="font-semibold mb-2">{event}</h3>
+            <p class="text-gray-600">{date}</p>
+          </div>
+        ))}
+      </div>
+    </section>
+
+    <!-- Venue -->
+    <section class="mb-16">
+      <h2 class="text-3xl font-bold mb-8 text-center">Venue</h2>
+      <div class="grid md:grid-cols-2 gap-8">
+        <div class="bg-white p-6 rounded-lg shadow-sm">
+          <h3 class="text-xl font-semibold mb-2">College of Veterinary Science</h3>
+          <p class="text-gray-600 mb-4">KVASU Pookode, Lakkidi P.O., Wayanad, Kerala 673576</p>
+          <a 
+            href="https://www.openstreetmap.org/?mlat=11.5351&mlon=76.0211#map=17/11.5351/76.0211"
+            class="text-green-600 hover:underline inline-flex items-center gap-2"
+            target="_blank"
+          >
+            View on OpenStreetMap →
+          </a>
+        </div>
+        <div class="h-[400px] rounded-lg overflow-hidden">
+          <iframe 
+            class="w-full h-full"
+            src="https://www.openstreetmap.org/export/embed.html?bbox=76.01699829101564%2C11.53239958159262%2C76.02523803710939%2C11.537835922501685&layer=mapnik&marker=11.535117612391382%2C76.02111816406251"
+          ></iframe>
+        </div>
+      </div>
+    </section>
+
+    <!-- Sponsors -->
+    <section class="mb-16">
+      <h2 class="text-3xl font-bold mb-12 text-center">Our Sponsors</h2>
+
+      <!-- Platinum -->
+      <div class="mb-12">
+        <h3 class="text-lg font-semibold mb-6 text-center text-gray-600">Platinum Sponsor</h3>
+        <div class="flex justify-center">
+          {sponsors.platinum.map(sponsor => (
+            <a 
+              href={sponsor.url}
+              class="bg-slate-100 p-8 rounded-lg shadow-sm hover:shadow-md transition-shadow"
+              target="_blank"
+            >
+              <img src={sponsor.logo} alt={sponsor.name} class="h-12" />
+            </a>
+          ))}
+        </div>
+      </div>
+
+      <!-- Silver -->
+      <div class="mb-12">
+        <h3 class="text-lg font-semibold mb-6 text-center text-gray-600">Silver Sponsor</h3>
+        <div class="flex justify-center">
+          {sponsors.silver.map(sponsor => (
+            <a 
+              href={sponsor.url}
+              class="bg-slate-100 p-8 rounded-lg shadow-sm hover:shadow-md transition-shadow"
+              target="_blank"
+            >
+              <img src={sponsor.logo} alt={sponsor.name} class="h-10" />
+            </a>
+          ))}
+        </div>
+      </div>
+
+      <!-- Bronze -->
+      <div class="mb-12">
+        <h3 class="text-lg font-semibold mb-6 text-center text-gray-600">Bronze Sponsors</h3>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-2xl mx-auto">
+          {sponsors.bronze.map(sponsor => (
+            <a 
+              href={sponsor.url}
+              class="bg-slate-100 p-8 rounded-lg shadow-sm hover:shadow-md transition-shadow flex items-center justify-center"
+              target="_blank"
+            >
+              <img src={sponsor.logo} alt={sponsor.name} class="h-8" />
+            </a>
+          ))}
+        </div>
+      </div>
+
+      <!-- Community Partners -->
+      <div>
+        <h3 class="text-lg font-semibold mb-6 text-center text-gray-600">Community Partners</h3>
+        <div class="grid grid-cols-2 md:grid-cols-3 gap-6 max-w-3xl mx-auto">
+          {communityPartners.map(partner => (
+            <div class="bg-slate-100 p-6 rounded-lg shadow-sm flex items-center justify-center">
+              <img src={partner.logo} alt={partner.name} class="h-8" />
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact -->
+    <section class="text-center">
+      <h2 class="text-3xl font-bold mb-8">Get in Touch</h2>
+      <div class="flex justify-center gap-8">
+        {socials.map(social => (
+          <a 
+            href={social.url}
+            class="text-gray-600 hover:text-green-600 transition-colors flex items-center gap-2"
+            target="_blank"
+          >
+            <img src={social.logo} alt={social.name} class="w-5 h-5" />
+            <span>{social.name}</span>
+          </a>
+        ))}
+      </div>
+    </section>
+  </main>
+</Layout>
+---