-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathmain.html
More file actions
166 lines (162 loc) · 5.7 KB
/
Copy pathmain.html
File metadata and controls
166 lines (162 loc) · 5.7 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
<!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" />
<title>Portfolio</title>
<link rel="stylesheet" href="main.css" />
<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=Inter:wght@200;400;700&display=swap"
rel="stylesheet"
/>
</head>
<body>
<div class="home-container section">
<h1 class="title">
Clément CHABAN <br />
Développeur WEB
</h1>
<img src="/assets/profil.png" alt="" class="photo_profil" />
</div>
<div class="formation-container section">
<div class="formations-name">
<ul>
<li><p class="formation">Epitech</p></li>
<li><p class="formation">IUT Informatique</p></li>
<li><p class="formation">BAC STI2D</p></li>
</ul>
</div>
<div class="formation-container-name">
<img id="formation" src="/assets/formation.png" alt="" />
<h2>MES FORMATIONS</h2>
</div>
<div class="formation-description">
<img src="/assets/epitech-logo-png.png" alt="" />
<p>Architecte logiciel, développeur d’applications <br />2022-2025</p>
<p class="formation-description-petit">
MSc Pro Iot (Internet of things)
</p>
</div>
<div class="formation-description">
<img src="/assets/altermap.png" alt="" srcset="" />
<p>1 an en alternance chez ALTERMAP 2021 - 2022</p>
<p class="formation-description-petit">
Développement Web Front-End et Backend
</p>
</div>
<div class="formation-description">
<img id="badge" src="/assets/badge.svg" alt="" />
<p>BAC STI2D Option: Système d’Information et Numérique</p>
<p>2018 - 2020</p>
</div>
</div>
<div class="passion-container section">
<div class="passion-description">
<img id="raspberry" src="/assets/raspberry.png" alt="" />
<p>Raspberry pi</p>
<p>
Développements de <br />
programmes
</p>
</div>
<div class="passion-description">
<img src="/assets/r6_logo_png.png" alt="" />
<p>
SFPD Shinigami <br />
septembre 2019 - mars 2020
</p>
<ul>
<li>Travail en équipe</li>
<li>Cohésion et mental</li>
<li>Sérieux</li>
</ul>
</div>
<div class="passion-description">
<img id="handball" src="/assets/handball_png.png" alt="" />
<p>
2007-2017 <br />
(1 an à niveau régional)
</p>
<p>
2014-2016 <br />
arbitrage à niveau départemental
</p>
</div>
<div class="passion-container-name"><h2>PASSIONS</h2></div>
<div class="passions-name">
<ul>
<li><p class="passion">Informatique</p></li>
<li><p class="passion">Joueur e-sport (compétition)</p></li>
<li><p class="passion">Handball</p></li>
</ul>
</div>
</div>
<div class="projet-container section">
<h2 class="projet-title">Mes projets</h2>
<ul class="slider">
<li class="card">
<img class="card_image" src="/assets/konoha.png" alt="" />
<h3>Application</h3>
<div class="projet-description">
<p>
Application mobile réalisée en React Native et destinée aux
lecteurs de mangas
</p>
<p>[En cours de développement]</p>
</div>
</li>
<li class="card focused">
<img class="card_image" src="/assets/ouvivre-logo.png" alt="" />
<h3>Où-vivre</h3>
<div class="projet-description">
<p>
Où vivre est une plateforme cartographique grand public. Cette
carte interactive vous aide à choisir le meilleur lieu de vie en
fonction de vos propres critères grâce à une sélection de données
et d’outils.
</p>
<p>
<a href="https://ou-vivre.fr/">www.ou-vivre.fr</a>
</p>
</div>
</li>
<li class="card">
<img class="card_image" src="/assets/formation.png" alt="" />
<h3>Blog</h3>
<div class="projet-description">
<p>Blog réalisé pour le compte instagram @Otaku.Ame</p>
<p>
<a href="https://otakuame.netlify.app/"
>www.otakuame.netlify.app</a
>
</p>
<p>[En cours de développement]</p>
</div>
</li>
</ul>
</div>
<div class="contact-container section">
<h2 class="contact-title">
Intérressés par mon profil ? <br />Contactez-moi !
</h2>
<div class="contact-information-container">
<div id="mail" class="contact-information">
<img class="logo" src="./assets/ui-email.svg" alt="" />
<h3>chaban.clement@gmail.com</h3>
</div>
<div id="phone" class="contact-information">
<img class="logo" src="./assets/phone.svg" alt="" />
<h3>06 04 13 85 89</h3>
</div>
<div id="linkedin" class="contact-information">
<img class="logo" src="./assets/linkedin.svg" alt="" />
<h3>Linkedin</h3>
</div>
</div>
</div>
</body>
<script src="main.js"></script>
</html>