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¶
- Content Navigator
- Disable default click action on a tile list view
- Elf Progress Board
- Flashcards
- photo-gallery-with-likes
- Picture Quick Links
- Prompt Cards
- Rating in Tiles
- Reorder and Expand Board Items
- Travel Tweets Board
- Whiteboard sticky notes
0 samples
sp-card-bottomCommandBar¶
10 samples
sp-card-container¶
- Board Tags
- Content Navigator
- Disable default click action on a tile list view
- Elf Progress Board
- photo-gallery-with-likes
- Picture Quick Links
- Prompt Cards
- Rating in Tiles
- Reorder and Expand Board Items
- Travel Tweets Board
4 samples
sp-card-container-noPadding¶
7 samples
sp-card-content¶
- Content Navigator
- Disable default click action on a tile list view
- Flashcards
- Prompt Cards
- Rating in Tiles
- Reorder and Expand Board Items
- Whiteboard sticky notes
6 samples
sp-card-defaultClickButton¶
- Content Navigator
- Disable default click action on a tile list view
- photo-gallery-with-likes
- Picture Quick Links
- Prompt Cards
- Rating in Tiles
2 samples
sp-card-defaultImage¶
2 samples
sp-card-defaultImageOverlay¶
6 samples
sp-card-displayColumnContainer¶
- Elf Progress Board
- Flashcards
- Prompt Cards
- Rating in Tiles
- Reorder and Expand Board Items
- Whiteboard sticky notes
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¶
- Content Navigator
- Disable default click action on a tile list view
- Flashcards
- Rating in Tiles
- Reorder and Expand Board Items
- Whiteboard sticky notes
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¶
- Content Navigator
- Disable default click action on a tile list view
- Glossary View Formatters
- photo-gallery-with-likes
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¶
- Content Navigator
- Disable default click action on a tile list view
- Elf Progress Board
- Flashcards
- photo-gallery-with-likes
- Picture Quick Links
- Prompt Cards
- Rating in Tiles
- Reorder and Expand Board Items
- Travel Tweets Board
- Whiteboard sticky notes
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