Cards
Cards description will go here. This is to be updated.
Let's look at how these variations will look at your screen.
Vertical Card
A vertical card is used to represent products in a grid view for quick glance of the product in hand.
Vegan Salad Bowl
Beans | Radish | Couscous | Nuts
English Breakfast
Eggs | Bacon | Muesli | Nuts
Vegan Salad Bowl
Beans | Radish | Couscous | Nuts
Card with Badges
Card with badges are used to distinguish special cards from others.
Ramen
Beans | Radish | Couscous | Nuts
Ramen
Beans | Radish | Couscous | Nuts
Chef's Special
Ramen
Beans | Radish | Couscous | Nuts
Card with Dismiss
Allowing dismissable cards such as recommendations
Ramen
Beans | Radish | Couscous | Nuts
Ramen
Beans | Radish | Couscous | Nuts
Chef's Special
Ramen
Beans | Radish | Couscous | Nuts
Text Only Card
Passing around regular information
Add Ons
Chicken | Cheese | Couscous | Nuts
Dips
Mayo | Tartar | Ketchup | Tandoori
Packing
Add on charges applicable
Add Ons
Chicken | Cheese | Couscous | Nuts
Cards with Shadow
Just add class "shadow-all" on the card
Add Ons
Chicken | Cheese | Couscous | Nuts
Dips
Mayo | Tartar | Ketchup | Tandoori
Packing
Add on charges applicable
Add Ons
Chicken | Cheese | Couscous | Nuts
Horizontal Cards
Horizontal cards convey more information than vertical
Vegan Salad Bowl
Beans | Radish | Couscous | Nuts
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugit, quibusdam. A corporis nostrum mollitia quos temporibus sed necessitatibus eius, ab minus, iusto, officia perspiciatis soluta. Saepe eaque quasi dignissimos commodi.
Vegan Salad Bowl
Beans | Radish | Couscous | Nuts
This is the dexcription of the text here
Card with Overlay Text
Card with overlays are used to provide more information
Chef's Special