Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/gus-16710/invitations/llms.txt

Use this file to discover all available pages before exploring further.

The /festejos/[name] category is the platform’s most creatively flexible section, housing themed party invitations that do not fit the sacramental or scholastic categories. Each invitation is a standalone creative project with a unique visual identity — Halloween-inspired gothic designs, fairy-tale princess aesthetics, Reyes Magos seasonal themes, and more. Like the other categories, every festejos invitation opens with a dismissable modal (using @nextui-org/react’s <Modal>) that auto-closes after a brief delay, revealing a Splide-powered invitation with a full-cover background image or layer. All celebration pages include a styles.css and a layout file, making each one a fully encapsulated micro-site within the Next.js static export.

Available Celebration Invitations

The following slugs currently exist under /festejos/:
SlugThemeRoute
adrianaReyes Magos / Three Kings/festejos/adriana
anell-joanhaBirthday Celebration/festejos/anell-joanha
janniaHalloween / Merlina (Wednesday Addams)/festejos/jannia
jyrBirthday Celebration/festejos/jyr
kimberly-cristinaSnow White / Fairy Tale/festejos/kimberly-cristina
megan-guadalupeSnow White / Fairy Tale/festejos/megan-guadalupe

Themed Designs

The festejos category embraces creative variety that sets it apart from the more ceremonial invitation types:
  • Halloween / Merlina (Jannia) — inspired by Netflix’s Wednesday / Merlina, this invitation uses a fixed full-cover /img/festejos/jannia/background.jpg for the main container, with a separate bats-background.png composited as an absolutely-positioned animated layer behind the Splide slider (using framer-motion variants). Three custom typefaces are loaded via @font-face in styles.css: adelia, verve (mapped to Machinery.otf), and rumble (mapped to Rumble.otf). The opening modal uses a backdrop="transparent" backdrop and auto-closes after 2 seconds.
  • Snow White / Fairy Tale (kimberly-cristina, megan-guadalupe) — princess party themes drawing from the Snow White aesthetic, with storybook-inspired typography, illustrated character assets, and warm jewel-tone color palettes.
  • Reyes Magos / Three Kings (adriana) — a seasonal celebration invitation themed around the January 6th Three Kings tradition, featuring crown motifs, star imagery, and the warm gold-and-deep-blue palette of the Epiphany holiday.

Typical Sections for Celebrations

The sections present in a festejos invitation vary by honoree. The jannia invitation, for example, includes the following Splide slides in order: Header, Presentation, GodParents, Ceremony (location), Reception, and Gifts. Not every celebration invitation includes an Itinerary or Gallery slide — these are added only where the event program or a photo session warrants it.
1

Header

The opening hero slide with the honoree’s name rendered in the invitation’s signature custom typeface, the party date, and a thematic decorative background that immediately communicates the party’s creative concept.
2

Presentation

A personal welcome message from the hosts introducing the birthday person or event, styled with the invitation’s color palette and animated entry effects.
3

GodParents

A section acknowledging padrinos and madrinas who are sponsoring elements of the celebration, present in invitations such as jannia where sponsors contribute to the event.
4

Ceremony / Location

Party venue details — address, start time, and dress code if applicable — with a Google Maps link for guests who need directions to the celebration space.
5

Reception

A secondary location or post-ceremony details where applicable, providing address and arrival time for the main celebration space.
6

Gifts

Gift table (mesa de regalos) or bank transfer information so guests can contribute to the honoree, present in invitations like jannia.
7

AudioControl

A persistent floating music button that lets guests play or pause a themed background track — a spooky melody for Halloween, a fairy-tale orchestral piece for Snow White themes.

Jannia (Halloween) — Main Layout Example

The following is drawn directly from src/app/festejos/jannia/components/Main.tsx and shows how the bats background layer is composited behind the Splide slider:
export default function Main() {
  const [open, setOpen] = useState(false);

  useEffect(() => {
    // Auto-close modal after 2 seconds, then mount invitation
    setTimeout(() => {
      setOpen(true);
    }, 2000);
  }, []);

  return (
    <div
      className="max-w-3xl m-auto shadow-large bg-[url('/img/festejos/jannia/background.jpg')] bg-center bg-cover bg-fixed"
      style={{ backgroundColor: "#f4f3e1" }}
    >
      {open && (
        <motion.div
          initial={{ opacity: 0 }}
          animate={{ opacity: 1 }}
          transition={{ duration: 1 }}
          className="relative overflow-clip"
        >
          <Splide
            aria-label="Sarang"
            options={{
              rewind: true,
              direction: "ttb",
              height: "100svh",
              wheel: true,
              releaseWheel: true,
              type: "loop",
              waitForTransition: true,
              arrows: false,
              classes: {
                page: "splide__pagination__page custom-class-page",
              },
            }}
            className="z-10"
          >
            <SplideSlide><Header splide={splide} /></SplideSlide>
            <SplideSlide><Presentation /></SplideSlide>
            <SplideSlide><GodParents /></SplideSlide>
            <SplideSlide><Ceremony /></SplideSlide>
            <SplideSlide><Reception /></SplideSlide>
            <SplideSlide><Gifts /></SplideSlide>
          </Splide>
          <AudioControl />
          {/* Bats layer composited behind the slider */}
          <motion.div
            className="bg-[url('/img/festejos/jannia/bats-background.png')] bg-cover bg-bottom absolute inset-0 z-0"
            variants={animation05}
            initial="hidden"
            whileInView="visible"
          />
        </motion.div>
      )}
    </div>
  );
}
Themed celebration invitations use theme-specific asset filenames that signal their visual concept at a glance. For example, the jannia Halloween invitation uses a bats-background.png layer composited via absolute positioning behind the Splide slider, while a Snow White fairy-tale invitation loads character illustration assets. Store these in public/img/festejos/[name]/ alongside other per-invitation assets, keeping each invitation’s resources self-contained and easy to locate.
The jannia invitation’s styles.css loads three custom typefaces via @font-face: adelia (from adelia.ttf), verve (from Machinery.otf), and rumble (from Rumble.otf). These are referenced directly in component style props as fontFamily: "verve" or fontFamily: "rumble" to achieve the gothic party aesthetic without relying on Google Fonts.

Build docs developers (and LLMs) love