Initialize repo

components/pricing.tsx

@@ -0,0 +1,139 @@
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+
+const pricingData = [
+  {
+    name: "Pokój 1-osobowy (31)",
+    low: 120,
+    high: 150,
+    lowEnd: 120,
+  },
+  {
+    name: "Pokój 2-osobowy (30, 32)",
+    low: 140,
+    high: 170,
+    lowEnd: 140,
+  },
+  {
+    name: "Pokój studio - 2 pokoje, łazienka dla 5 osób (27 - 29)",
+    low: 300,
+    high: 350,
+    lowEnd: 300,
+  },
+  {
+    name: "Domek 2-osobowy (1, 5, 6, 10, 20)",
+    low: 160,
+    high: 200,
+    lowEnd: 160,
+  },
+  {
+    name: "Domek 3-osobowy (2, 3, 7, 8, 14, 15)",
+    low: 190,
+    high: 230,
+    lowEnd: 190,
+  },
+  {
+    name: "Domek 4-osobowy z 1 sypialnią (4, 9, 11, 12, 13)",
+    low: 200,
+    high: 270,
+    lowEnd: 200,
+  },
+  {
+    name: "Domek 4-osobowy z 2 sypialniami (21 - 26)",
+    low: 250,
+    high: 320,
+    lowEnd: 250,
+  },
+];
+
+export function Pricing() {
+  return (
+    <section id="pricing" className="py-24 bg-secondary">
+      <div className="container mx-auto px-6">
+        <div className="text-center mb-16">
+          <p className="text-primary uppercase tracking-[0.2em] text-sm font-medium mb-4">
+            Cennik
+          </p>
+          <h2 className="font-serif text-4xl md:text-5xl font-bold text-foreground">
+            Cennik 2026
+          </h2>
+        </div>
+
+        <div className="max-w-4xl mx-auto">
+          <Card className="border-none shadow-lg">
+            <CardHeader>
+              <CardTitle className="font-serif">Ceny za dobę (PLN)</CardTitle>
+              <CardDescription>
+                Doba rozpoczyna się od godziny 14:00 i trwa do godziny 10:00 w dniu wyjazdu
+              </CardDescription>
+            </CardHeader>
+            <CardContent>
+              <div className="overflow-x-auto">
+
+                <p className="font-serif text-2xl text-center md:text-2xl font-bold text-foreground">
+                  Cennik zostanie zaktualizowany na dniach
+                </p>
+
+                 {/* <table className="w-full">
+                  <thead>
+                    <tr className="border-b border-border">
+                      <th className="text-left py-4 px-3 text-sm font-medium text-muted-foreground">
+                        Rodzaj zakwaterowania
+                      </th>
+                      <th className="text-center py-4 px-3 text-sm font-medium text-muted-foreground">
+                        01.06 - 11.07
+                      </th>
+                      <th className="text-center py-4 px-3 text-sm font-medium text-muted-foreground bg-accent/50 rounded-t-lg">
+                        12.07 - 16.08
+                      </th>
+                      <th className="text-center py-4 px-3 text-sm font-medium text-muted-foreground">
+                        17.08 - 30.09
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {pricingData.map((item, index) => (
+                      <tr
+                        key={item.name}
+                        className={`border-b border-border/50 transition-colors hover:bg-secondary/50 ${
+                          index === pricingData.length - 1 ? "border-none" : ""
+                        }`}
+                      >
+                        <td className="py-4 px-3 text-sm font-medium text-foreground">
+                          {item.name}
+                        </td>
+                        <td className="text-center py-4 px-3 text-sm text-muted-foreground">
+                          {item.low} zł
+                        </td>
+                        <td className="text-center py-4 px-3 text-sm font-semibold text-foreground bg-accent/30">
+                          {item.high} zł
+                        </td>
+                        <td className="text-center py-4 px-3 text-sm text-muted-foreground">
+                          {item.lowEnd} zł
+                        </td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>*/}
+              </div>
+
+              {/* <div className="mt-8 p-6 border-t border-border rounded-xl text-left">
+                <h3 className="font-semibold text-foreground mb-4">Informacje dodatkowe:</h3>
+                <ul className="space-y-2 text-muted-foreground mb-6">
+                  <li>• Rezerwujemy pobyty minimum od 6 noclegów</li>
+                  <li>• Zwierzęta - 15 zł/dzień</li>
+                  <li>• Opłata klimatyczna wg ustaleń Gminy Kołobrzeg</li>
+                  <li>• Opłata za zużycie energii elektrycznej – 2,50 zł / kWh</li>
+                  <li>• Stałym klientom udzielamy rabatu 😊</li>
+                </ul>
+                <div className="p-6 bg-secondary rounded-xl">
+                  <p className="font-medium text-foreground">Numer konta bankowego ING:</p>
+                  <p className="text-muted-foreground font-mono mt-1">78 1050 1559 1000 0092 4707 1898</p>
+                </div>
+              </div> */}
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+    </section>
+  );
+}