diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..6503605 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,45 @@ +FROM node:20-alpine AS base + +# Install dependencies only when needed +FROM base AS deps +RUN apk add --no-cache libc6-compat +WORKDIR /app + +COPY package.json package-lock.json ./ +RUN npm ci + +# Build the application +FROM base AS builder +WORKDIR /app +COPY --from=deps /app/node_modules ./node_modules +COPY . . + +RUN npm run build + +# Production image +FROM base AS runner +WORKDIR /app + +ENV NODE_ENV=production + +RUN addgroup --system --gid 1001 nodejs +RUN adduser --system --uid 1001 nextjs + +COPY --from=builder /app/public ./public + +# Set the correct permission for prerender cache +RUN mkdir .next +RUN chown nextjs:nodejs .next + +# Copy standalone output +COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./ +COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static + +USER nextjs + +EXPOSE 3000 + +ENV PORT=3000 +ENV HOSTNAME="0.0.0.0" + +CMD ["node", "server.js"] diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..a29f583 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,17 @@ +services: + xhivart-mirror: + build: . + container_name: xhivart-mirror + restart: always + networks: + - traefik-public + labels: + - "traefik.enable=true" + - "traefik.http.routers.xhivart-mirror.rule=Host(`xhivart.jeffemmett.com`)" + - "traefik.http.routers.xhivart-mirror.entrypoints=web" + - "traefik.http.services.xhivart-mirror.loadbalancer.server.port=3000" + - "traefik.docker.network=traefik-public" + +networks: + traefik-public: + external: true diff --git a/next.config.ts b/next.config.ts index e9ffa30..68a6c64 100644 --- a/next.config.ts +++ b/next.config.ts @@ -1,7 +1,7 @@ import type { NextConfig } from "next"; const nextConfig: NextConfig = { - /* config options here */ + output: "standalone", }; export default nextConfig; diff --git a/src/app/globals.css b/src/app/globals.css index a2dc41e..013fd87 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -1,26 +1,289 @@ @import "tailwindcss"; :root { - --background: #ffffff; - --foreground: #171717; + --bg-cream: #faf8f5; + --bg-dark: #1a1a1a; + --bg-darker: #0f0f0f; + --text-dark: #2d2d2d; + --text-light: #f5f5f5; + --text-muted: #6b6b6b; + --accent-gold: #c9a962; + --accent-lavender: #d4c4e8; + --accent-pink: #e8c4d4; + --accent-mint: #c4e8d4; + --accent-rose: #e8d4c4; } -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); +* { + margin: 0; + padding: 0; + box-sizing: border-box; } -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } +html { + scroll-behavior: smooth; } body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; + background: var(--bg-cream); + color: var(--text-dark); + font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif; + line-height: 1.8; +} + +/* Typography */ +h1, h2, h3, h4 { + font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif; + font-weight: 300; + letter-spacing: 0.05em; +} + +.font-sans-alt { + font-family: var(--font-montserrat), 'Montserrat', sans-serif; +} + +/* Navigation */ +.nav-link { + font-family: var(--font-montserrat), 'Montserrat', sans-serif; + font-size: 0.75rem; + letter-spacing: 0.15em; + text-transform: uppercase; + text-decoration: none; + color: var(--text-dark); + transition: color 0.3s ease; + padding: 0.5rem 1rem; +} + +.nav-link:hover { + color: var(--accent-gold); +} + +/* Elegant button styles */ +.btn-outline { + display: inline-block; + padding: 0.875rem 2rem; + border: 1px solid var(--text-dark); + border-radius: 50px; + font-family: var(--font-montserrat), 'Montserrat', sans-serif; + font-size: 0.7rem; + letter-spacing: 0.2em; + text-transform: uppercase; + text-decoration: none; + color: var(--text-dark); + transition: all 0.3s ease; + background: transparent; + cursor: pointer; +} + +.btn-outline:hover { + background: var(--text-dark); + color: var(--bg-cream); +} + +.btn-outline-light { + border-color: var(--text-light); + color: var(--text-light); +} + +.btn-outline-light:hover { + background: var(--text-light); + color: var(--bg-dark); +} + +.btn-filled { + display: inline-block; + padding: 0.875rem 2rem; + background: var(--text-dark); + border: 1px solid var(--text-dark); + border-radius: 50px; + font-family: var(--font-montserrat), 'Montserrat', sans-serif; + font-size: 0.7rem; + letter-spacing: 0.2em; + text-transform: uppercase; + text-decoration: none; + color: var(--bg-cream); + transition: all 0.3s ease; + cursor: pointer; +} + +.btn-filled:hover { + background: transparent; + color: var(--text-dark); +} + +/* Service cards */ +.service-card { + padding: 3rem 2rem; + border-radius: 1rem; + text-align: center; + transition: transform 0.3s ease, box-shadow 0.3s ease; + background: white; +} + +.service-card:hover { + transform: translateY(-5px); + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); +} + +.service-card.lavender { background: var(--accent-lavender); } +.service-card.pink { background: var(--accent-pink); } +.service-card.mint { background: var(--accent-mint); } +.service-card.rose { background: var(--accent-rose); } + +/* Section spacing */ +.section { + padding: 6rem 2rem; +} + +@media (min-width: 768px) { + .section { + padding: 8rem 4rem; + } +} + +/* Decorative elements */ +.divider { + width: 60px; + height: 1px; + background: var(--accent-gold); + margin: 2rem auto; +} + +.divider-wide { + width: 120px; +} + +/* Image placeholder */ +.img-placeholder { + background: linear-gradient(135deg, var(--accent-lavender) 0%, var(--accent-pink) 100%); + display: flex; + align-items: center; + justify-content: center; + color: var(--text-dark); + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase; +} + +/* Testimonial */ +.testimonial { + font-style: italic; + font-size: 1.125rem; + max-width: 600px; + margin: 0 auto; + text-align: center; +} + +.testimonial-card { + background: white; + padding: 2.5rem; + border-radius: 1rem; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); + text-align: center; +} + +/* Footer */ +.footer-link { + font-family: var(--font-montserrat), 'Montserrat', sans-serif; + font-size: 0.75rem; + letter-spacing: 0.1em; + color: var(--text-light); + text-decoration: none; + opacity: 0.7; + transition: opacity 0.3s; +} + +.footer-link:hover { + opacity: 1; +} + +/* Hero section */ +.hero-gradient { + background: linear-gradient( + 180deg, + var(--bg-cream) 0%, + rgba(212, 196, 232, 0.2) 50%, + var(--bg-cream) 100% + ); +} + +/* Dark sections */ +.dark-section { + background: var(--bg-dark); + color: var(--text-light); +} + +.darker-section { + background: var(--bg-darker); + color: var(--text-light); +} + +/* Animations */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(20px); } + to { opacity: 1; transform: translateY(0); } +} + +@keyframes fadeInUp { + from { opacity: 0; transform: translateY(40px); } + to { opacity: 1; transform: translateY(0); } +} + +.fade-in { + animation: fadeIn 0.8s ease forwards; +} + +.fade-in-up { + animation: fadeInUp 1s ease forwards; +} + +/* Staggered animations */ +.stagger-1 { animation-delay: 0.1s; } +.stagger-2 { animation-delay: 0.2s; } +.stagger-3 { animation-delay: 0.3s; } +.stagger-4 { animation-delay: 0.4s; } + +/* Quote styling */ +.quote-mark { + font-size: 4rem; + line-height: 1; + color: var(--accent-gold); + opacity: 0.5; +} + +/* Glassmorphism effect */ +.glass { + background: rgba(255, 255, 255, 0.7); + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.3); +} + +/* Mobile menu */ +.mobile-menu { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: var(--bg-cream); + z-index: 100; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 2rem; +} + +/* Event cards */ +.event-card { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 1rem; + padding: 2rem; + transition: all 0.3s ease; +} + +.event-card:hover { + background: rgba(255, 255, 255, 0.08); + border-color: var(--accent-gold); } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f7fa87e..2f59b7a 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,20 +1,23 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; +import { Cormorant_Garamond, Montserrat } from "next/font/google"; import "./globals.css"; -const geistSans = Geist({ - variable: "--font-geist-sans", +const cormorant = Cormorant_Garamond({ + variable: "--font-cormorant", subsets: ["latin"], + weight: ["300", "400", "500", "600", "700"], }); -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", +const montserrat = Montserrat({ + variable: "--font-montserrat", subsets: ["latin"], + weight: ["300", "400", "500", "600"], }); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "XHIVA ART | Ximena Xaguar - Visionary Artist", + description: "Multidisciplinary visionary artist working at the intersection of art, ritual and embodied presence. Crystal therapy, Temazcal ceremonies, and transformative art experiences.", + keywords: ["visionary art", "crystal therapy", "temazcal", "ritual healing", "Ximena Xaguar", "Re Evolution Art"], }; export default function RootLayout({ @@ -25,7 +28,7 @@ export default function RootLayout({ return ( {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index 295f8fd..8e05380 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,65 +1,524 @@ -import Image from "next/image"; +'use client'; + +import { useState } from 'react'; +import Link from 'next/link'; + +// Navigation Component +function Navigation() { + const [mobileMenuOpen, setMobileMenuOpen] = useState(false); -export default function Home() { return ( -
-
- Next.js logo -
-

