-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
139 lines (124 loc) · 6.35 KB
/
index.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
132
133
134
135
136
137
138
139
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta principal´s -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- meta SEO -->
<title>Todointerconectado | Product card | Frontend Mentor</title>
<meta name="language" content="spanish">
<meta name="title" content="Product card">
<meta name="description" content="Tarjeta de los mejores perfumes para liberar la esencia que se tiene dentro.">
<meta name="generator" content="todointerconectado.com">
<meta name="author" content="Francisco Carusso">
<meta name="application-name" content="Todointerconectado">
<meta name="copyright" content="copyright © todointerconectado.com">
<meta property="image" content="https://todointerconectado.com/productCard/images/miniatura.png">
<meta property="name" content="Todointerconectado">
<meta name="keywords" content="frontend | frontendmentor | html5 | css3 | javascript | francisco carusso | todointerconectado | NFT">
<meta name="robots" content="index, follow">
<meta name="audience" content="all">
<meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1">
<meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1">
<!-- meta Facebook -->
<meta property="og:title" content="Product card">
<meta property="og:description" content="Tarjeta de los mejores perfumes para liberar la esencia que se tiene dentro.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://todointerconectado.com/productCard/">
<meta property="og:image" content="https://todointerconectado.com/productCard/images/miniatura.png">
<meta property="og:image:height" content="320">
<meta property="og:image:width" content="574">
<meta property="og:image:alt" content="Imagen de la pagina web con las tarjeta productCard">
<meta property="og:image:type" content="image/png">
<meta property="og:site_name" content="Todointerconectado">
<!-- Lenguages -->
<meta content="es_ES" property="og:locale">
<meta content="en_US" property="og:locale:alternate">
<meta content="pt_BR" property="og:locale:alternate">
<!-- meta Twitter -->
<meta name="twitter:title" content="Product card">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:description" content="Tarjeta de los mejores perfumes para liberar la esencia que se tiene dentro.">
<meta property="twitter:url" content="https://todointerconectado.com/productCard/">
<meta property="og:image" name="twitter:image" content="https://todointerconectado.com/productCard/images/miniatura.png">
<meta property="twitter:image:alt" content="Imagen de la pagina web con las tarjeta productCard">
<meta name="twitter:site" content="@Todointerconect">
<meta name="twitter:creator" content="@Todointerconect">
<!-- Favicons / icon -->
<link rel="apple-touch-icon" sizes="180x180" href="./images/favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./images/favicons/favicon-16x16.png">
<link rel="manifest" href="./images/favicons/site.webmanifest">
<!-- style sheets -->
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/redSociales.css">
</head>
<body class="body" id="profile">
<main class="card">
<figure class="cardContainerFragrance">
<img class="cardFragrance" src="./images/image-product-mobile.jpg" alt="Perfume">
</figure>
<section class="cardContainerText">
<span class="preTitle">Perfume</span>
<h1 class="title">Gabrielle Essence Eau De Parfum</h1>
<p class="text">
A floral, solar and voluptuous interpretation composed by Olivier Polge, Perfumer-Creator for the House of CHANEL.
</p>
<div class="price">
$149.99 <span class="prePrice">$169.99</span>
</div>
<button class="button">
<img src="./images/icon-cart.svg" alt="carito">
Add to Cart
</button>
</section>
</main>
<footer class="footer">
<nav class="navContactos">
<ul class="containerContacts">
<li class="containerContactsRedSocial">
<a href="https://www.instagram.com/franciscocarusso" target="_blank">
<img class="containerContactsImg" src="./images/iconos/instagram.png" alt="icon red social instagram" title="Instagram">
</a>
</li>
<li class="containerContactsRedSocial">
<a href="https://www.linkedin.com/in/franciscocarusso/" target="_blank">
<img class="containerContactsImg" src="./images/iconos/linkedin.png" alt="icon red social linkedin" title="linkedin">
</a>
</li>
<li class="containerContactsRedSocial">
<a href="https://github.com/Todointerconectado" target="_blank">
<img class="containerContactsImg" src="./images/iconos/github.png" alt="icon red social github" title="Github">
</a>
</li>
<li class="containerContactsRedSocial">
<a href="https://twitter.com/Todointerconect" target="_blank">
<img class="containerContactsImg" src="./images/iconos/twitter.png" alt="icon red social twitter" title="twitter">
</a>
</li>
<li class="containerContactsRedSocial">
<a href="https://www.youtube.com/@todointerconectado" target="_blank">
<img class="containerContactsImg" src="./images/iconos/youtube.png" alt="icon red social YouTube" title="YouTube">
</a>
</li>
<li class="containerContactsRedSocial">
<a href="https://wa.me/message/NDFDMQDDCCIBB1/" target="_blank">
<img class="containerContactsImg" src="./images/iconos/whatsapp.png" alt="icon red social Whatsapp" title="Whatsapp">
</a>
</li>
</ul>
</nav>
<div>
<p class="atrubution">Coded by
<a href="https://todointerconectado.com/" target="_blank">Todointerconectado | Francisco Carusso.</a>
</p>
<p class="atrubution">Challenge by
<a href="https://www.frontendmentor.io/profile/Todointerconectado" target="_blank">Frontend Mentor.</a>
</p>
</div>
<a class="containerArrow" href="#profile">
<img class="arrow" src="./images/iconos/flecha.png" alt="up arrow">
</a>
</footer>
</body>
</html>