Creative Tim  |  Docs

Announcement Card

PRO

The AnnouncementCard component helps you to simply create a beautiful announcement card its helpful when posting a job or other sort of announcements.

The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.

Demo

// Soft UI Dashboard PRO React examples import AnnouncementCard from "examples/Cards/AnnouncementCard";
lucas prila
lucas prila2h ago
recommendation
I need a Ruby developer for my new website.
The website was initially built in PHP, I need a professional ruby programmer to shift it.

$3,000/ month

Props Information

NameTypeDefaultDescription
by{ image: string, name: string, date: string, }{}Used to set a who post the announcement.
badge{ color: ["primary", "secondary", "info", "success", "warning", "error", "dark"], label: string, }{}Used to set the badge color and content for the AnnouncementCard.
title*stringUsed to set the AnnouncementCard title. Its a required prop.
description*stringUsed to set the AnnouncementCard description. Its a required prop.
value{ type: string, amount: string, method: string, }{}Used to set the payment info for the AnnouncementCard.
action*{ type: ["enternal", "internal"], route: string, label: string, }Used to set the AnnouncementCard action button configuration. Its a required prop.
Contents