- To get started, edit the page.tsx file. -

-

- Looking for a starting point or more instructions? Head over to{" "} - - Templates - {" "} - or the{" "} - - Learning - {" "} - center. -

-
-
- +
-
+ + + {/* Mobile Menu */} + {mobileMenuOpen && ( +
+ + setMobileMenuOpen(false)}>Home + setMobileMenuOpen(false)}>Art + setMobileMenuOpen(false)}>About + setMobileMenuOpen(false)}>Services + setMobileMenuOpen(false)}>Re Evolution Art + setMobileMenuOpen(false)}>Contact +
+ )} + + ); +} + +// Hero Section +function HeroSection() { + return ( +
+
+

+ MULTIDISCIPLINARY VISIONARY ARTIST +

+

+ XIMENA XAGUAR +

+
+

+ Working at the intersection of art, ritual and embodied presence, creating experiences + that support clarity, integration, exploration and transformation. +

+
+ + Explore Art & Ritual Sessions + + + Discover Re Evolution Art + +
+
+ + {/* Scroll indicator */} +
+ + + +
+
+ ); +} + +// Ritual Art Alchemy Section +function RitualArtSection() { + return ( +
+
+
+ {/* Image placeholder */} +
+ Visionary Art +
+ +
+

+ VISUAL ALCHEMY +

