chore/visual-fidelity-fixes #2

Merged
jennie merged 26 commits from chore/visual-fidelity-fixes into main 2026-04-30 12:36:10 +00:00
Showing only changes of commit 1da76b11cb - Show all commits

View file

@ -9,14 +9,11 @@
</div> </div>
<!-- Error State --> <!-- Error State -->
<div <div v-else-if="error" class="error-state p-6">
v-else-if="error" <h3 class="error-state__heading text-lg font-semibold mb-2">
class="p-6 bg-ember-900/20 rounded-xl border border-ember-800"
>
<h3 class="text-lg font-semibold text-ember-300 mb-2">
Unable to Load Series Pass Unable to Load Series Pass
</h3> </h3>
<p class="text-ember-400">{{ error }}</p> <p class="error-state__body">{{ error }}</p>
</div> </div>
<!-- Content --> <!-- Content -->
@ -48,7 +45,7 @@
<!-- Registration Form --> <!-- Registration Form -->
<div <div
v-if="passInfo.available && !passInfo.alreadyRegistered" v-if="passInfo.available && !passInfo.alreadyRegistered"
class="bg-guild-800/50 dark:bg-guild-700/30 rounded-xl border border-guild-600 dark:border-guild-600 p-6" class="registration-form p-6"
> >
<h3 class="text-xl font-bold text-[--ui-text] mb-6"> <h3 class="text-xl font-bold text-[--ui-text] mb-6">
{{ {{
@ -357,3 +354,18 @@ const formatPrice = (price, currency = "CAD") => {
}).format(price); }).format(price);
}; };
</script> </script>
<style scoped>
.error-state {
background: color-mix(in srgb, var(--ember) 8%, transparent);
border: 1px dashed var(--ember);
}
.error-state__heading,
.error-state__body {
color: var(--ember);
}
.registration-form {
background: var(--surface);
border: 1px dashed var(--border);
}
</style>