Merge version_3 into main #3

Merged
bender merged 2 commits from version_3 into main 2026-03-05 22:07:07 +00:00
2 changed files with 135 additions and 7 deletions

90
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,90 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Zap, Mail } from 'lucide-react';
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="small"
sizing="medium"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarStyleApple
brandName="Rage Room Vienna"
navItems={[
{ name: "Packages", id: "/" },
{ name: "Experience", id: "/" },
{ name: "FAQ", id: "/" },
{ name: "Contact", id: "/contact" },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
tag="Get In Touch"
tagIcon={Mail}
tagAnimation="slide-up"
title="We're Here to Help"
description="Have questions about our packages, group bookings, or special requests? Reach out to our team and we'll get back to you as soon as possible."
background={{ variant: "canvas-reveal" }}
useInvertedBackground={false}
imageSrc="http://img.b2bpic.net/free-photo/person-suffering-from-technology-addiction-cybersickness_23-2151552653.jpg"
imageAlt="Contact us"
mediaAnimation="blur-reveal"
mediaPosition="right"
inputPlaceholder="your@email.com"
buttonText="Send Message"
termsText="We'll respond to your inquiry within 24 hours. Your information is secure and won't be shared."
onSubmit={(email) => {
alert(`Thank you! We'll contact you at ${email} soon.`);
}}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/weathered-concrete-wall-texture-with-stains_632498-60807.jpg"
imageAlt="Industrial concrete background"
logoText="Rage Room Vienna"
copyrightText="© 2025 Rage Room Vienna | Adrenaline. Chaos. Freedom."
columns={[
{
title: "Experience", items: [
{ label: "Packages", href: "/" },
{ label: "About Us", href: "/" },
{ label: "Safety", href: "/" },
],
},
{
title: "Info", items: [
{ label: "Hours", href: "#" },
{ label: "Contact", href: "/contact" },
{ label: "Book Now", href: "https://booking.rageroomvienna.local" },
],
},
{
title: "Follow", items: [
{ label: "Instagram", href: "https://instagram.com" },
{ label: "Facebook", href: "https://facebook.com" },
{ label: "TikTok", href: "https://tiktok.com" },
],
},
]}
/>
</div>
</ThemeProvider>
);
}

View File

@@ -21,7 +21,7 @@ export default function LandingPage() {
const calculatePrice = (basePrice: number, quantity: number) => {
if (quantity >= 4) {
return Math.round(basePrice * 0.8 * 100) / 100;
return 40;
}
return basePrice;
};
@@ -131,16 +131,25 @@ export default function LandingPage() {
</div>
<div id="pricing" data-section="pricing">
<div className="w-full bg-gradient-to-b from-background to-background py-12 md:py-16 flex items-center justify-center">
<div className="w-full max-w-3xl px-6 md:px-8 text-center">
<div className="mb-8 md:mb-12">
<h3 className="text-2xl md:text-3xl font-bold text-foreground mb-3">Group Discount Available</h3>
<p className="text-lg md:text-2xl font-semibold text-primary-cta">4+ people = 40/person</p>
<p className="text-sm md:text-base text-foreground/70 mt-2">Perfect for team building and group experiences</p>
</div>
</div>
</div>
<PricingCardEight
title="Choose Your Explosion"
description="Three fury-fueled packages designed to match your rage level. All include protective gear, tools, and unlimited smashing. Group discount: 4+ people pay only €40 per person per package!"
description="Three fury-fueled packages designed to match your rage level. All include protective gear, tools, and unlimited smashing."
tag="Pricing"
tagIcon={Zap}
tagAnimation="slide-up"
plans={[
{
id: "basic", badge: "Beginner", badgeIcon: Flame,
price: "€49", subtitle: "Perfect First Strike 30 Minutes | Save 18% with groups of 4+", buttons: [
price: "€49", subtitle: "Perfect First Strike 30 Minutes", buttons: [
{ text: "Book Package", onClick: () => openBookingModal('basic') },
],
features: [
@@ -148,19 +157,19 @@ export default function LandingPage() {
},
{
id: "destroyer", badge: "Most Popular", badgeIcon: Sparkles,
price: "€79", subtitle: "Best Value 60 Minutes | Save 18% with groups of 4+", buttons: [
price: "€79", subtitle: "Best Value 60 Minutes", buttons: [
{ text: "Book Now", onClick: () => openBookingModal('destroyer') },
],
features: [
"60 minutes of maximum chaos", "Premium safety equipment", "Glass, ceramics & electronics", "Doubles or small group", "Most items to smash", "Best value experience", "Group price: €63/person (4+ people)"],
"60 minutes of maximum chaos", "Premium safety equipment", "Glass, ceramics & electronics", "Doubles or small group", "Most items to smash", "Best value experience", "Group price: €40/person (4+ people)"],
},
{
id: "elite", badge: "Ultimate", badgeIcon: Crown,
price: "€129", subtitle: "Total Annihilation 90 Minutes | Save 18% with groups of 4+", buttons: [
price: "€129", subtitle: "Total Annihilation 90 Minutes", buttons: [
{ text: "Reserve Elite", onClick: () => openBookingModal('elite') },
],
features: [
"90 minutes unlimited destruction", "VIP treatment & priorities", "All destruction categories", "Small group packages", "Premium room setup", "Professional photos included", "Group price: €103/person (4+ people)"],
"90 minutes unlimited destruction", "VIP treatment & priorities", "All destruction categories", "Small group packages", "Premium room setup", "Professional photos included", "Group price: €40/person (4+ people)"],
},
]}
animationType="slide-up"
@@ -212,6 +221,35 @@ export default function LandingPage() {
/>
</div>
<div id="maps" data-section="maps">
<div className="w-full bg-card py-16 md:py-24">
<div className="flex items-center justify-center w-full">
<div className="w-full max-w-6xl px-6 md:px-8">
<div className="text-center mb-12">
<h2 className="text-3xl md:text-4xl font-bold text-foreground mb-3">Visit Us</h2>
<p className="text-lg text-foreground/70">Find Rage Room Vienna at our location in the heart of the city</p>
</div>
<div className="w-full rounded-lg overflow-hidden shadow-lg" style={{ height: '500px' }}>
<iframe
width="100%"
height="100%"
style={{ border: 0 }}
loading="lazy"
allowFullScreen
referrerPolicy="no-referrer-when-downgrade"
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2659.2098789453607!2d16.36892492346897!3d48.20849977122393!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x476d079f8c41d6ad%3A0x1234567890!2sVienna%2C%20Austria!5e0!3m2!1sen!2sat!4v1234567890"
></iframe>
</div>
<div className="mt-8 text-center">
<p className="text-foreground font-semibold mb-2">Rage Room Vienna</p>
<p className="text-foreground/70">Vienna, Austria</p>
<p className="text-foreground/70 mt-4">Open: Thu 5PM-10PM | Fri 2PM-12AM | Sat & Sun 12PM-12AM</p>
</div>
</div>
</div>
</div>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Ready to Rage?"