Styles
This page is here to show off styles and components for standard page elements such as typography, form
elements, icons, product cards and more. These are hard coded in an alternate page template file containing
the section
main-styleguide.liquid
.
Colors
Background
Text
text light
Link
Link hover
Border
Info
Success
Warning
Danger
Primary
50
100
200
250
300
400
500
600
700
800
900
Secondary
50
100
200
250
300
400
500
600
700
800
900
Accent
50
100
200
250
300
400
500
600
700
800
900
Gray
Black
5
15
50
Typography
Headings
Headline 1
Headline 2
Headline 3
Headline 4
Headline 5
Headline 6
Paragraphs
Sizes
Text sm
Text base
Text lg
Label
Label sm
Label base
Label lg
Transforms
Normal
Capitalised
Uppercased
Type styles
- Strong
- Emphasis
- Link
Strike- Sup
Rte
Headline 2
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Headline 3
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Headline 4
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Headline 5
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Headline 6
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus dolore beatae molestias voluptas cumque facilis, recusandae omnis, nihil magni culpa tenetur quo aperiam, earum nisi at pariatur impedit voluptates quia!
Eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.
The author of the quote
- One
- Two
-
Three, with child list
- First sub item
- Second sub item
-
Third sub item, with child list
- Third level item
- Another third level item
- Four
- One
- Two
-
Three, with child list
- First sub item
- Second sub item
-
Third sub item, with child list
- Third level item
- Another third level item
- Four
| Order | Date | Payment Status | Fulfillment Status | Total |
|---|---|---|---|---|
| #1001 | December 22, 2015 | Authorized | Unfulfilled | $43.03 |
| #1002 | December 23, 2015 | Authorized | Unfulfilled | $44.03 |
| #1003 | December 24, 2015 | Authorized | Unfulfilled | $45.03 |
| #1004 | December 25, 2015 | Authorized | Unfulfilled | $46.03 |
| #1005 | December 26, 2015 | Authorized | Unfulfilled | $47.03 |
| #1006 | December 27, 2015 | Authorized | Unfulfilled | $48.03 |
Grid
More info on tailwind and css-tricks.
Logo
Icons
User interface icons
USP icons
Payment icons
Social icons
Forms
Options
For variants, filters and sorting
Button style
List style
Quantity input
Collapsibles
Collapsible
Collapsible using button styles
Toggle element
Badges
Prices
- Reguliere prijs
- Vanaf €16,95
- Reguliere prijs
- €6,95
- Sale prijs
- €94,95
- Reguliere prijs
-
€173,35
- Sale prijs
- €29,95
- Reguliere prijs
-
€41,80
- Sale prijs
- €59,95
- Reguliere prijs
-
€109,05
- Reguliere prijs
- Vanaf €19,95
- Reguliere prijs
- €8,95
- Reguliere prijs
- €8,95
Collection cards
-
Aaltjes
-
Alle Heroes
-
Alle producten
-
Alle producten om dieren te beschermen
-
Alle producten om plagen te voorkomen
-
Alle producten tegen bladluis
-
Alle producten tegen bloedluis
-
Alle producten tegen de buxusmot
-
Alle producten tegen de slangenmijt
-
Alle producten tegen dopluis
-
Alle producten tegen emelten
-
Alle producten tegen engerlingen
-
Alle producten tegen fruitvliegjes
-
Alle producten tegen kledingmotten
-
Alle producten tegen meelmotten
-
Alle producten tegen rouwvliegjes
-
Alle producten tegen slakken
-
Alle producten tegen spint
-
Alle producten tegen taxuskevers
-
Alle producten tegen trips
-
Alle producten tegen vijgenskeletteermot
-
Alle producten tegen vliegen
-
Alle producten tegen wespen
-
Alle producten tegen witte vlieg
-
Alle producten tegen wolluis
-
Alle producten voor de tuin
-
Alle producten voor kamerplanten
-
Alle producten voor planten
-
Bestrijdingspakketten
-
Cadeaus
-
Gaasvlieglarven
-
Home page
-
Hulpmiddelen
-
Lieveheersbeestjes
-
Nieuwe producten
-
Populaire producten
-
Preventieve pakketten
-
Roofmijten
-
Vallen en vangkaarten
-
Voeding
Product cards
Phora- tegen engerlingen
Effectief bij bodemtemperatuur vanaf 15 °C- Reguliere prijs
- Vanaf €16,95
Protect Jungle Deal - voorkom plagen
Compleet preventief pakket voor 50 (kamer)planten- Sale prijs
- €94,95
- Reguliere prijs
-
€173,35
Protect Leafs Deal - voorkom plagen
Compleet preventief pakket voor 10 (kamer)planten- Sale prijs
- €29,95
- Reguliere prijs
-
€41,80
Protect Plants Deal - voorkom plagen
Compleet preventief pakket voor 30 (kamer)planten- Sale prijs
- €59,95
- Reguliere prijs
-
€109,05
Puncta - tegen bladluis
Lieveheersbeestjeslarven voor bomen, struiken en hagen- Reguliere prijs
- Vanaf €19,95
