Skip to content

Commit

Permalink
feat: renew website ui (#17)
Browse files Browse the repository at this point in the history
  • Loading branch information
@billmetangmo
billmetangmo committed Jun 23, 2024
1 parent 4278f76 commit be90739
Show file tree
Hide file tree
Showing 15 changed files with 740 additions and 293 deletions.
394 changes: 177 additions & 217 deletions html/en_index.html
View file

Large diffs are not rendered by default.

321 changes: 275 additions & 46 deletions html/index.css
View file

Large diffs are not rendered by default.

71 changes: 41 additions & 30 deletions html/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,30 +7,40 @@
<link rel="stylesheet" href="./index.css" />
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" />



</head>

<body>
<<body>
<div class="web">
<nav class="navigation">
<div class="vector-parent"><img class="vector-icon" alt="" src="./public/logo.png">
<div class="vector-parent">
<a href="/">
<img class="vector-icon" alt="Logo" src="./public/logo.png">
</a>
<div class="currentproject-parent">
<div class="currentproject"><img class="project-icon" alt="" src="./public/projecticon.svg">
<div class="current-projects">Projets actuels</div>
</div>
<div class="peertube-image"><img class="image-5-icon" alt="" src="./public/[email protected]">
<div class="watch-videos">Regarder des vidéos</div><img class="peertube-image-child" alt=""
src="./public/group-4.svg">
</div>
<div class="languagebutton">
<div class="fr-button">
<div class="fr">FR</div>
<a href="/nos-projets.html" target="_self">
<div class="currentproject">
<img class="project-icon" alt="" src="./public/projecticon.svg">
<div class="current-projects">Projets actuels</div>
</div>
<div class="en-button">
<div class="en">EN</div>
</a>
<a href="https://peertube.stream/c/mongulu/videos" target="_blank">
<div class="peertube-image">
<img class="image-5-icon" alt="" src="./public/[email protected]">
<div class="watch-videos">Chaîne vidéo</div>
<img class="peertube-image-child" alt="" src="./public/group-4.svg">
</div>
</a>
<div class="languagebutton">
<a href="/index.html">
<div class="fr-button">
<div class="fr">FR</div>
</div>
</a>
<a href="/en_index.html">
<div class="en-button">
<div class="en">EN</div>
</div>
</a>
</div>
</div>
</div>
Expand All @@ -44,9 +54,9 @@ <h1 class="collective-charter">Le collectif mongulu</h1>
s'appuyer sur des personnes qui se sentent proches de cette communauté et veulent mettre à sa disposition de façon bénévole leurs
connaissances, leur savoir-faire numérique.</p>
</div>
</div><img class="mongulu-image-icon" alt="" src="./public/[email protected]">
</div><img class="mongulu-image-icon" alt="" src="./public/mongulu-people.webp">
</section>
<section class="objectivesection"><img class="hut-image-icon" alt="" src="./public/[email protected]">
<section class="objectivesection"><img class="hut-image-icon" alt="" src="./public/baka-hut.webp">
<div class="objectivetext">
<div class="textsection">
<h2 class="objective">Objectif</h2>
Expand Down Expand Up @@ -166,17 +176,18 @@ <h2 class="approachtitle">
<footer class="footer">
<div class="first-row-link">
<div class="links">
<div class="projects"><img class="project-icon" alt="" src="./public/vector1.svg">
<div class="placeholder-link">Projets actuels</div>
</div>
<div class="peertube-logo">
<div class="image-5-parent"><img class="image-5-icon1" alt="" src="./public/[email protected]">
<div class="watch-videos1">Regarder des vidéos</div><img class="peertube-image-child" alt="">
</div>
</div>
<div class="projects"><img class="project-icon" alt="" src="./public/mail.svg">
<div class="placeholder-link">Contact</div>
</div>
<a href="https://www.facebook.com/CollectifMongulu" target="_blank" class="footer-link">
<img class="footer-icon" alt="Facebook Icon" src="./public/facebook.svg">
<div class="placeholder-link">Facebook</div>
</a>
<a href="https://www.linkedin.com/company/92889961/" target="_blank" class="footer-link">
<img class="footer-icon" alt="LinkedIn Icon" src="./public/linkedin.svg">
<div class="placeholder-link">LinkedIn</div>
</a>
<a href="mailto:[email protected]" class="footer-link">
<img class="footer-icon" alt="Mail Icon" src="./public/mail.svg">
<div class="placeholder-link">[email protected]</div>
</a>
</div>
</div>
<div class="all-rights-reserved">©Tous droits réservés</div>
Expand Down
114 changes: 114 additions & 0 deletions html/nos-projets.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
<!DOCTYPE html>
<html lang="fr">

<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, width=device-width">
<link rel="stylesheet" href="./global.css" />
<link rel="stylesheet" href="./index.css" />
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" />
<title>Nos Projets</title>
</head>

<body>
<div class="web">
<nav class="navigation">
<div class="vector-parent">
<a href="/">
<img class="vector-icon" alt="Logo" src="./public/logo.png">
</a>
<div class="currentproject-parent">
<a href="/nos-projets.html" target="_self">
<div class="currentproject">
<img class="project-icon" alt="Project Icon" src="./public/projecticon.svg">
<div class="current-projects">Projets actuels</div>
</div>
</a>
<a href="https://peertube.stream/c/mongulu/videos" target="_blank">
<div class="peertube-image">
<img class="image-5-icon" alt="PeerTube Icon" src="./public/[email protected]">
<div class="watch-videos">Chaîne vidéo</div>
<img class="peertube-image-child" alt="" src="./public/group-4.svg">
</div>
</a>
<div class="languagebutton">
<a href="/nos-projets.html">
<div class="fr-button">
<div class="fr">FR</div>
</div>
</a>
<a href="/our-projects.html">
<div class="en-button">
<div class="en">EN</div>
</div>
</a>
</div>
</div>
</div>
</nav>

<section class="projects-section">
<h2>Nos Projets</h2>
<div class="project">
<img src="./public/project-mtchoun-mouh.png" alt="Mtchoun-mouh" class="project-image">
<div class="project-details">
<h3>Mtchoun-mouh</h3>
<p>Objectif: Permettre aux demandeurs de passeports camerounais au consulat du Cameroun à Marseille d'être notifiés automatiquement par e-mail de sa délivrance au lieu de checker régulièrement le site comme demandé au consulat.</p>
<p>Site web: <a href="https://mtchoun-mouh.mongulu.cm/" target="_blank">https://mtchoun-mouh.mongulu.cm/</a></p>
<p>Code source: <a href="https://github.com/mongulu-cm/mtchoun-mouh" target="_blank">https://github.com/mongulu-cm/mtchoun-mouh</a></p>
</div>
</div>
<div class="project">
<img src="./public/project-tchoung-te.png" alt="Tchoung-te" class="project-image">
<div class="project-details">
<h3>Tchoung-te</h3>
<p>Objectif: Permettre aux membres de la communauté de trouver des associations près de chez eux ou selon une thématique précise en fournissant une carte exhaustive et interactive des toutes les associations camerounaises en France.</p>
<p>Site web: <a href="https://tchoung-te.mongulu.cm/" target="_blank">https://tchoung-te.mongulu.cm/</a> ou <a href="https://ai.mongulu.cm" target="_blank">https://ai.mongulu.cm</a> (pour la version chat)</p>
<p>Code source: <a href="https://github.com/mongulu-cm/tchoung-te" target="_blank">https://github.com/mongulu-cm/tchoung-te</a></p>
</div>
</div>
<div class="project">
<img src="./public/project-manzi-mfa.png" alt="Manzi-mfa" class="project-image">
<div class="project-details">
<h3>Manzi-mfa</h3>
<p>Objectif: Apporter aux étudiants en recherche de stage dans l'IT les conseils et ressources pour accélérer via une plateforme en ligne leur permettant de booker 1h gratuite avec un travailleur du secteur concerné.</p>
<p>Site web: <a href="https://manzi-mfa.mongulu.cm" target="_blank">https://manzi-mfa.mongulu.cm</a></p>
<p>Code source: <a href="https://github.com/mongulu-cm/manzi-mfa" target="_blank">https://github.com/mongulu-cm/manzi-mfa</a></p>
</div>
</div>
<div class="project">
<img src="./public/projet-chama.png" alt="Chama" class="project-image">
<div class="project-details">
<h3>Chama</h3>
<p>Objectif: Fournir aux associations camerounaises en France un site web template pour leur permettre d'avoir rapidement une présence sur le web mais aussi et surtout une maintenance et un hébergement assuré par nos soins.</p>
<p>Site web: <a href="https://aci.assos.mongulu.cm/" target="_blank">https://aci.assos.mongulu.cm/</a> (projet pilote avec l' ACI: Association des Camerounais de l'Isère)</p>
<p>Code source: <a href="https://github.com/mongulu-cm/chama" target="_blank">https://github.com/mongulu-cm/chama</a></p>
</div>
</div>
</section>

<footer class="footer">
<div class="first-row-link">
<div class="links">
<a href="https://www.facebook.com/CollectifMongulu" target="_blank" class="footer-link">
<img class="footer-icon" alt="Facebook Icon" src="./public/facebook.svg">
<div class="placeholder-link">Facebook</div>
</a>
<a href="https://www.linkedin.com/company/92889961/" target="_blank" class="footer-link">
<img class="footer-icon" alt="LinkedIn Icon" src="./public/linkedin.svg">
<div class="placeholder-link">LinkedIn</div>
</a>
<a href="mailto:[email protected]" class="footer-link">
<img class="footer-icon" alt="Mail Icon" src="./public/mail.svg">
<div class="placeholder-link">[email protected]</div>
</a>
</div>
</div>
<div class="all-rights-reserved">©Tous droits réservés</div>
</footer>

</div>
</body>

</html>
114 changes: 114 additions & 0 deletions html/our-projects.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, width=device-width">
<link rel="stylesheet" href="./global.css" />
<link rel="stylesheet" href="./index.css" />
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" />
<title>Our Projects</title>
</head>

<body>
<div class="web">
<nav class="navigation">
<div class="vector-parent">
<a href="/en_index.html">
<img class="vector-icon" alt="Logo" src="./public/logo.png">
</a>
<div class="currentproject-parent">
<a href="/nos-projets.html" target="_self">
<div class="currentproject">
<img class="project-icon" alt="Project Icon" src="./public/projecticon.svg">
<div class="current-projects">Current Projects</div>
</div>
</a>
<a href="https://peertube.stream/c/mongulu/videos" target="_blank">
<div class="peertube-image">
<img class="image-5-icon" alt="PeerTube Icon" src="./public/[email protected]">
<div class="watch-videos">Video Channel</div>
<img class="peertube-image-child" alt="" src="./public/group-4.svg">
</div>
</a>
<div class="languagebutton">
<a href="/nos-projets.html">
<div class="fr-button">
<div class="fr">FR</div>
</div>
</a>
<a href="/our-projets.html">
<div class="en-button">
<div class="en">EN</div>
</div>
</a>
</div>
</div>
</div>
</nav>

<section class="projects-section">
<h2>Our Projects</h2>
<div class="project">
<img src="./public/project-mtchoun-mouh.png" alt="Mtchoun-mouh" class="project-image">
<div class="project-details">
<h3>Mtchoun-mouh</h3>
<p>Objective: To allow Cameroonian passport applicants at the Cameroonian consulate in Marseille to be automatically notified by email of its issuance instead of regularly checking the site as requested by the consulate.</p>
<p>Website: <a href="https://mtchoun-mouh.mongulu.cm/" target="_blank">https://mtchoun-mouh.mongulu.cm/</a></p>
<p>Source code: <a href="https://github.com/mongulu-cm/mtchoun-mouh" target="_blank">https://github.com/mongulu-cm/mtchoun-mouh</a></p>
</div>
</div>
<div class="project">
<img src="./public/project-tchoung-te.png" alt="Tchoung-te" class="project-image">
<div class="project-details">
<h3>Tchoung-te</h3>
<p>Objective: To allow community members to find associations near them or according to a specific theme by providing an exhaustive and interactive map of all Cameroonian associations in France.</p>
<p>Website: <a href="https://tchoung-te.mongulu.cm/" target="_blank">https://tchoung-te.mongulu.cm/</a> or <a href="https://ai.mongulu.cm" target="_blank">https://ai.mongulu.cm</a> (for the chat version)</p>
<p>Source code: <a href="https://github.com/mongulu-cm/tchoung-te" target="_blank">https://github.com/mongulu-cm/tchoung-te</a></p>
</div>
</div>
<div class="project">
<img src="./public/project-manzi-mfa.png" alt="Manzi-mfa" class="project-image">
<div class="project-details">
<h3>Manzi-mfa</h3>
<p>Objective: To provide students looking for internships in IT with advice and resources to accelerate their search through an online platform that allows them to book a free 1-hour session with a worker in the relevant sector.</p>
<p>Website: <a href="https://manzi-mfa.mongulu.cm" target="_blank">https://manzi-mfa.mongulu.cm</a></p>
<p>Source code: <a href="https://github.com/mongulu-cm/manzi-mfa" target="_blank">https://github.com/mongulu-cm/manzi-mfa</a></p>
</div>
</div>
<div class="project">
<img src="./public/projet-chama.png" alt="Chama" class="project-image">
<div class="project-details">
<h3>Chama</h3>
<p>Objective: To provide Cameroonian associations in France with a website template to allow them to quickly establish an online presence, as well as maintenance and hosting provided by us.</p>
<p>Website: <a href="https://aci.assos.mongulu.cm/" target="_blank">https://aci.assos.mongulu.cm/</a> (pilot project with ACI: Association of Cameroonians of Isère)</p>
<p>Source code: <a href="https://github.com/mongulu-cm/chama" target="_blank">https://github.com/mongulu-cm/chama</a></p>
</div>
</div>
</section>

<footer class="footer">
<div class="first-row-link">
<div class="links">
<a href="https://www.facebook.com/CollectifMongulu" target="_blank" class="footer-link">
<img class="footer-icon" alt="Facebook Icon" src="./public/facebook.svg">
<div class="placeholder-link">Facebook</div>
</a>
<a href="https://www.linkedin.com/company/92889961/" target="_blank" class="footer-link">
<img class="footer-icon" alt="LinkedIn Icon" src="./public/linkedin.svg">
<div class="placeholder-link">LinkedIn</div>
</a>
<a href="mailto:[email protected]" class="footer-link">
<img class="footer-icon" alt="Mail Icon" src="./public/mail.svg">
<div class="placeholder-link">[email protected]</div>
</a>
</div>
</div>
<div class="all-rights-reserved">©All rights reserved</div>
</footer>

</div>
</body>

</html>
Binary file removed html/peace-mini.png
View file
Binary file not shown.
Binary file added html/public/.DS_Store
View file
Binary file not shown.
Binary file added html/public/baka-hut.webp
View file
Binary file not shown.
12 changes: 12 additions & 0 deletions html/public/facebook.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit be90739

Please sign in to comment.