From 6c71a67a7473ee30c424ac63b4d2b27c38007d5e Mon Sep 17 00:00:00 2001
From: Dawid Rycerz <dawid@rycerz.xyz>
Date: Tue, 22 Jul 2025 17:04:21 +0300
Subject: Add map

---
 src/components/widgets/Map.astro | 60 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)
 create mode 100644 src/components/widgets/Map.astro

(limited to 'src/components')

diff --git a/src/components/widgets/Map.astro b/src/components/widgets/Map.astro
new file mode 100644
index 0000000..dae8253
--- /dev/null
+++ b/src/components/widgets/Map.astro
@@ -0,0 +1,60 @@
+---
+import type { Map as Props } from '~/types';
+import Headline from '~/components/ui/Headline.astro';
+import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
+
+const {
+  title = '',
+  subtitle = '',
+  tagline = '',
+  location = '',
+  height = 400,
+  lat = 53.1234,
+  lon = 18.0123,
+
+  id,
+  isDark = false,
+  classes = {},
+  bg = await Astro.slots.render('bg'),
+} = Astro.props;
+
+// Use provided coordinates or default to Bydgoszcz, Miedzyń
+const coordinates = {
+  lat: lat,
+  lon: lon
+};
+
+// Create map URL with proper coordinates
+const mapUrl = `https://www.openstreetmap.org/export/embed.html?bbox=${coordinates.lon-0.01},${coordinates.lat-0.01},${coordinates.lon+0.01},${coordinates.lat+0.01}&layer=mapnik&marker=${coordinates.lat},${coordinates.lon}`;
+---
+
+<WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-7xl mx-auto ${classes?.container ?? ''}`} bg={bg}>
+  <Headline title={title} subtitle={subtitle} tagline={tagline} />
+
+  <div class="mx-auto max-w-7xl p-4 md:px-8">
+    <div class="relative overflow-hidden rounded-lg shadow-xl dark:shadow-none dark:border dark:border-slate-600">
+      <iframe
+        width="100%"
+        height={height}
+        frameborder="0"
+        scrolling="no"
+        marginheight="0"
+        marginwidth="0"
+        src={mapUrl}
+        title="Mapa lokalizacji CustomWorks"
+        class="w-full"
+      >
+      </iframe>
+      <div class="absolute bottom-4 right-4">
+        <a
+          href={`https://www.openstreetmap.org/search?query=${encodeURIComponent(location)}`}
+          target="_blank"
+          rel="noopener noreferrer"
+          class="bg-white dark:bg-slate-800 text-slate-700 dark:text-slate-300 px-3 py-2 rounded-md text-sm font-medium shadow-lg hover:bg-slate-50 dark:hover:bg-slate-700 transition-colors duration-200"
+        >
+          Otwórz w OpenStreetMap
+        </a>
+      </div>
+    </div>
+  </div>
+</WidgetWrapper> 
\ No newline at end of file
-- 
cgit v1.2.3