-
Notifications
You must be signed in to change notification settings - Fork 0
/
product.html
175 lines (175 loc) · 8.47 KB
/
product.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
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
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/styles.css">
<title>SkoPunktSe</title>
<link rel="icon" type="image/x-icon" href="/images/adidas.png">
<script
src="https://code.jquery.com/jquery-3.6.1.min.js"
integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="
crossorigin="anonymous"
></script>
</head>
<body>
<header>
<div class="sidenav">
<a href="index.html">Hem</a>
<a class="sidenav-active" href="product.html">Alla produkter</a>
<a href="addproduct.html">Lägg till produkt</a>
<a href="contact.html">Om oss</a>
</div>
</header>
<main>
<h1 class="title">SkoPunktSe</h1>
<section class="jumbotron">
<article class="panel panel-featured">
<h2 class="panel-title">Alla våra produkter!</h2>
<p class="panel-text">Vi laddar upp inför black friday! Handla hos oss nu och du kommer inte att ångra dig!</p>
</article>
</section>
<section class="products">
<div class="card card">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/toffla.png" alt="Toffla för stranden"></a>
</div>
<h2 class="card-title">Tofflan</h2>
<small class="card-model">Årsmodell 2000</small>
<p class="card-text">Toffla tillverkad av hårdplast. Finns endast ett fåtal storlekar kvar från fjolårets bästsäljare!</p>
<p class="card-text" id="p1">
Varning tofflan kan komma att smälta i solen.
</p>
<button class="card-button" id="showNumbOne">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-default">Outdoors</p>
</span>
</div>
<div class="card card">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/adidas.png" alt="Adidas sko svart"></a>
</div>
<h2 class="card-title">Adidas</h2>
<small class="card-model">Årsmodell 2020</small>
<p class="card-text">Stilikon? say no more. Dessa skorna är för dig som önskar att vara lite snabbare.</p>
<p class="card-text" id="p2">
Tar dig från punkt A till B på mindre än en minut.
</p>
<button class="card-button" type="button" id="showNumbTwo">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-default">Outdoors</p>
<p class="card-tag-text bg-success">Running</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/vans.png" alt="Converse låga skor"></a>
</div>
<h2 class="card-title">Vans</h2>
<small class="card-model">Årsmodell 2022</small>
<p class="card-text">Dessa rackare är tämligen vanliga. Vi har fått höra att skavsåren som denna ger är utav högsta rang.</p>
<p class="card-text" id="p3">
Vi har ett stort utbud av dessa, vänligen klicka hem ett par.
</p>
<button class="card-button" id="showNumbThree">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-primary">Sport</p>
<p class="card-tag-text bg-danger">Skavsår</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/nike.png" alt="nike sneakers sko"></a>
</div>
<h2 class="card-title">Nike</h2>
<small class="card-model">Årsmodell 2019</small>
<p class="card-text">Julafton är runt hörnet, varför inte köpa dessa till flickvännen eller pojkvännen? Dessa pjuks är alltså unisex!</p>
<p class="card-text" id="p4">
Skynda och fynda!
</p>
<button class="card-button" id="showNumbFour">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-primary">Sport</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/snow.png" alt="Bruna vinterkängor"></a>
</div>
<h2 class="card-title">Kängan</h2>
<small class="card-model">Årsmodell 2023</small>
<p class="card-text">Kängan som alla vill ha. Fungerar väldigt bra om du måste gå till jobbet/skolan och inte sitter i din bil.</p>
<p class="card-text" id="p5">
Norrlänningar must have it!
</p>
<button class="card-button" id="showNumbFive">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-default">Outdoors</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/tretorn.png" alt="Tretorn CHELSEA CLASSIC WINTER - Regnkläder"></a>
</div>
<h2 class="card-title">Tretorn</h2>
<small class="card-model">Årsmodell 2010</small>
<p class="card-text">Tretorn har funnits sedan 1800-talet. Denna skon är ett konstverk som passar både i skogen men ack så bra i stan.</p>
<p class="card-text" id="p6">
Vattenavvisande isolering som smiter åt runt foten för en bekväm och varm passform.
</p>
<button class="card-button" id="showNumbSix">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-default">Outdoors</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/converse-taylor-all-star.png" alt="CHUCK TAYLOR ALL STAR"></a>
</div>
<h2 class="card-title">Converse</h2>
<small class="card-model">Årsmodell 1990</small>
<p class="card-text">Klassiska basketkängor i lägre modell från Converse. Dessa kommver garranterat att ge dig en extra push när du vill göra en dunk.</p>
<p class="card-text" id="p7">
Finns nu i flera färger!
</p>
<button class="card-button" id="showNumbSeven">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-primary">Sport</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/vans-old-school.png" alt="Vans Old Skool"></a>
</div>
<h2 class="card-title">Vans</h2>
<small class="card-model">Årsmodell 2021</small>
<p class="card-text">Vans har gjort det igen.. Denna modell har blivit en bästsäljare på väldigt kort tid.</p>
<p class="card-text" id="p8">
Skynda nu och klicka hem ett par.
</p>
<button class="card-button" id="showNumbEight">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-primary">Sport</p>
</span>
</div>
<div class="card card" href="#">
<div class="card-image">
<a href="viewproduct.html?product=sko1"><img src="images/timberland.png" alt="Timberland Premium vinterkänga"></a>
</div>
<h2 class="card-title">Timberland</h2>
<small class="card-model">Årsmodell 2021</small>
<p class="card-text">Skon som alla skogshuggare drömmer om. Skon har dessutom en perfekt passform!</p>
<p class="card-text" id="p9">
Skon är perfekt för långa skogspromenader eller en regnig dag i centrum.
</p>
<button class="card-button" id="showNumbNine">Visa mer</button>
<span class="card-tag">
<p class="card-tag-text bg-default">Outdoors</p>
</span>
</div>
</section>
</main>
<script type="text/javascript" src="js/products.js"></script>
</body>
</html>