SmallHero4
The SmallHero4 React component that renders a responsive section with a heading, caption, optional chip, and an optional image, using Material-UI for styling and layout.
Component path: src/blocks/small-hero/SmallHero4.tsx
Component usage path: src/app/blocks/small-hero/small-hero4/page.tsx
Preview link: https://www.saasable.io/blocks/small-hero/small-hero4
Props Details
chip
{ label: ChipProps['label']; link?: LinkProps; }
(Optional)
Displays a badge or label with optional hyperlink.
{ label: 'Featured', link: { href: '/featured', passHref: true } }
heading
string
The main title or heading of the hero section.
"Discover Our New Collection"
caption
string
A subheading or additional description text below the heading.
"Explore the latest trends in our new arrivals."
exploreBtn
ButtonProps
(Optional)
Configuration for an optional button, which can include properties like href
, onClick
, and children
.
{ href: '/explore', children: 'Explore Now' }
image
ImageCommonProps
Image path or object with light
and dark
image path.
"path-to-image.svg"
or
{ light: 'path-to-image-light.svg', dark: 'path-to-image-dark.svg' }
Last updated