forked from MaesMM/Book-Sharing
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
153 lines (142 loc) · 5.73 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
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!DOCTYPE html>
<html lang="en">
<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="./styles/style.css" />
<link rel="stylesheet" href="./styles/header.css" />
<link rel="stylesheet" href="./styles/index.css" />
<title>Accueil</title>
</head>
<body>
<!-- Header -->
<header class="header">
<a class="logo" href="../index.html">Bele</a>
<nav class="headerNav">
<a href="./index.html" class="link">Accueil</a>
<a href="./pages/buy/buy.html" class="link">Vente/Location</a>
<a href="../sell.html" class="link">Revente</a>
</nav>
<a class="cart" href="./pages/cart/cart.html">
<img src="./images/icons/cart.svg" />
</a>
<div class="mobile">
<label for="toggleNav" class="hamburger">
<div class="hamburgerLine"></div>
<div class="hamburgerLine"></div>
<div class="hamburgerLine"></div>
</label>
<input type="checkbox" id="toggleNav" />
<nav class="mobileNav">
<a href="./index.html" class="link">Accueil</a>
<a href="./pages/buy/buy.html" class="link">Vente/Location</a>
<a href="../sell.html" class="link">Revente</a>
</nav>
</div>
</header>
<div class="hero-container">
<div class="hero">
<video
class="hero-video"
width="1920"
height="1080"
autoplay
loop
disablePictureInPicture
controlsList="nodownload"
muted
>
<source src="./videos/books.mp4" type="video/mp4" />
</video>
<div class="hero-text">
<h1 class="title">Bienvenue sur Bele</h1>
<h1 class="title2">
<span>LA</span> solution pour vos livres à la catho !
</h1>
</div>
</div>
</div>
<main class="main">
<div class="main-content">
<section class="row">
<div class="content">
<h2 class="section-title">Bele c'est quoi ?</h2>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Neque
maiores distinctio ullam sequi provident facilis nisi totam
asperiores adipisci eaque quidem delectus animi odio, in tempore
ipsum. Quas provident pariatur sed quibusdam sint iusto velit
aspernatur reiciendis sit rerum. Optio, atque! Cum, quos
repudiandae fugit non quis molestiae sapiente ab ullam, cumque
incidunt dolorem animi inventore ut eaque vero, veniam distinctio
exercitationem dolore dolores eum recusandae sed placeat
accusantium. Culpa id laborum esse sapiente similique dolor odio
dignissimos adipisci incidunt, sunt, non nulla, ipsum aspernatur.
Amet, corporis accusamus. Corrupti quos eligendi animi minus
accusantium. Dolorum nisi perferendis delectus aspernatur
expedita.
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Neque
maiores distinctio ullam sequi provident facilis nisi totam
asperiores adipisci eaque quidem delectus animi odio, in tempore
ipsum. Quas provident pariatur sed quibusdam sint iusto velit
aspernatur reiciendis sit rerum.
</p>
</div>
<img class="illustration" src="images/illustrations/book girl.svg" />
</section>
<hr class="separator" />
<section>
<h2 class="section-title">Notre équipe</h2>
<div class="founderRow">
<article class="founderCard card1">
<img src="./images/people/user1.jpg" alt="" />
<div class="founderDescription">
<h3 class="founderName">Marie Dupont</h3>
<span>Etudiant en 3ème année à la catho</span>
<p>
<q
>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consequatur assumenda, ipsum molestias, cum amet adipisci
impedit ut delectus pariatur quis animi ea, veritatis
ratione. Ipsa?</q
>
</p>
</div>
</article>
<article class="founderCard card2">
<img src="./images/people/user3.jpg" alt="" />
<div class="founderDescription">
<h3 class="founderName">Clément Choël</h3>
<span>Etudiant en 3ème année à la catho</span>
<p>
<q
>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consequatur assumenda, ipsum molestias, cum amet adipisci
impedit ut delectus pariatur quis animi ea, veritatis
ratione. Ipsa?</q
>
</p>
</div>
</article>
<article class="founderCard card3">
<img src="./images/people/user2.jpg" alt="" />
<div class="founderDescription">
<h3 class="founderName">Jean Legrand</h3>
<span>Etudiant en 3ème année à la catho</span>
<p>
<q
>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Consequatur assumenda, ipsum molestias, cum amet adipisci
impedit ut delectus pariatur quis animi ea, veritatis
ratione. Ipsa?</q
>
</p>
</div>
</article>
</div>
</section>
</div>
</main>
</body>
</html>