| section | Extensions | |
|---|---|---|
| subsection | Component groups | |
| id | Service card | |
| source | react | |
| propComponents |
|
|
| sourceLink | https://github.com/patternfly/react-component-groups/blob/main/packages/module/patternfly-docs/content/extensions/component-groups/examples/ServiceCard/ServiceCard.md |
import ServiceCard from "@patternfly/react-component-groups/dist/dynamic/ServiceCard"; import { EllipsisVIcon } from '@patternfly/react-icons'; import pageHeaderIcon from '../../assets/icons/page-header-icon.svg' import { FunctionComponent } from 'react'
The service card component displays a card representing a service with an icon, title, description, and an optional customized footer
This shows a basic service card with an icon, title, description, and optional footer passed in. You can also pass all props of the card component.
If you set isStacked property to true, the header layout changes to stacked.
This shows how cards can look side by side in a gallery layout. If you set isFullHeight property to true, the card height will fill the available space.