Migrate design system from ethereal/cool to warm/craft/guild theme

Replace ghost/whisper/sparkle color palettes with guild/candlelight/parchment/ember/earth tokens.
Switch typography from NB Television Pro to Quietism serif. Update all 25 Vue components,
layouts, and pages to new design system. Add circle color tokens, typography scale, prose-guild
class, and warm texture effects. Clean up stale documentation files.
This commit is contained in:
Jennie Robinson Faber 2026-02-24 20:01:11 +00:00
parent d588c49946
commit a62e167876
39 changed files with 1300 additions and 2087 deletions

View file

@ -5,7 +5,7 @@
<div
class="animate-spin rounded-full h-8 w-8 border-b-2 border-primary mx-auto mb-4"
></div>
<p class="text-ghost-300">Loading ticket information...</p>
<p class="text-guild-300">Loading ticket information...</p>
</div>
<!-- Error State -->
@ -35,7 +35,7 @@
<strong>{{ ticketInfo.series?.title }}</strong> and requires a series
pass to attend.
</p>
<p class="text-sm text-ghost-300 mb-6">
<p class="text-sm text-guild-300 mb-6">
Purchase a series pass to get access to all events in this series.
</p>
<UButton
@ -70,7 +70,7 @@
details.
</template>
</p>
<p class="text-sm text-ghost-300">
<p class="text-sm text-guild-300">
See you on {{ formatEventDate(eventStartDate) }}!
</p>
</div>
@ -89,7 +89,7 @@
<!-- Registration Form -->
<div v-if="ticketInfo.available && !ticketInfo.alreadyRegistered">
<h3 class="text-xl font-bold text-ghost-100 mb-4">
<h3 class="text-xl font-bold text-guild-100 mb-4">
{{ ticketInfo.isFree ? "Register" : "Purchase Ticket" }}
</h3>
@ -98,7 +98,7 @@
<div>
<label
for="name"
class="block text-sm font-medium text-ghost-200 mb-2"
class="block text-sm font-medium text-guild-200 mb-2"
>
Full Name
</label>
@ -116,7 +116,7 @@
<div>
<label
for="email"
class="block text-sm font-medium text-ghost-200 mb-2"
class="block text-sm font-medium text-guild-200 mb-2"
>
Email Address
</label>
@ -128,7 +128,7 @@
placeholder="Enter your email"
:disabled="processing || isLoggedIn"
/>
<p v-if="isLoggedIn" class="text-xs text-ghost-400 mt-1">
<p v-if="isLoggedIn" class="text-xs text-guild-400 mt-1">
Using your member email
</p>
</div>
@ -185,10 +185,10 @@
>
<Icon
name="heroicons:ticket"
class="w-16 h-16 text-ghost-400 mx-auto mb-4"
class="w-16 h-16 text-guild-400 mx-auto mb-4"
/>
<h3 class="text-xl font-bold text-ghost-100 mb-2">Event Sold Out</h3>
<p class="text-ghost-300 mb-6">
<h3 class="text-xl font-bold text-guild-100 mb-2">Event Sold Out</h3>
<p class="text-guild-300 mb-6">
This event is currently at capacity. Join the waitlist to be notified
if spots become available.
</p>
@ -203,8 +203,8 @@
name="heroicons:x-circle"
class="w-16 h-16 text-red-400 mx-auto mb-4"
/>
<h3 class="text-xl font-bold text-ghost-100 mb-2">Event Sold Out</h3>
<p class="text-ghost-300">
<h3 class="text-xl font-bold text-guild-100 mb-2">Event Sold Out</h3>
<p class="text-guild-300">
Unfortunately, this event is at capacity and no longer accepting
registrations.
</p>