docs(Banner): update for black friday

This commit is contained in:
Benjamin Canac
2024-11-25 12:26:31 +01:00
parent 637ec4d27b
commit bf8e3954a4

View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
const id = 'nuxt-ui-banner-2' const id = 'nuxt-ui-banner-3'
const to = 'https://ui3.nuxt.dev' const to = '/pro/pricing'
const hideBanner = () => { const hideBanner = () => {
localStorage.setItem(id, 'true') localStorage.setItem(id, 'true')
@@ -28,9 +28,8 @@ if (import.meta.server) {
<NuxtLink <NuxtLink
v-if="to" v-if="to"
:to="to" :to="to"
target="_blank"
class="focus:outline-none" class="focus:outline-none"
aria-label="Nuxt UI v3-alpha has been released!" aria-label="20% off on all Nuxt UI Pro products for Black Friday week"
tabindex="-1" tabindex="-1"
> >
<span class="absolute inset-0 " aria-hidden="true" /> <span class="absolute inset-0 " aria-hidden="true" />
@@ -40,19 +39,19 @@ if (import.meta.server) {
<div class="lg:flex-1 hidden lg:flex items-center" /> <div class="lg:flex-1 hidden lg:flex items-center" />
<p class="text-sm font-medium text-white dark:text-gray-900 truncate"> <p class="text-sm font-medium text-white dark:text-gray-900 truncate">
<UIcon name="i-heroicons-rocket-launch" class="w-5 h-5 align-top flex-shrink-0 pointer-events-none mr-2" /> <UIcon name="i-ri-discount-percent-fill" class="size-5 align-top flex-shrink-0 pointer-events-none mr-2" />
<span class="font-semibold">Nuxt UI v3-alpha</span> has been released! <span class="font-bold">Black Friday Week</span>: <UBadge label="20% off" color="white" class="ring-0 font-semibold" /> on all Nuxt UI Pro products from <span class="font-semibold">Nov 25</span> to <span class="font-semibold">Dec 2</span>!
</p> </p>
<UButton <!-- <UButton
:to="to" :to="to"
target="_blank" target="_blank"
label="Try it out" label="Buy now"
color="black" color="black"
variant="solid" variant="solid"
size="2xs" size="2xs"
trailing-icon="i-heroicons-arrow-right-20-solid" trailing-icon="i-heroicons-arrow-right-20-solid"
/> /> -->
<div class="flex items-center justify-end lg:flex-1"> <div class="flex items-center justify-end lg:flex-1">
<button <button