forked from okikio/native
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.pug
223 lines (217 loc) · 14 KB
/
about.pug
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
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
extends /layouts/layout.pug
block title
title About
block content
.container.px-5.py-2(class="sm:px-10 sm:max-w-screen-xl")
h1.text-4xl.font-semibold.my-5.intro-animation About
p.intro-animation
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ex est, maximus aliquam sagittis vel,
| tempus vel odio. Praesent felis elit, blandit et laoreet nec, hendrerit et arcu. Aenean ligula sapien,
| sodales vel semper in, pulvinar id nulla. Donec pellentesque non tellus vel imperdiet. Pellentesque
| posuere, nisl sed rutrum tincidunt, augue augue vestibulum ex, vel ornare justo arcu eu magna. Praesent
| vel nisl enim. Aenean a odio porttitor, fermentum est et, mattis sem. Suspendisse aliquam, risus a
| aliquam vestibulum, eros ipsum pulvinar sem, quis posuere tellus ex id velit. Quisque eu pellentesque
| nisl, sed volutpat purus. Sed auctor convallis sapien sed hendrerit. Vivamus et neque facilisis,
| ultrices ex non, faucibus velit. Aliquam laoreet sed turpis a blandit. Nulla fringilla massa non
| fermentum rutrum.
.bg-white(class="dark:bg-quaternary dark:border-quaternary").my-5.rounded-lg.overflow-hidden.border.border-gray-200.intro-animation
img(loading='eager' width='1500' src='https://images.unsplash.com/photo-1570506020466-17c74d2f4590?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1500&q=80' alt='Lazyloaded img')
p.p-5 Lazyloaded picture.
div(class="md:grid-cols-12").grid.gap-6.my-3
div(class="md:col-span-6 dark:bg-quaternary dark:border-quaternary").p-5.rounded-lg.border.border-gray-200.bg-white.col-span-12.intro-animation
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
div(class="md:col-span-6 md:py-5").col-span-12.intro-animation
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
.space-y-5
p.intro-animation
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et
| ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus
| maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p.intro-animation
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et
| ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus
| maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p.intro-animation
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris
| et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis
| tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p.intro-animation
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris
| et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis
| tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p.intro-animation
| Cras mattis consectetur purus sit amet fermentum. Nulla vitae elit libero, a
| pharetra augue. Sed
| posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem
| lacinia quam
| venenatis vestibulum. Vestibulum id ligula porta felis euismod semper. Praesent
| commodo cursus
| magna, vel scelerisque nisl consectetur et.
p.intro-animation
| Etiam porta sem malesuada magna mollis euismod. Cum sociis natoque penatibus et
| magnis dis parturient
| montes, nascetur ridiculus mus. Vivamus sagittis lacus vel augue laoreet rutrum
| faucibus dolor
| auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget
| lacinia odio sem nec
| elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cras
| justo odio, dapibus
| ac facilisis in, egestas eget quam.
| Donec ullamcorper nulla non metus auctor fringilla. Sed posuere consectetur est
| at lobortis. Etiam
| porta sem malesuada magna mollis euismod. Donec sed odio dui. Donec id elit non
| mi porta gravida at
| eget metus. Cras mattis consectetur purus sit amet fermentum.
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris
| et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis
| tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p
| Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Vivamus
| sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Integer posuere
| erat a ante venenatis
| dapibus posuere velit aliquet. Curabitur blandit tempus porttitor.
| Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta
| felis euismod semper.
| Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nulla vitae
| elit libero, a
| pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula,
| eget lacinia odio
| sem nec elit.
| Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit
| libero, a pharetra
| augue. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent
| commodo cursus magna,
| vel scelerisque nisl consectetur et.
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris
| et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam
| commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes,
| nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae
| elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis
| tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis
| aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet
| tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p
| Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Vivamus
| sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Integer posuere
| erat a ante venenatis
| dapibus posuere velit aliquet. Curabitur blandit tempus porttitor.
| Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta
| felis euismod semper.
| Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nulla vitae
| elit libero, a
| pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula,
| eget lacinia odio
| sem nec elit.
| Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit
| libero, a pharetra
| augue. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent
| commodo cursus magna,
| vel scelerisque nisl consectetur et.
img#4-image(loading='eager' width='1534' src='https://images.unsplash.com/photo-1590233183655-79cd23bd56db?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1534&q=80' alt='Lazyloaded img')
img#5-image(loading='eager' width='1502' src='https://images.unsplash.com/photo-1590305840667-d7b021e86fd6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1502&q=80' alt='Lazyloaded img')
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
p
| Vivamus dolor massa, aliquet ut leo vel, sodales mattis tortor. Aenean at mauris et ex mollis
| fringilla. Sed volutpat viverra vehicula. Nullam maximus ligula ac nisl aliquam commodo. Donec sed
| vestibulum orci. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
| mus. Proin ut porttitor lorem, sit amet aliquet dui. Nunc dictum, lorem vitae elementum pharetra,
| sapien orci dignissim ligula, aliquam interdum erat urna a nibh. Morbi quis tellus maximus,
| pellentesque erat ac, porttitor nulla. Curabitur rhoncus urna non magna mattis aliquet. Vestibulum
| non lobortis turpis. Nunc aliquet velit a magna dictum pulvinar vitae laoreet tortor. Duis auctor
| iaculis arcu ac rutrum. Suspendisse vel odio risus.
img#snd-image(loading='eager' width='1541' src='https://images.unsplash.com/photo-1589979812000-4eab44f02c30?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1541&q=80' alt='Lazyloaded img')