-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathproducts.html
132 lines (112 loc) · 6.15 KB
/
products.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
---
layout: default
cards:
- heading: Small heading
description: Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae alias culpa fugit ex numquam aliquam non atque et, rem unde dolorum mollitia illo soluta hic, possimus, itaque adipisci id minima.
feature_image: /images/the-sleep-co-bed.jpg
- heading: Small heading
description: Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae alias culpa fugit ex numquam aliquam non atque et, rem unde dolorum mollitia illo soluta hic, possimus, itaque adipisci id minima.
feature_image: /images/the-sleep-co-lamp.jpg
- heading: Small heading
description: Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae alias culpa fugit ex numquam aliquam non atque et, rem unde dolorum mollitia illo soluta hic, possimus, itaque adipisci id minima.
feature_image: /images/the-sleep-co-pillow.jpg
---
<!--------------------------------- header banner------------------------------------------------->
<header class="padded-t-0 padded grid tall-60">
{% include header-nav.html %}
<div class="col-12-middle text-center">
<h3 class="font-weight-extra-bold editable">
<span class="featured-text"> addictively </span> soft
</h3>
<h1 class="font-weight-normal editable"> you won't want to get out of bed </h1>
</div>
</header>
<!---------------------------------------- text icon grid -------------------------------->
<section class="padded grid bg-featured">
<div class="padded-sm col-12 text-center">
<h2> <span class="white-text editable">features</span> you will love </h2>
</div>
<div class="padded-sm col-3_sm-6 xxs-stack editbale">
<h4> little heading </h4>
<p class="editable"> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maxime dolor nulla inventore?
Quas necessitatibus, quis voluptatibus architecto fugit consequuntur expedita esse dolorem ab minima,
deleniti, placeat tempore incidunt cum modi.</p>
</div>
<div class="padded-sm col-3_sm-6 xxs-stack editbale">
<h4> little heading </h4>
<p> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maxime dolor nulla inventore? Quas
necessitatibus, quis voluptatibus architecto fugit consequuntur expedita esse dolorem ab minima,
deleniti, placeat tempore incidunt cum modi.</p>
</div>
<div class="padded-sm col-3_sm-6 xxs-stack edtable">
<h4> little heading </h4>
<p> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maxime dolor nulla inventore? Quas
necessitatibus, quis voluptatibus architecto fugit consequuntur expedita esse dolorem ab minima,
deleniti, placeat tempore incidunt cum modi.</p>
</div>
<div class="padded-sm col-3_sm-6 xxs-stack editable">
<h4> little heading </h4>
<p> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maxime dolor nulla inventore? Quas
necessitatibus, quis voluptatibus architecto fugit consequuntur expedita esse dolorem ab minima,
deleniti, placeat tempore incidunt cum modi.</p>
</div>
</section>
<!-- cards -->
<section class="grid padded">
{% for item in page.cards %}
<div class="col-4_xs-12">
<div class="card padded-sm">
<div class="bg-image portrait" style="background-image: url('{{item.feature_image}}')"> </div>
<div class="padded-1">
<h4> {{item.heading}} </h4>
<p> {{item.description}}</p>
</div>
</div>
</div>
{% endfor %}
</section>
<!---------------------------------------------image banner -------------------------------------------->
<section class="padded text-center tall-70 grid bg-dark">
<div class="col-12-middle">
<h3 class="big-text editable">
<span class="small-text font-weight-normal">spend over $150 and activte</span>
<br /><span class="featured-text"> free </span> express shipping
</h3>
</div>
</section>
<!------------------------------features section --------------------------------------------->
<section class="grid">
<div class="padded col-6_sm-12-middle">
<h2> bult to last a <span class="featured-text">lifetime</span></h2>
<p> Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis consectetur expedita ullam maxime
sunt ipsam eum eligendi amet, officiis quam nam suscipit facilis officia praesentium repellendus vitae
fugit non accusantium?</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Similique fuga facilis nam. Ut perferendis
similique cupiditate ab molestiae facilis modi sapiente, laborum velit, quibusdam impedit nulla tempore!
Adipisci, ratione necessitatibus.</p>
</div>
<div class="bg-image bg-bed col-6 tall-70 hide-sm">
<!-- back ground image bed -->
</div>
<div class="bg-image bg-pug col-6_sm-12 tall-70">
<!-- back ground image pug -->
</div>
<div class="padded col-6_sm-12-middle editable">
<h2> so <span class="featured-text">soft</span> you'll melt </h2>
<p> Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis consectetur expedita ullam maxime
sunt ipsam eum eligendi amet, officiis quam nam suscipit facilis officia praesentium repellendus vitae
fugit non accusantium?</p>
</div>
<div class="padded col-6_sm-12-middle">
<h2> bult to last a <span class="featured-text">lifetime</span></h2>
<p> Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis consectetur expedita ullam maxime
sunt ipsam eum eligendi amet, officiis quam nam suscipit facilis officia praesentium repellendus vitae
fugit non accusantium?</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Similique fuga facilis nam. Ut perferendis
similique cupiditate ab molestiae facilis modi sapiente, laborum velit, quibusdam impedit nulla tempore!
Adipisci, ratione necessitatibus.</p>
</div>
<div class="bg-image bg-bed col-6_sm-12 tall-70">
<!-- back ground image bed -->
</div>
</section>