Skip to content

Samples by Class: sp-card-*

The sp-card-* classes are intended to be used in gallery views (but are available for other formats as well). Unlike most of the other classes, some of these only apply styles when nested together.

Samples are grouped by classes used. Expand to see the related samples.

1 sample 

sp-card-boldText

11 samples

sp-card-borderHighlight

0 samples

sp-card-bottomCommandBar

10 samples

sp-card-container

4 samples

sp-card-container-noPadding

7 samples

sp-card-content

6 samples

sp-card-defaultClickButton

2 samples

sp-card-defaultImage

2 samples

sp-card-defaultImageOverlay

6 samples

sp-card-displayColumnContainer

1 sample 

sp-card-emptyFillStar

1 sample 

sp-card-formatterRef

1 sample 

sp-card-halfFillStar

0 samples

sp-card-heartIcon

6 samples

sp-card-highlightedContent

4 samples

sp-card-imageContainer

0 samples

sp-card-imageContainer-shortened

2 samples

sp-card-imagePreview

0 samples

sp-card-imagePreview-stretched

3 samples

sp-card-imagePreviewBackground

0 samples

sp-card-imagePreviewBackground-shortened

4 samples

sp-card-keyboard-focusable

3 samples

sp-card-label

4 samples

sp-card-lastTextColumnContainer

0 samples

sp-card-likes

0 samples

sp-card-lookupInlineValues

1 sample 

sp-card-multiline

4 samples

sp-card-personCallout

4 samples

sp-card-previewColumnContainer

1 sample 

sp-card-ratingCount

0 samples

sp-card-showOnHover

0 samples

sp-card-showOnHoverChild

0 samples

sp-card-showOnHoverParent

1 sample 

sp-card-starRating

11 samples

sp-card-subContainer

3 samples

sp-card-subContainer-borderRadius

1 sample 

sp-card-urlContent

4 samples

sp-card-userContainer

0 samples

sp-card-userContent

4 samples

sp-card-userCustomCard

2 samples

sp-card-userEmptyText

4 samples

sp-card-userOthers

5 samples

sp-card-userThumbnail

2 samples

sp-card-userTitle