-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathindex.html
More file actions
182 lines (169 loc) · 12.1 KB
/
Copy pathindex.html
File metadata and controls
182 lines (169 loc) · 12.1 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
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HACKTOBERFEST 2023</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="app">
<div class="header">
<div class="navbar">
<h1 class="title">HACKTOBERFEST 2023</h1>
<nav >
<ul>
<li><a href="#about">A propos</a></li>
<li><a href="#gallery">Participants</a></li>
</ul>
</nav>
</div>
</div>
<div class="body">
<div id="about">
<h2>A propos</h2>
<h3>Qu'est-ce que le Hacktoberfest ?</h3>
<p data-aos="fade-up">
<cite>
Hacktoberfest est une célébration d'un mois des projets open-source, de leurs mainteneurs et de l'ensemble de la communauté des contributeurs. Chaque mois d'octobre, les responsables de projets open-source accordent une attention particulière aux nouveaux contributeurs en guidant les développeurs dans leurs premières demandes de téléchargement sur GitHub.
</cite>
~ de GitHub.
</p>
<p data-aos="fade-up">
Hacktoberfest est une idée et une célébration de l'open-source. Comme l'événement a lieu en octobre, le nom rime avec octobre.
</p>
<h3 data-aos="fade-up">Pourquoi contribuer à l'Open-Source ?</h3>
<p data-aos="fade-up">
C'est aussi simple que possible pour le plaisir. Oui, contribuer à l'open-source est amusant. Et ce plaisir vous apporte :
</p>
<ul>
<li data-aos="fade-left">
<strong>Une expérience professionnelle :</strong> Contribuer à des projets que d'autres personnes, entreprises ou organisations utilisent. Cela vous donne une expérience professionnelle. Vous obtenez :
<ul>
<li data-aos="fade-left">
<strong>
Des compétences en gestion de projet :
</strong>
Comment les développeurs de logiciels viennent et développent des logiciels, font des mises à jour, des corrections de bogues et des correctifs, et documentent les choses. Il est intéressant de savoir comment maintenir la paix et collaborer.
</li>
<li data-aos="fade-left">
<strong>Comprendre les cas d'utilisation dans le monde réel : </strong>
Contribuer à des projets utilisés dans l'industrie peut vous exposer à des scénarios de développement du monde réel et aux exigences des utilisateurs.
</li>
</ul>
</li>
<li data-aos="fade-right">
<strong>Développement des compétences : </strong>
C'est la meilleure partie. Votre apprentissage et vos compétences montent en flèche lorsque vous contribuez et collaborez à des projets et des communautés open-source. Vous aurez l'occasion de :
<ul>
<li data-aos="fade-right">
<strong>Résoudre des problèmes divers : </strong>
Les projets open source couvrent diverses applications, industries et complexités. Cela vous permet de comprendre des bases de code en dehors de votre travail quotidien.
</li>
<li data-aos="fade-right">
<strong>
d'acquérir une expérience du monde réel :
</strong>
Cet aspect est crucial pour les étudiants et les personnes désireuses de changer de carrière. Les projets de logiciels libres sont souvent complexes et servent des objectifs concrets. Travailler sur ces projets vous expose aux défis que vous rencontrerez professionnellement.
</li>
<li data-aos="fade-right">
<strong>Collaboration et travail d'équipe : </strong>
Vous collaborez avec des développeurs expérimentés, des concepteurs UI/UX et d'autres professionnels. Cette interaction vous apprend à travailler en équipe, améliore vos compétences en matière de communication et vous offre de nouvelles perspectives pour approcher le marché du travail.
</li>
</ul>
</li>
</ul>
</div>
<div id="gallery">
<h2 data-aos="zoom-in" data-aos-duration="50000">Participants Git & GitHub For Open Source By GDSC ISTM</h2>
<div class="gallery">
<!-- Copiez de là -->
<div data-aos="zoom-in" class="card">
<!-- Remplacez le numéro de la card dans l'attribut id -->
<div id="card1" class="image"></div>
<div class="line"></div>
<div class="infos">
<h3 class="fullname">Mamadou Moustapha Diallo</h3>
<div>Designer</div>
<div class="links">
<!-- Mettez votre lien github ci-dessous dans l'attribut href="https://github.com/<GITHUB_USERNAME>" -->
<a href="https://github.com/moustaphaotf" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg"
width="24" height="24" viewBox="0 0 24 24">
<mask id="lineMdGithubLoop0" width="24" height="24" x="0" y="0">
<g fill="#fff">
<ellipse cx="9.5" cy="9" rx="1.5" ry="1" />
<ellipse cx="14.5" cy="9" rx="1.5" ry="1" />
</g>
</mask>
<g fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path stroke-dasharray="30" stroke-dashoffset="30"
d="M12 4C13.6683 4 14.6122 4.39991 15 4.5C15.5255 4.07463 16.9375 3 18.5 3C18.8438 4 18.7863 5.21921 18.5 6C19.25 7 19.5 8 19.5 9.5C19.5 11.6875 19.017 13.0822 18 14C16.983 14.9178 15.8887 15.3749 14.5 15.5C15.1506 16.038 15 17.3743 15 18C15 18.7256 15 21 15 21M12 4C10.3317 4 9.38784 4.39991 9 4.5C8.47455 4.07463 7.0625 3 5.5 3C5.15625 4 5.21371 5.21921 5.5 6C4.75 7 4.5 8 4.5 9.5C4.5 11.6875 4.98301 13.0822 6 14C7.01699 14.9178 8.1113 15.3749 9.5 15.5C8.84944 16.038 9 17.3743 9 18C9 18.7256 9 21 9 21">
<animate fill="freeze" attributeName="stroke-dashoffset" dur="0.6s" values="30;0" />
</path>
<path stroke-dasharray="10" stroke-dashoffset="10" d="M9 19">
<animate fill="freeze" attributeName="stroke-dashoffset" begin="0.7s" dur="0.2s" values="10;0" />
<animate attributeName="d" dur="3s" repeatCount="indefinite"
values="M9 19c-1.406 0-2.844-.563-3.688-1.188C4.47 17.188 4.22 16.157 3 15.5;M9 19c-1.406 0-3-.5-4-.5-.532 0-1 0-2-.5;M9 19c-1.406 0-2.844-.563-3.688-1.188C4.47 17.188 4.22 16.157 3 15.5" />
</path>
</g>
<rect width="8" height="4" x="8" y="11" fill="black" mask="url(#lineMdGithubLoop0)">
<animate attributeName="y" dur="10s" keyTimes="0;0.45;0.46;0.54;0.55;1" repeatCount="indefinite"
values="11;11;7;7;11;11" />
</rect>
</svg>
</a>
<!-- Mettez votre lien linkedin ci-dessous dans l'attribut href="https://www.linkedin.com/in/<LINKEDIN_USERNAME>" -->
<a href="https://www.linkedin.com/in/moustaphaotf/" target="_blank"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<circle cx="4" cy="4" r="2" fill="#0a66c2" fill-opacity="0">
<animate fill="freeze" attributeName="fill-opacity" dur="0.4s" values="0;1" />
</circle>
<g fill="none" stroke="#0a66c2" stroke-linecap="round" stroke-width="4">
<path stroke-dasharray="12" stroke-dashoffset="12" d="M4 10V20">
<animate fill="freeze" attributeName="stroke-dashoffset" begin="0.2s" dur="0.2s" values="12;0" />
</path>
<path stroke-dasharray="12" stroke-dashoffset="12" d="M10 10V20">
<animate fill="freeze" attributeName="stroke-dashoffset" begin="0.5s" dur="0.2s" values="12;0" />
</path>
<path stroke-dasharray="24" stroke-dashoffset="24"
d="M10 15C10 12.2386 12.2386 10 15 10C17.7614 10 20 12.2386 20 15V20">
<animate fill="freeze" attributeName="stroke-dashoffset" begin="0.7s" dur="0.5s" values="24;0" />
</path>
</g>
</svg></a>
</div>
</div>
</div>
<!-- Jusqu'ici -->
</div>
</div>
</div>
</div>
<!-- To top button -->
<button class="top-button" onclick="topFunction()">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M246.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L224 109.3 361.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160zm160 352l-160-160c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L224 301.3 361.4 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3z"/></svg>
</button>
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
AOS.init({
offset: 300
});
/* Show the button when the user scrolls down 20px from the top of the document */
window.onscroll = function() {
scrollFunction();
};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
document.querySelector(".top-button").style.display = "block";
} else {
document.querySelector(".top-button").style.display = "none";
}
}
/* When the user clicks on the button, scroll to the top of the document */
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
</body>
</html>