-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
273 lines (249 loc) · 14 KB
/
index.html
File metadata and controls
273 lines (249 loc) · 14 KB
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
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
<!DOCTYPE html>
<html lang="it">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta charset="utf-8" />
<meta name="description" content="Dolci Sardi - La pasticceria tradizionale della Sardegna" />
<title>Dolci Sardi Gioiello</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Commissioner:wght@400;500&family=Athelas:wght@400;700&family=Markazi+Text:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="globals.css" />
<link rel="stylesheet" href="styleguide.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<main class="screen">
<!-- Bottom shadow line decoration -->
<img class="shadow-line" src="img/shadow-line-5.svg" alt="" role="presentation" />
<!-- Background shadow decorations for card list section -->
<div class="shadows" aria-hidden="true">
<img class="vector" src="img/vector.svg" alt="" />
<img class="img" src="img/vector-9.svg" alt="" />
<img class="img" src="img/vector-5.svg" alt="" />
</div>
<!-- Card list section: individual Sardinian sweets -->
<section class="card-list" aria-label="I nostri dolci sardi">
<!-- Card: Pastissus -->
<article class="card-item">
<img class="img-2" src="img/img-2.png" alt="Pastissus - dolcetti sardi a base di mandorle con glassa" />
<p class="desc">
La pasticceria sarda ci regala dei dolcetti tanto belli da vedere quanto deliziosi da gustare, un esempio
sono i pastissus.<br /><br />Si tratta di un delizioso composto a base di mandorle che va a riempire uno
scrigno di sfoglia. Come tocco finale viene ricoperto con una candida glassa, che può essere decorata con
gusto e fantasia.<br /><br />Perfetti a colazione come per l'ora del tè, i pastissus possono essere
preparati anche per le occasioni speciali, come le festività di Natale e di Pasqua.
</p>
<h2 class="title">PASTISSUS</h2>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/image.svg" alt="" /></div>
<!-- Card: Amaretti -->
<article class="card-item">
<p class="text-wrapper">
Dall'unione di mandorle, albumi e zucchero semolato nasce una bontà fragrante e golosa famosa in tutta la
Sardegna, gli amaretti sardi.<br /><br />La ricetta tradizionale vuole che si utilizzino sia le mandorle
dolci, in maggioranza, sia le mandorle amare, decorando la superficie di ogni dolcetto con una mandorla
intera e un po' di zucchero.
</p>
<h2 class="div">AMARETTI</h2>
<div class="image-wrapper">
<img class="image" src="img/image-6.png" alt="Amaretti sardi - biscotti a base di mandorle dolci e amare" />
</div>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/shadow-line-2.svg" alt="" /></div>
<!-- Card: Bianchittus -->
<article class="card-item">
<p class="p">
I bianchittus sardi sono dei golosi dolcetti della tradizione sarda che si preparano principalmente per le
feste.<br /><br />Questi dolcetti altro non sono che buonissime meringhe arricchite con le mandorle, alle
quali è molto difficile resistere.
</p>
<h2 class="title-2">BIANCHITTUS</h2>
<div class="img-3">
<div class="group"><div class="image-2" role="presentation"></div></div>
<img class="image-3" src="img/image-7.png" alt="Bianchittus sardi - meringhe con mandorle" />
</div>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/shadow-line-6.svg" alt="" /></div>
<!-- Card: Mostaccioli di Oristano -->
<article class="card-item">
<p class="desc-2">
I mostaccioli sono dolci di origine molto antica, diffusi un po' su tutta la penisola. A Oristano, in
Sardegna, se ne prepara una particolare versione, davvero golosa e irresistibile.
</p>
<h2 class="title-3">MOSTACCIOLI DI ORISTANO</h2>
<div class="img-3">
<div class="div-wrapper"><div class="image-4" role="presentation"></div></div>
<img class="image-5" src="img/image-8.png" alt="Mostaccioli di Oristano - dolci tipici sardi" />
</div>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/shadow-line-7.svg" alt="" /></div>
<!-- Card: Su Pistiddu -->
<article class="card-item">
<p class="desc-3">
Su pistiddu è un dolce tipico sardo che, per tradizione, si prepara in occasione della festa di Sant'Antonio
Abate.<br /><br />Su pistiddu è diffuso in Barbagia, un territorio in provincia di Nuoro in cui esistono
diverse versioni a seconda del paese che si visita. La sua particolarità, oltre al ripieno al miele o a base
di Sapa di vino cotto (o di entrambi) che profuma di arancia, è la sfoglia che costituisce la superficie del
dolce, che viene riccamente decorata e rende il dolce veramente scenografico.
</p>
<h2 class="title-4">SU PISTIDDU</h2>
<div class="img-3">
<div class="group-2"><div class="image-4" role="presentation"></div></div>
<img class="image-5" src="img/image-9.png" alt="Su Pistiddu - dolce tipico della Barbagia" />
</div>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/shadow-line-4.svg" alt="" /></div>
<!-- Card: Ciambelline Sarde -->
<article class="card-item">
<p class="desc-4">
Tra i tanti dolcetti tipici che provengono dalla Sardegna ci sono anche le ciambelline sarde: dei golosi
biscotti di pasta frolla ripieni di marmellata, dalla caratteristica forma circolare oppure a fiore.<br /><br />Le
ciambelline sarde sono ideali da servire a merenda o come dessert alla fine del pasto, oppure da portare in
tavola per la colazione.
</p>
<h2 class="title-5">CIAMBELLINE SARDE</h2>
<div class="img-wrapper">
<img
class="image-6"
src="img/image-10.png"
alt="Ciambelline sarde - biscotti di pasta frolla ripieni di marmellata"
/>
</div>
</article>
<div class="frame" aria-hidden="true"><img class="shadow-line-2" src="img/shadow-line.svg" alt="" /></div>
<!-- Card: Pistocheddus -->
<article class="card-item">
<p class="desc-2">
Tra i dolci tipici della Sardegna, i pistoccheddus sono tra i più eleganti e golosi, per la presenza della
glassa chiara e lucida che li rende belli da vedere oltre che gustosi da mangiare.
</p>
<h2 class="title-6">PISTOCHEDDUS</h2>
<div class="img-4">
<img class="image-6" src="img/image-11.png" alt="Pistocheddus - dolci sardi con glassa chiara e lucida" />
</div>
</article>
</section>
<!-- Decorative vanilla icon -->
<div class="game-icons-vanilla" aria-hidden="true">
<img class="vector-2" src="img/vector-7.svg" alt="" />
</div>
<!-- Section heading: I Nostri Dolci -->
<h2 class="i-nostri-DOLCI">I NOSTRI DOLCI</h2>
<!-- Background decoration for text section -->
<div class="background" aria-hidden="true">
<img class="shadow-line-3" src="img/shadow-line-3.svg" alt="" />
<img class="vector-3" src="img/vector-12.svg" alt="" />
</div>
<!-- Descriptive text about Sardinian sweets -->
<section class="text" aria-label="Descrizione dei dolci sardi">
<p class="ci-sono-poi-i">
Ci sono poi i Papassini e i Guefus – dolcetti a forma di palline realizzate con mandorle tritate, zucchero e
limone, le celebri Seadas e i golosissimi Pirichittus.<br /><br />A base di mandorle sono anche gli Amaretos,
dei dolci amaretti a base di mandorle dolci e amare, zucchero, albume d'uovo e scorza di limone. Infine ci
sono i Candelaus, preparati con una sfoglia di pasta di mandorle che avvolge un impasto di mandorle,
aromatizzato con fiori d'arancio e glassato.
</p>
<p class="tra-i-dolci-tipici">
Tra i dolci tipici ci sono il torrone, il Flan di latte e i biscotti tipo savoiardi in versione sarda chiamati
Pistoccus. Ma uno degli ingredienti più utilizzati per la realizzazione dei dolci sardi sono certamente le
mandorle.<br /><br />Tra i dolci che utilizzano questo tipo di frutta secca ricordiamo l'Aranzada – preparato
con scorze d'arancio candite nel miele e mandorle tostate – il Gatò de mendula – un croccante di mandorle
tostate aromatizzato con arancia.
</p>
</section>
<!-- Hero photo -->
<img class="photo" src="img/photo.png" alt="Fotografia di dolci sardi tradizionali" />
<!-- Header / Hero section -->
<header class="first-lines">
<img class="lines" src="img/lines.png" alt="" role="presentation" />
<img class="img-5" src="img/img.png" alt="" role="presentation" />
<img class="girl" src="img/girl.svg" alt="Illustrazione decorativa di una donna sarda" />
<div class="logo">
<h1 class="title-7">DOLCI SARDI</h1>
<img class="group-3" src="img/group-48.png" alt="Gioiello - sottotitolo decorativo" />
</div>
</header>
<!-- Background decoration for intro section -->
<div class="background-2" aria-hidden="true">
<img class="line" src="img/line.svg" alt="" />
<img class="vector-4" src="img/vector-3.svg" alt="" />
</div>
<!-- Intro text about Sardinian pastry tradition -->
<section class="text-2" aria-label="Introduzione alla pasticceria sarda">
<p class="l-arte-culinaria">
<span class="span">L'arte culinaria della Sardegna offre una vasta varietà di ricette e preparazioni nel campo dei dolci.<br /></span>
<span class="text-wrapper-2"><br /></span>
<span class="text-wrapper-3">La pasticceria sarda si basa principalmente sulla tradizione contadina e pastorale dell'Isola. È per questo motivo che tra gli ingredienti utilizzati per la preparazione dei dolci sardi troviamo ingredienti semplici ma molto aromatici e intensi come ad esempio</span>
</p>
<p class="text-wrapper-4">
la frutta secca, il formaggio, il miele, gli agrumi, la frutta candita e la glassa. La pasticceria sarda si
basa principalmente sulla tradizione contadina e pastorale dell'Isola. È per questo motivo che tra gli
ingredienti utilizzati per la preparazione dei dolci sardi troviamo ingredienti semplici ma molto aromatici e
intensi come ad esempio la frutta secca, il formaggio, il miele, gli agrumi, la frutta candita e la glassa.
</p>
<h2 class="text-wrapper-5">DOLCI SARDI</h2>
</section>
<!-- Decorative dandelion icon -->
<div class="game-icons-dandelion" aria-hidden="true">
<img class="vector-5" src="img/vector-10.svg" alt="" />
</div>
<!-- Contact section -->
<section class="group-4" aria-label="Contatti">
<div class="frame-2">
<h2 class="contattaci-per">CONTATTACI PER INFORMAZIONI</h2>
<img class="title-line" src="img/title-line.svg" alt="" role="presentation" />
</div>
<div class="frame-wrapper">
<div class="frame-3">
<div class="frame-4">
<div class="giovanna-angioni-wrapper">
<p class="giovanna-angioni">GIOVANNA ANGIONI</p>
</div>
<address class="frame-5">
<p class="text-wrapper-6">+39 346 301 83 96</p>
<a class="text-wrapper-7" href="mailto:giovannangioni@gmail.com">giovannangioni@gmail.com</a>
</address>
</div>
<div class="frame-6">
<!-- Social/App link 1 -->
<div class="frame-7">
<div class="frame-8">
<div class="iconsax-linear" aria-hidden="true">
<img class="vector-6" src="img/vector-6.svg" alt="" />
<img class="vector-7" src="img/vector-2.svg" alt="" />
<img class="vector-8" src="img/vector-13.svg" alt="" />
<img class="vector-9" src="img/vector-11.svg" alt="" />
</div>
<p class="div-2">
<span class="text-wrapper-8">DOLCI SARDI <br /></span>
<span class="text-wrapper-9">GIOIELLO</span>
</p>
</div>
<div class="image-wrapper-2">
<img class="image-7" src="img/image-13.png" alt="QR code Dolci Sardi Gioiello" />
</div>
</div>
<!-- Social/App link 2 -->
<div class="frame-7">
<div class="frame-8">
<div class="iconsax-linear" aria-hidden="true">
<img class="vector-10" src="img/vector-8.svg" alt="" />
<img class="vector-6" src="img/vector-4.svg" alt="" />
</div>
<p class="div-2">
<span class="text-wrapper-8">DOLCI SARDI <br /></span>
<span class="text-wrapper-9">GIOIELLI</span>
</p>
</div>
<div class="image-wrapper-2">
<img class="image-8" src="img/image-14.png" alt="QR code Dolci Sardi Gioielli" />
</div>
</div>
</div>
</div>
</div>
</section>
</main>
</body>
</html>