nebo
Načítání...
Vhodné zakoupit spolu s
This page is here to show off styles for standard page elements such as typography, form elements, and icons. These are hard coded in an alternate page template file containing the section main-page-styles.liquid.
main-page-styles.liquid
Visit this page in the Theme Editor and toggle the Branding shop type to see the primary color change. The current shop type is .
Brand text
Primary
Primary 50%
Primary dark
Secondary
Secondary hover
Gray 50%
Gray Dark
Gray Dark 50%
Gray light
Gray light 50%
Black
Black 20%
White
Positive
Negative
Yellow
Orange
Border
Capitalised
Uppercased
Weight light. 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!
Weight regular. 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!
Weight regular-italic. 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!
Weight bold. 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!
Weight bold-italic. 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!
Weight black. 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!
Default font size is 16px.
12px. 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!
14px. 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!
16px. 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!
18px. 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
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.
ul
ol
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! 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!
More info on griddle, css-tricks and learn-css-grid
Primary anchor Primary button Primary button disabled
Košík Primary anchor Košík Primary button Košík Primary button disabled
Košík Košík Košík
Secondary anchor Secondary button Secondary button disabled
Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur libero ut consequuntur fugiat dignissimos atque id saepe explicabo exercitationem at facilis asperiores, expedita natus autem facere! Neque quia in praesentium.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse finibus mi nec orci fringilla, eu ornare magna rhoncus. Fusce porta risus eget sem placerat, ut tristique dolor ornare. Pellentesque condimentum accumsan metus a auctor. Curabitur est metus, placerat nec pellentesque sed, viverra sit amet quam. Fusce euismod viverra mi eget blandit. Nam vel efficitur ipsum. Cras semper vulputate justo a consectetur. Donec facilisis metus nec risus facilisis congue. Quisque porta varius est, et iaculis dui varius sit amet. Nunc vulputate sit amet turpis vitae placerat. Morbi aliquam suscipit iaculis. Sed hendrerit sit amet ex rhoncus congue.
Small card. Image 80x80 and less spacing between image + text
Default card
Sada nářadí
Na skladě
Startovací sada
Skladem s nízkou skladovou zásobou
Vyprodáno
In the design, this is also referred to as the USP component
10 cols default
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec nisl sem. Suspendisse condimentum hendrerit euismod.
12 cols PLP promo
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec nisl sem. Suspendisse condimentum hendrerit euismod. Nulla porta est id mauris volutpat efficitur.
Autoplay is enabled. This is optional.