Services
cards with a number, the text and a link: three to six services told equally; the merchant’s own only
Install
npx shadcn-vue@latest add @trame/content-services # Vue
npx shadcn@latest add @trame/content-services # React cards
@trame/content-services--cards cards with a number, the text and a link: three to six services told equally; the merchant’s own only
accordion
@trame/content-services--accordion stacked titles that open to the detail, the first open: services that need more words each; the merchant’s own only
icon-list
@trame/content-services--icon-list two columns of compact rows with an arrow: seven services or more, quickly scanned; the merchant’s own only
split-feature
@trame/content-services--split-feature the heading and the picture left, every service as a checklist line in one card right: a short offer shown at once; the merchant’s own only
price-ledger
@trame/content-services--price-ledger one row per service, the words left and its delay and price in aligned columns right: services the merchant quotes, compared at a glance; the merchant’s own only
lead-and-list
@trame/content-services--lead-and-list the main service large on a tinted panel, the others as a numbered list beside it: one flagship service and a few lesser ones; the merchant’s own only
package-cards
@trame/content-services--package-cards equal cards with the points as chips, the words, then the scope as ruled lines aligned across the row (for whom, delay, starting price) and the action: a studio or workshop selling two to four fixed packages, not a subscription; the merchant’s own only
big-type-rows
@trame/content-services--big-type-rows one ruled row per service, the name set at display size on the left and its points as small lines in two columns on the right, the action at the foot: four to six services for an agency or a studio that wants a typographic, confident list; the merchant’s own only