-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
146 lines (131 loc) · 5.53 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
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<!--Titre Page-->
<title>Adrien Richmond</title>
<!--Détails du Site-->
<meta name="description" content="Author: Adrien Richmond">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--Lien du Site-->
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" type="text/css" href="css/navbar.css">
<link rel="stylesheet" type="text/css" href="css/footer.css">
<link rel="stylesheet" type="text/css" href="css/settings.css">
<link rel="stylesheet" type="text/css" href="css/animation.css">
<link rel="shortcut icon" type="logo/png" href="img/logo.png">
<link rel="stylesheet"href="https://unpkg.com/boxicons@latest/css/boxicons.min.css">
</head>
<body>
<!--Alerte
<div class="alertbanner">
🚧 Le site est actuellement en construction : Toutes les pages ne sont pas encore disponibles
</div> -->
<!--Navbar-->
<header>
<a href="index" class="logo"><img src="img/logoclair.png"></img><span>Adrien</span></a>
<ul class="navbar">
<li><a href="index" class="active">Accueil</a></li>
<li><a href="construction">À propos</a></li>
<li><a href="construction">Expériences</a></li>
<!--Social Mobile-->
<div class="socialogomobile">
<a href="https://drive.google.com/file/d/1PJD3xN7wls86F0MDLTSOZVL8GZ8tLsHn/view" target="blank">
<div class="bx bxs-graduation"></div>
<a href="https://www.linkedin.com/in/adrienrichmond/" target="blank">
<div class="bx bxl-linkedin"></div>
<a href="https://github.com/adrienrichmond" target="blank">
<div class="bx bxl-github"></div>
<a href="https://www.instagram.com/ad.rchd_pro/" target="blank">
<div class="bx bxl-instagram"></div></a>
</li>
</ul>
<!--Nav mobile-->
<div class="main">
<div class="bx bx-menu" id="menu-icon"></div>
<!--Social PC-->
<div class="socialogo">
<a href="https://drive.google.com/file/d/1PJD3xN7wls86F0MDLTSOZVL8GZ8tLsHn/view" target="blank">
<div class="bx bxs-graduation"></div>
<a href="https://www.linkedin.com/in/adrienrichmond/" target="blank">
<div class="bx bxl-linkedin"></div>
<a href="https://github.com/adrienrichmond" target="blank">
<div class="bx bxl-github"></div>
<a href="https://www.instagram.com/ad.rchd_pro/" target="blank">
<div class="bx bxl-instagram"></div></div> </a>
<!-- Mode Sombre -->
<div class="extra-icon">
<i id="theme-icon" class='bx bx-sun' onclick="toggleDarkMode()"></i>
</div>
</header>
<!--Contenu page-->
<section class="section1">
<div class="section1-content">
<h1>Hey, c'est Adrien</h1>
<div class="txtanimation">
<div class="static-txt">Je suis</div>
<ul class="dynamic-txts">
<li><span>entrepreneur</span></li>
<li><span>assistant info</span></li>
<li><span>vidéaste</span></li>
<li><span>passioné</span></li>
</ul>
</div>
<p>Passionné d'informatique depuis toujours, j'exprime
cette passion par la découverte de nouvelles notions numériques et informatiques.
Je suis quelqu'un qui a l'esprit motivé, organisé et sérieux dans mes passions.</p>
<div class="btn-box">
<a href="#section2">Découvrir</a>
<a href="contact">Contact</a>
</div>
<div class="profile-image">
<img src="/img/me.png">
</div>
</section>
</div>
<section id="section2" class="section2">
<iframe style = "border:0; height:600px; width:100%;" src="https://fr.resaclick.net/features/pro/proPublic/iframe/agenda.php?v=10342_ZEYkpLGCNyPBSHv8zQWb&bgColor=transparent"></iframe>
</section>
<!--Bas de Page-->
<footer class="sticky-footer">
<ul>
<li><a href="contact">Contact</a></li>
<li><a href="privacy">Politique de confidentialité</a></li>
</ul>
<p>©2023 par Adrien avec ❤️</p>
</footer>
</main>
</body>
<!--Scripts -->
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/animation.js"></script>
<script src="https://unpkg.com/typewriter-effect@latest/dist/core.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-6B7TZ2M8ZS"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-6B7TZ2M8ZS');
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
var currentTheme = localStorage.getItem("theme");
if (currentTheme === "dark") {
// Appliquer le mode sombre
document.querySelector('body').classList.add("dark-mode");
document.getElementById("theme-icon").classList.remove("bx-sun");
document.getElementById("theme-icon").classList.add("bx-moon");
// Changer l'image du logo pour le mode sombre
document.querySelector('.logo img').src = 'img/logodark.png';
} else {
// Appliquer le mode clair (par défaut)
document.querySelector('body').classList.remove("dark-mode");
document.getElementById("theme-icon").classList.remove("bx-moon");
document.getElementById("theme-icon").classList.add("bx-sun");
// Changer l'image du logo pour le mode clair
document.querySelector('.logo img').src = 'img/logoclair.png';
}
});
</script>
</html>