Readying for design
This commit is contained in:
parent
d73256ca2b
commit
fadf473dde
50 changed files with 1478 additions and 1259 deletions
|
|
@ -1,17 +1,17 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="bg-elevated border-b">
|
||||
<div class="bg-guild-900 border-b border-guild-700">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="py-6">
|
||||
<div class="flex items-center gap-4 mb-2">
|
||||
<NuxtLink to="/admin/events" class="text-dimmed hover:text-default">
|
||||
<NuxtLink to="/admin/events" class="text-guild-500 hover:text-guild-100">
|
||||
<Icon name="heroicons:arrow-left" class="w-5 h-5" />
|
||||
</NuxtLink>
|
||||
<h1 class="text-2xl font-bold text-highlighted">
|
||||
<h1 class="text-display font-bold text-guild-100">
|
||||
{{ editingEvent ? "Edit Event" : "Create New Event" }}
|
||||
</h1>
|
||||
</div>
|
||||
<p class="text-muted">
|
||||
<p class="text-guild-400">
|
||||
Fill out the form below to create or update an event
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -22,18 +22,18 @@
|
|||
<!-- Error Summary -->
|
||||
<div
|
||||
v-if="formErrors.length > 0"
|
||||
class="mb-6 p-4 bg-red-50 border border-red-200 rounded-lg"
|
||||
class="mb-6 p-4 bg-ember-900/20 border border-ember-800 rounded-lg"
|
||||
>
|
||||
<div class="flex">
|
||||
<Icon
|
||||
name="heroicons:exclamation-circle"
|
||||
class="w-5 h-5 text-red-500 mr-3 mt-0.5"
|
||||
class="w-5 h-5 text-ember-400 mr-3 mt-0.5"
|
||||
/>
|
||||
<div>
|
||||
<h3 class="text-sm font-medium text-red-800 mb-2">
|
||||
<h3 class="text-sm font-medium text-ember-400 mb-2">
|
||||
Please fix the following errors:
|
||||
</h3>
|
||||
<ul class="text-sm text-red-700 space-y-1">
|
||||
<ul class="text-sm text-ember-400 space-y-1">
|
||||
<li v-for="error in formErrors" :key="error">• {{ error }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -43,15 +43,15 @@
|
|||
<!-- Success Message -->
|
||||
<div
|
||||
v-if="showSuccessMessage"
|
||||
class="mb-6 p-4 bg-green-50 border border-green-200 rounded-lg"
|
||||
class="mb-6 p-4 bg-candlelight-900/20 border border-candlelight-800 rounded-lg"
|
||||
>
|
||||
<div class="flex">
|
||||
<Icon
|
||||
name="heroicons:check-circle"
|
||||
class="w-5 h-5 text-green-500 mr-3 mt-0.5"
|
||||
class="w-5 h-5 text-candlelight-400 mr-3 mt-0.5"
|
||||
/>
|
||||
<div>
|
||||
<h3 class="text-sm font-medium text-green-800">
|
||||
<h3 class="text-sm font-medium text-candlelight-400">
|
||||
{{
|
||||
editingEvent
|
||||
? "Event updated successfully!"
|
||||
|
|
@ -65,14 +65,14 @@
|
|||
<form @submit.prevent="saveEvent">
|
||||
<!-- Basic Information -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Basic Information
|
||||
</h2>
|
||||
|
||||
<div class="grid grid-cols-1 gap-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Event Title <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Event Title <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<UInput
|
||||
v-model="eventForm.title"
|
||||
|
|
@ -81,25 +81,25 @@
|
|||
:color="fieldErrors.title ? 'error' : undefined"
|
||||
class="w-full"
|
||||
/>
|
||||
<p v-if="fieldErrors.title" class="mt-1 text-sm text-red-600">
|
||||
<p v-if="fieldErrors.title" class="mt-1 text-sm text-ember-400">
|
||||
{{ fieldErrors.title }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Feature Image</label
|
||||
>
|
||||
<ImageUpload v-model="eventForm.featureImage" />
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
Upload a high-quality image (1200x630px recommended) to
|
||||
represent your event
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Event Description <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Event Description <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<UTextarea
|
||||
v-model="eventForm.description"
|
||||
|
|
@ -111,17 +111,17 @@
|
|||
/>
|
||||
<p
|
||||
v-if="fieldErrors.description"
|
||||
class="mt-1 text-sm text-red-600"
|
||||
class="mt-1 text-sm text-ember-400"
|
||||
>
|
||||
{{ fieldErrors.description }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
This will be displayed on the event listing and detail pages
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Additional Content</label
|
||||
>
|
||||
<UTextarea
|
||||
|
|
@ -130,7 +130,7 @@
|
|||
:rows="6"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
Optional: Provide additional context, agenda items, or detailed
|
||||
requirements
|
||||
</p>
|
||||
|
|
@ -140,14 +140,14 @@
|
|||
|
||||
<!-- Event Details -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Event Details
|
||||
</h2>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Event Type <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Event Type <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<USelect
|
||||
v-model="eventForm.eventType"
|
||||
|
|
@ -159,14 +159,14 @@
|
|||
]"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
Choose the category that best describes your event
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Location <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Location <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<UInput
|
||||
v-model="eventForm.location"
|
||||
|
|
@ -175,50 +175,50 @@
|
|||
:color="fieldErrors.location ? 'error' : undefined"
|
||||
class="w-full"
|
||||
/>
|
||||
<p v-if="fieldErrors.location" class="mt-1 text-sm text-red-600">
|
||||
<p v-if="fieldErrors.location" class="mt-1 text-sm text-ember-400">
|
||||
{{ fieldErrors.location }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
Enter a video conference link or Slack channel (starting with #)
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Start Date & Time <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Start Date & Time <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<NaturalDateInput
|
||||
v-model="eventForm.startDate"
|
||||
placeholder="e.g., 'tomorrow at 3pm', 'next Friday at 9am'"
|
||||
:required="true"
|
||||
:input-class="{
|
||||
'border-red-300 focus:ring-red-500': fieldErrors.startDate,
|
||||
'border-ember-700 focus:ring-ember-500': fieldErrors.startDate,
|
||||
}"
|
||||
/>
|
||||
<p v-if="fieldErrors.startDate" class="mt-1 text-sm text-red-600">
|
||||
<p v-if="fieldErrors.startDate" class="mt-1 text-sm text-ember-400">
|
||||
{{ fieldErrors.startDate }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
End Date & Time <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
End Date & Time <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<NaturalDateInput
|
||||
v-model="eventForm.endDate"
|
||||
placeholder="e.g., 'tomorrow at 5pm', 'next Friday at 11am'"
|
||||
:required="true"
|
||||
:input-class="{
|
||||
'border-red-300 focus:ring-red-500': fieldErrors.endDate,
|
||||
'border-ember-700 focus:ring-ember-500': fieldErrors.endDate,
|
||||
}"
|
||||
/>
|
||||
<p v-if="fieldErrors.endDate" class="mt-1 text-sm text-red-600">
|
||||
<p v-if="fieldErrors.endDate" class="mt-1 text-sm text-ember-400">
|
||||
{{ fieldErrors.endDate }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Max Attendees</label
|
||||
>
|
||||
<UInput
|
||||
|
|
@ -228,20 +228,20 @@
|
|||
placeholder="Leave blank for unlimited"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
Set a maximum number of attendees (optional)
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Registration Deadline</label
|
||||
>
|
||||
<NaturalDateInput
|
||||
v-model="eventForm.registrationDeadline"
|
||||
placeholder="e.g., 'tomorrow at noon', '1 hour before event'"
|
||||
/>
|
||||
<p class="mt-1 text-sm text-dimmed">
|
||||
<p class="mt-1 text-sm text-guild-500">
|
||||
When should registration close? (optional)
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -250,12 +250,12 @@
|
|||
|
||||
<!-- Target Audience -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Target Audience
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-3"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-3"
|
||||
>Target Circles</label
|
||||
>
|
||||
<div class="space-y-3">
|
||||
|
|
@ -264,13 +264,13 @@
|
|||
v-model="eventForm.targetCircles"
|
||||
value="community"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Community Circle</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
New members and those exploring the community
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -280,13 +280,13 @@
|
|||
v-model="eventForm.targetCircles"
|
||||
value="founder"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Founder Circle</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Entrepreneurs and business leaders
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -296,19 +296,19 @@
|
|||
v-model="eventForm.targetCircles"
|
||||
value="practitioner"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Practitioner Circle</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Experts and professionals sharing knowledge
|
||||
</p>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<p class="mt-2 text-sm text-dimmed">
|
||||
<p class="mt-2 text-sm text-guild-500">
|
||||
Select which circles this event is most relevant for (leave blank
|
||||
for all circles)
|
||||
</p>
|
||||
|
|
@ -317,20 +317,20 @@
|
|||
|
||||
<!-- Ticketing -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">Ticketing</h2>
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">Ticketing</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<label class="flex items-start">
|
||||
<input
|
||||
v-model="eventForm.tickets.enabled"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Enable Ticketing</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Allow ticket sales for this event
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -338,19 +338,19 @@
|
|||
|
||||
<div
|
||||
v-if="eventForm.tickets.enabled"
|
||||
class="ml-6 space-y-4 p-4 bg-muted rounded-lg"
|
||||
class="ml-6 space-y-4 p-4 bg-guild-950 rounded-lg"
|
||||
>
|
||||
<label class="flex items-start">
|
||||
<input
|
||||
v-model="eventForm.tickets.public.available"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Public Tickets Available</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Allow non-members to purchase tickets
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -359,7 +359,7 @@
|
|||
<div v-if="eventForm.tickets.public.available" class="space-y-4">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Ticket Name</label
|
||||
>
|
||||
<UInput
|
||||
|
|
@ -370,7 +370,7 @@
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Price (CAD)</label
|
||||
>
|
||||
<UInput
|
||||
|
|
@ -381,14 +381,14 @@
|
|||
placeholder="0.00"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="mt-1 text-xs text-dimmed">
|
||||
<p class="mt-1 text-xs text-guild-500">
|
||||
Set to 0 for free public events
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Ticket Description</label
|
||||
>
|
||||
<UTextarea
|
||||
|
|
@ -401,7 +401,7 @@
|
|||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Quantity Available</label
|
||||
>
|
||||
<UInput
|
||||
|
|
@ -414,7 +414,7 @@
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Early Bird Price (Optional)</label
|
||||
>
|
||||
<UInput
|
||||
|
|
@ -429,7 +429,7 @@
|
|||
</div>
|
||||
|
||||
<div v-if="eventForm.tickets.public.earlyBirdPrice > 0">
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Early Bird Deadline</label
|
||||
>
|
||||
<div class="md:w-1/2">
|
||||
|
|
@ -438,15 +438,15 @@
|
|||
placeholder="e.g., '1 week before event', 'next Monday'"
|
||||
/>
|
||||
</div>
|
||||
<p class="mt-1 text-xs text-dimmed">
|
||||
<p class="mt-1 text-xs text-guild-500">
|
||||
Price increases to regular price after this date
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-3 bg-blue-50 rounded-lg">
|
||||
<p class="text-sm text-blue-700">
|
||||
<div class="p-3 bg-candlelight-900/20 rounded-lg">
|
||||
<p class="text-sm text-candlelight-400">
|
||||
<strong>Note:</strong> Members always get free access to all
|
||||
events regardless of ticket settings.
|
||||
</p>
|
||||
|
|
@ -456,7 +456,7 @@
|
|||
|
||||
<!-- Series Management -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Series Management
|
||||
</h2>
|
||||
|
||||
|
|
@ -465,13 +465,13 @@
|
|||
<input
|
||||
v-model="eventForm.series.isSeriesEvent"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-purple-600 focus:ring-purple-500 mt-1"
|
||||
class="rounded border-guild-700 text-earth-500 focus:ring-earth-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Part of Event Series</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
This event is part of a multi-event series
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -479,11 +479,11 @@
|
|||
|
||||
<div
|
||||
v-if="eventForm.series.isSeriesEvent"
|
||||
class="ml-6 space-y-4 p-4 bg-purple-500/10 rounded-lg border border-purple-500/20"
|
||||
class="ml-6 space-y-4 p-4 bg-earth-900/20 rounded-lg border border-earth-800"
|
||||
>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Select Series <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Select Series <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<USelect
|
||||
|
|
@ -501,12 +501,12 @@
|
|||
/>
|
||||
<NuxtLink
|
||||
to="/admin/series/create"
|
||||
class="px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 text-sm font-medium whitespace-nowrap"
|
||||
class="px-4 py-2 bg-earth-600 text-white rounded-lg hover:bg-earth-700 text-sm font-medium whitespace-nowrap"
|
||||
>
|
||||
New Series
|
||||
</NuxtLink>
|
||||
</div>
|
||||
<p class="text-xs text-dimmed mt-1">
|
||||
<p class="text-xs text-guild-500 mt-1">
|
||||
Select an existing series or create a new one
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -516,18 +516,18 @@
|
|||
class="space-y-4"
|
||||
>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Series Title <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Series Title <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<UInput
|
||||
v-model="eventForm.series.title"
|
||||
placeholder="e.g., Cooperative Game Development Fundamentals"
|
||||
required
|
||||
:readonly="selectedSeriesId"
|
||||
:class="{ 'bg-accented': selectedSeriesId }"
|
||||
:class="{ 'bg-guild-800': selectedSeriesId }"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="text-xs text-dimmed mt-1">
|
||||
<p class="text-xs text-guild-500 mt-1">
|
||||
{{
|
||||
selectedSeriesId
|
||||
? "From selected series"
|
||||
|
|
@ -537,8 +537,8 @@
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-default mb-2">
|
||||
Series Description <span class="text-red-500">*</span>
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2">
|
||||
Series Description <span class="text-ember-400">*</span>
|
||||
</label>
|
||||
<UTextarea
|
||||
v-model="eventForm.series.description"
|
||||
|
|
@ -546,10 +546,10 @@
|
|||
required
|
||||
:rows="3"
|
||||
:readonly="selectedSeriesId"
|
||||
:class="{ 'bg-accented': selectedSeriesId }"
|
||||
:class="{ 'bg-guild-800': selectedSeriesId }"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="text-xs text-dimmed mt-1">
|
||||
<p class="text-xs text-guild-500 mt-1">
|
||||
{{
|
||||
selectedSeriesId
|
||||
? "From selected series"
|
||||
|
|
@ -560,9 +560,9 @@
|
|||
|
||||
<div
|
||||
v-if="selectedSeriesId"
|
||||
class="p-3 bg-blue-500/10 rounded-lg border border-blue-500/20"
|
||||
class="p-3 bg-candlelight-900/20 rounded-lg border border-candlelight-800"
|
||||
>
|
||||
<p class="text-sm text-blue-600 dark:text-blue-400">
|
||||
<p class="text-sm text-candlelight-400">
|
||||
<strong>Note:</strong> This event will be added to the
|
||||
existing "{{ eventForm.series.title }}" series.
|
||||
</p>
|
||||
|
|
@ -574,7 +574,7 @@
|
|||
|
||||
<!-- Event Agenda -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Event Agenda
|
||||
</h2>
|
||||
|
||||
|
|
@ -592,7 +592,7 @@
|
|||
<button
|
||||
type="button"
|
||||
@click="removeAgendaItem(index)"
|
||||
class="px-3 py-2 text-red-600 hover:bg-red-50 rounded-lg transition-colors"
|
||||
class="px-3 py-2 text-ember-400 hover:bg-ember-900/20 rounded-lg transition-colors"
|
||||
>
|
||||
<Icon name="heroicons:trash" class="w-5 h-5" />
|
||||
</button>
|
||||
|
|
@ -601,14 +601,14 @@
|
|||
<button
|
||||
type="button"
|
||||
@click="addAgendaItem"
|
||||
class="flex items-center gap-2 px-4 py-2 text-blue-600 hover:bg-blue-50 rounded-lg transition-colors font-medium"
|
||||
class="flex items-center gap-2 px-4 py-2 text-candlelight-400 hover:bg-candlelight-900/20 rounded-lg transition-colors font-medium"
|
||||
>
|
||||
<Icon name="heroicons:plus" class="w-5 h-5" />
|
||||
Add Agenda Item
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="mt-2 text-sm text-dimmed">
|
||||
<p class="mt-2 text-sm text-guild-500">
|
||||
Add agenda items to help attendees know what to expect during the
|
||||
event
|
||||
</p>
|
||||
|
|
@ -616,7 +616,7 @@
|
|||
|
||||
<!-- Event Settings -->
|
||||
<div class="mb-8">
|
||||
<h2 class="text-lg font-semibold text-highlighted mb-4">
|
||||
<h2 class="text-lg font-semibold text-guild-100 mb-4">
|
||||
Event Settings
|
||||
</h2>
|
||||
|
||||
|
|
@ -626,13 +626,13 @@
|
|||
<input
|
||||
v-model="eventForm.isOnline"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Online Event</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Event will be conducted virtually
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -642,13 +642,13 @@
|
|||
<input
|
||||
v-model="eventForm.registrationRequired"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Registration Required</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Attendees must register before attending
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -660,13 +660,13 @@
|
|||
<input
|
||||
v-model="eventForm.isVisible"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-blue-600 focus:ring-blue-500 mt-1"
|
||||
class="rounded border-guild-700 text-candlelight-500 focus:ring-candlelight-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Visible on Public Calendar</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Event will appear on the public events page
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -676,13 +676,13 @@
|
|||
<input
|
||||
v-model="eventForm.isCancelled"
|
||||
type="checkbox"
|
||||
class="rounded border-default text-red-600 focus:ring-red-500 mt-1"
|
||||
class="rounded border-guild-700 text-ember-500 focus:ring-ember-500 mt-1"
|
||||
/>
|
||||
<div class="ml-3">
|
||||
<span class="text-sm font-medium text-default"
|
||||
<span class="text-sm font-medium text-guild-100"
|
||||
>Event Cancelled</span
|
||||
>
|
||||
<p class="text-xs text-dimmed">
|
||||
<p class="text-xs text-guild-500">
|
||||
Mark this event as cancelled
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -693,7 +693,7 @@
|
|||
|
||||
<!-- Cancellation Message (conditional) -->
|
||||
<div v-if="eventForm.isCancelled" class="mb-8">
|
||||
<label class="block text-sm font-medium text-default mb-2"
|
||||
<label class="block text-sm font-medium text-guild-100 mb-2"
|
||||
>Cancellation Message</label
|
||||
>
|
||||
<UTextarea
|
||||
|
|
@ -703,18 +703,18 @@
|
|||
color="error"
|
||||
class="w-full"
|
||||
/>
|
||||
<p class="text-xs text-dimmed mt-1">
|
||||
<p class="text-xs text-guild-500 mt-1">
|
||||
This message will be displayed to users viewing the event page
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Form Actions -->
|
||||
<div
|
||||
class="flex justify-between items-center pt-6 border-t border-default"
|
||||
class="flex justify-between items-center pt-6 border-t border-guild-700"
|
||||
>
|
||||
<NuxtLink
|
||||
to="/admin/events"
|
||||
class="px-4 py-2 text-muted hover:text-highlighted font-medium"
|
||||
class="px-4 py-2 text-guild-400 hover:text-guild-100 font-medium"
|
||||
>
|
||||
Cancel
|
||||
</NuxtLink>
|
||||
|
|
@ -725,7 +725,7 @@
|
|||
type="button"
|
||||
@click="saveAndCreateAnother"
|
||||
:disabled="creating"
|
||||
class="px-4 py-2 bg-gray-600 text-white rounded-lg hover:bg-gray-700 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
|
||||
class="px-4 py-2 bg-guild-600 text-white rounded-lg hover:bg-guild-700 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
|
||||
>
|
||||
{{ creating ? "Saving..." : "Save & Create Another" }}
|
||||
</button>
|
||||
|
|
@ -733,7 +733,7 @@
|
|||
<button
|
||||
type="submit"
|
||||
:disabled="creating"
|
||||
class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
|
||||
class="px-6 py-2 bg-candlelight-600 text-white rounded-lg hover:bg-candlelight-700 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
|
||||
>
|
||||
{{
|
||||
creating
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue