42 lines
1.4 KiB
Markdown
42 lines
1.4 KiB
Markdown
---
|
|
sidebar_position: 2
|
|
---
|
|
|
|
# Full Width Center Aligned Link On Gray Background
|
|
|
|

|
|
|
|
```jsx title="Frontend/sections/AnnouncementBanners/FullWidthCenterAlignedLinkOnGrayBackground.tsx"
|
|
<>
|
|
{/* <!-- Announcement Banner --> */}
|
|
<a
|
|
className="group block bg-base-100 hover:bg-base-300 p-4 rounded-lg text-center transition-all duration-300"
|
|
href="#"
|
|
>
|
|
<div className="max-w-[85rem] px-4 sm:px-6 lg:px-8 mx-auto">
|
|
<p className="me-2 inline-block text-sm text-secondary-content">
|
|
Shop for everyone on your list with the FastPocket Guide.
|
|
</p>
|
|
<span className="group-hover:underline decoration-2 inline-flex justify-center items-center gap-x-2 font-semibold text-primary text-sm">
|
|
Shop now
|
|
<svg
|
|
className="flex-shrink-0 w-4"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="m9 18 6-6-6-6" />
|
|
</svg>
|
|
</span>
|
|
</div>
|
|
</a>
|
|
{/* <!-- End Announcement Banner --> */}
|
|
</>
|
|
```
|