Announcement

use icons::ChevronRight;
use leptos::prelude::*;

use crate::components::extensions::announcement::{Announcement, AnnouncementDescription, AnnouncementLineEffect};

#[component]
pub fn DemoAnnouncement() -> impl IntoView {
    view! {
        <style>
            "@keyframes gradient {
                to { background-position: var(--bg-size) 0; }
            }
            .animate-gradient {
                animation: gradient 8s linear infinite;
            }"
        </style>

        <Announcement>
            <AnnouncementLineEffect />
            "🎉"
            <hr class="mx-2 h-4 bg-gray-300 w-[1px] shrink-0" />
            <AnnouncementDescription>"Introducing new feature"</AnnouncementDescription>
            <ChevronRight class="ml-1 transition-transform duration-300 ease-in-out group-hover:translate-x-0.5 size-3" />
        </Announcement>
    }
}