דילוג לתוכן

אקורדיונים · ארט דקו

שאלות נפוצות בסגנון ארט דקו

אקורדיון באמרלד וזהב עם פינות מדורגות ומניפת קרניים שנפתחת מאחורי כל תשובה.

Art Deco FAQ

  • ארט דקו
  • אקורדיון
  • יוקרה

הפרומפט המלא

הצגת הפרומפט שמגדיר את הפריסה, התנועה ושפת העיצוב
Build a "Art Deco FAQ" React component.

CONCEPT: A hotel's FAQ in the style of a 1925 lobby: symmetric gold frame, Poiret One type, and a sunburst fan that opens with each answer.

LAYOUT & CONTENT:
- Title 'Guest Enquiries' centered between two thin double rules.
- Three questions: check-in time, the rooftop bar dress code, airport transfers — with short real answers.
- Each row ends with a gold diamond that rotates into a cross when open.

INTERACTIONS & MOTION:
- Answer panel height auto spring (stiffness 220 damping 28).
- A sunburst (8 thin gold wedges) behind the answer scales from 0 to 1 from the top center, rotate -20 → 0.
- Diamond rotates 45° and turns solid gold when open.

DESIGN SYSTEM — Art Deco:
- Deep emerald #0F3B33 and antique gold #C9A15B with ivory #F3EBD8.
- Symmetry, fan and sunburst motifs, thin double rules, stepped corners.
- Type: Poiret One for display, tracked uppercase labels.

CRAFT RULES:
- Motion: Framer Motion with spring physics (type: "spring"). Animate transform and opacity only. Respect prefers-reduced-motion via useReducedMotion().
- Icons: lucide-react where icons are needed.
- Accessibility: real <button>/<a>/<label> elements, visible focus ring, keyboard operable, aria attributes where state changes.

OUTPUT: one self-contained React component file (Tailwind CSS v4 utility classes, framer-motion, lucide-react), no external images, default export, ready to paste into a Next.js App Router page with "use client". Load any Google Font it needs with next/font/google.

איך משתמשים בפרומפט

  1. 1. מעתיקיםלחיצה על „העתקת הפרומפט” מעתיקה את כל ההנחיות: פריסה, תנועה וכללי עיצוב.
  2. 2. מדביקים ב-Claudeכדאי להוסיף בתחילת הפרומפט את שם העסק, הטקסטים והצבעים שלך.
  3. 3. משלבים באתרמתקבל קובץ React אחד. צריך להתקין את framer-motion ואת lucide-react.

לפי סוג ולפי סגנון