+

+ Ritual Art Alchemy +

+
+

+ My art is my ritual — a journey of transformation. Each painting emerges from + cycles of death and rebirth, shadow work, intuitive vision and ancestral memory. +

+

+ Through symbolic language and universal cosmovision, I translate inner processes + into living images. These artworks are not objects. They are portals. Allies for + emotional integration, transformation, spiritual insight and energetic coherence. +

+ + Enter the Gallery + +
+
+
+
+ ); +} + +// Services Section +function ServicesSection() { + const services = [ + { + title: 'Crystal Therapy', + subtitle: 'Nervous System Alignment', + duration: 'Crystal reading / 1 hour', + description: 'One-to-one sessions supporting nervous system regulation and emotional integration through crystal energetic work, elemental somatic presence and intuitive mapping addressing emotional, physical, mental and spiritual coherence.', + color: 'lavender', + }, + { + title: 'Temazcal', + subtitle: 'Medicine of the Four Elements', + duration: 'Fire - Earth - Water - Air', + description: 'Sweatlodge ceremonies guided for 15+ years, rooted in Native American ancestral tradition. Working with four elements and four bodies (physical, emotional, mental, spiritual) within a contained ritual space supporting purification, closure and renewal.', + color: 'mint', + }, + { + title: 'Deep Integration', + subtitle: 'Transformation Session', + duration: '2 Hours', + description: 'Tailored container for life transitions, post-ceremonial integration or emotional transformation combining somatic work, crystal mapping, astrological and ritual guidance supporting embodiment of insight and conscious transformation.', + color: 'rose', + }, + ]; + + return ( +
+
+
+

+ OFFERINGS +

+

+ Ritual Healing & Integration +

+
+

+ Decades of embodied practice since 2009. Current focus is integration and embodiment— + supporting people to anchor insight, develop inner coherence and regulate nervous systems + within deep transformation processes. +

+
+ +
+ {services.map((service, index) => ( +
+

{service.title}

+

+ {service.subtitle} +

+

+ {service.duration} +

+

+ {service.description} +

+
+ ))} +
+ +
+ + Book a Session + +
+
+
+ ); +} + +// Re Evolution Art Section +function ReEvolutionSection() { + const events = [ + { + title: 'Tribal Nights', + description: 'A signature event weaving ritual, dance and immersive art into one transformative experience.', + }, + { + title: 'Tribal Experience', + description: 'Group immersion exploring the unconscious through shamanic journeying, art alchemy and embodied movement.', + }, + { + title: 'Visionary Art Week Zürich', + description: 'Curated week featuring international artists, performances, live music, talks and workshops.', + }, + { + title: 'Future Gatherings', + description: 'Experimental experiences weaving DJ sets with expanded states of presence.', + }, + ]; + + return ( +
+
+
+

+ CULTURAL PLATFORM +

+

+ Re Evolution Art +

+
+

+ A visionary cultural platform based in Switzerland and rooted in Bolivia. Through exhibitions, + immersive gatherings, TRIBAL events and collaborative projects, we bring together artists, + ritualists, musicians and independent creators engaged in inner work and cultural dialogue. + We bridge ancestral memory with contemporary expression. +

+
+ +
+ {events.map((event, index) => ( +
+

+ {event.title} +

+

+ {event.description} +

+
+ ))} +
+ +
+ + Explore Events + +
+
+
+ ); +} + +// Testimonials Section +function TestimonialsSection() { + const testimonials = [ + { + quote: "The crystal healing session created an immediate connection and brought my soul forth. I deeply appreciate the support through the process.", + author: "Dieter Katterbach", + }, + { + quote: "The sweat lodge ceremony was powerfully moving, highlighting the integration of healing, compassion and authentic expression.", + author: "Kermit Goodman", + }, + { + quote: "The experience was powerfully transformative — it changed my understanding of ceremony itself.", + author: "Verana Bailowitz", + }, + ]; + + return ( +
+
+
+

+ TESTIMONIALS +

+

+ Words of Gratitude +

+
+
+ +
+ {testimonials.map((testimonial, index) => ( +
+ " +

+ {testimonial.quote} +

+

+ — {testimonial.author} +

+
+ ))} +
+
+
+ ); +} + +// About Section +function AboutSection() { + return ( +
+
+
+
+

+ THE ARTIST +

+

+ About Ximena +

+
+

+ Years dedicated to work in Bolivia, Peru and Switzerland shaped this path through + emotional integration, somatic healing and ceremonial support. +

+

+ A beautiful, talented artist rooted in ancestral culture and land connection — + healer, visionary artist, mother and friend — providing deep support through inner work. +

+ + Connect + +
+ + {/* Image placeholder */} +
+ Portrait +
+
+
+
+ ); +} + +// Work With Me Section +function WorkWithMeSection() { + return ( +
+
+

+ Work With Me +

+
+

+ This work is for those ready to meet themselves honestly with courage, + sensitivity and presence. +

+
+ + Book a Session + + + Contact Me + +
+
+
+ ); +} + +// Contact Section +function ContactSection() { + return ( +
+
+

+ GET IN TOUCH +

+

+ Begin Your Journey +

+
+

+ For inquiries about sessions, art commissions, or event collaborations, + please reach out through the form below or connect on social media. +

+ + {/* Contact Form */} +
+
+ + +
+
+ + +
+
+ +