Refonte graphique de la page d'accueil

This commit is contained in:
Divlo 2019-10-06 16:58:20 +02:00
parent f191f94f20
commit 7b66463c73
6 changed files with 34 additions and 26 deletions

View File

@ -1,10 +1,10 @@
# FunctionProject
![Badge Status](https://cloud.divlo.fr/public_files/others/Trash/under_dev.svg)
[À propos de Divlo](https://divlo.fr/) | [Youtube](https://www.youtube.com/c/Divlo) | [Twitch](https://www.twitch.tv/divlofr) | [Twitter](https://twitter.com/Divlo_FR) | [Steam](https://steamcommunity.com/id/Divlo/) | [Discord](https://discordapp.com/invite/WWK2JPz)
[À propos de Divlo](https://divlo.fr/) | [Youtube](https://www.youtube.com/c/Divlo) | [Twitch](https://www.twitch.tv/divlo) | [Twitter](https://twitter.com/Divlo_FR) | [Steam](https://steamcommunity.com/id/Divlo/) | [Discord](https://discordapp.com/invite/WWK2JPz)
## À propos de FunctionProject
[FunctionProject](https://function.divlo.fr/) est un projet créé par [Divlo](https://divlo.fr/) qui a pour but de rassembler plein de mini-programme (fonctions JavaScript) permettant de faire plusieurs choses comme **savoir la météo**, générer un **nombre aléatoire**, etc.
[FunctionProject](https://function.divlo.fr/) est un projet créé par [Divlo](https://divlo.fr/) qui a pour but de rassembler plein de mini-programme permettant de faire plusieurs choses comme **savoir la météo**, générer un **nombre aléatoire**, etc.
Le projet est disponible sur [function.divlo.fr](https://function.divlo.fr/).

View File

@ -83,7 +83,7 @@ header {
}
.function-list-title {
width: 85%;
padding-bottom: 1em;
padding-bottom: 0.6em;
margin: auto;
}
.function-list-image {

BIN
img/Feedback-Formulaire.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

BIN
img/GitHub.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 120 KiB

View File

@ -6,18 +6,26 @@
<!-- Page Content -->
<div class="container">
<h1>Bienvenue sur <span class="important">FunctionProject</span>! 🎉</h1>
<p class="mt-5">FunctionProject est un projet créé par <a href="https://divlo.fr/" target="_blank">Divlo</a> qui a pour but de rassembler plein de mini-programme (fonctions JavaScript) permettant de faire plusieurs choses comme <b>savoir la météo</b>, générer un <b>nombre aléatoire</b>, etc.
<br> <br>
<div><p class="text-center">
<a href="./views/function-list.php">Cliquez ici pour accéder à la liste des fonctions.</a>
<br> <br>
L'intégralité du <a target="_blank" href="https://github.com/Divlo/FunctionProject">code source</a> de ce site est disponible sur <a href="https://github.com/Divlo">mon profil GitHub</a> <i class="fab fa-github"></i>.
<br>
Je suis débutant en programmation donc si je commets une erreur dans le code, n'hésitez pas à me le faire savoir <i class="fas fa-code"></i>.
<br> <br>
Vous pouvez m'envoyer vos avis, suggestion d'ajouts, éventuel bug/problème grâce à ce <a href="https://docs.google.com/forms/d/1NliUWi3lntHDM42Td0C47J0cZKgnYilxT_0UcdmVaog/" target="_blank">Feedback Formulaire</a> 📝.
</p></div>
<div class="row pb-5">
<h1>Bienvenue sur <span class="important">FunctionProject</span> <i class="fas fa-file-code"></i></h1>
<p class="pt-4 mx-auto"><a href="./views/function-list.php">Liste de Mini-programme</a> permettant de <b>savoir la météo</b>, générer un <b>nombre aléatoire</b>, etc.</p>
</div>
<div class="row">
<div class="col-sm-12 col-md-6 pb-4">
<div class="text-center pb-5">
<h2 class="function-list-title"><a target="_blank" href="https://github.com/Divlo/FunctionProject">Code Source :</a></h2>
<a target="_blank" href="https://github.com/Divlo/FunctionProject"><img class="function-list-image" src="/img/GitHub.png" alt=""></a>
<p class="function-list-description">Code source disponible sur <a target="_blank" href="https://github.com/Divlo">mon profil GitHub</a> <i class="fab fa-github"></i>.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="text-center pb-5">
<h2 class="function-list-title"><a target="_blank" href="https://docs.google.com/forms/d/1NliUWi3lntHDM42Td0C47J0cZKgnYilxT_0UcdmVaog/">Donnez votre avis :</a></h2>
<a target="_blank" href="https://docs.google.com/forms/d/1NliUWi3lntHDM42Td0C47J0cZKgnYilxT_0UcdmVaog/"><img class="function-list-image" src="/img/Feedback-Formulaire.png" alt=""></a>
<p class="function-list-description">Vous pouvez m'envoyer votre avis sur le projet grâce au <a href="https://docs.google.com/forms/d/1NliUWi3lntHDM42Td0C47J0cZKgnYilxT_0UcdmVaog/" target="_blank">Feedback Formulaire</a> 📝.</p>
</div>
</div>
</div>
</div>
<!-- Footer -->

View File

@ -12,14 +12,14 @@
<div class="row pt-4">
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/weatherRequest.php">Météo</a></h2>
<a href="./function-views/weatherRequest.php"><img class="function-list-image" src="/img/function-image/weatherRequest.png" alt=""></a>
<p class="function-list-description">Affiche la météo et l'heure local selon la ville.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/randomNumber.php">Nombre aléatoire</a></h2>
<a href="./function-views/randomNumber.php"><img class="function-list-image" src="/img/function-image/randomNumber.png" alt=""></a>
<p class="function-list-description">Génère un nombre aléatoire entre un minimum inclus et un maximum inclus.</p>
@ -29,14 +29,14 @@
<div class="row">
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/calculateAge.php">Quelle âge avez-vous ?</a></h2>
<a href="./function-views/calculateAge.php"><img class="function-list-image" src="/img/function-image/calculateAge.png" alt=""></a>
<p class="function-list-description">Calcule l'âge de quelqu'un selon la date de naissance.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/convertTemperature.php">Conversion de Température</a></h2>
<a href="./function-views/convertTemperature.php"><img class="function-list-image" src="/img/function-image/convertTemperature.png" alt=""></a>
<p class="function-list-description">Convertit des Degré Celsius en Degré Fahrenheit et l'inverse aussi.</p>
@ -46,14 +46,14 @@
<div class="row">
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/convertDistance.php">Conversion de Distance</a></h2>
<a href="./function-views/convertDistance.php"><img class="function-list-image" src="/img/function-image/convertDistance.png" alt=""></a>
<p class="function-list-description">Convertit la longueur (distance) avec les unités allant de picomètre au Téramètre.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/filterStudents.php">Trie les prénoms par leur première lettre</a></h2>
<a href="./function-views/filterStudents.php"><img class="function-list-image" src="/img/function-image/filterStudents.png" alt=""></a>
<p class="function-list-description">Affiche uniquement les prénoms (qui sont dans la liste) qui commence par la lettre souhaitée.</p>
@ -63,14 +63,14 @@
<div class="row">
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/randomQuote.php">Générateur de citation</a></h2>
<a href="./function-views/randomQuote.php"><img class="function-list-image" src="/img/function-image/randomQuote.png" alt=""></a>
<p class="function-list-description">Génère aléatoirement une citation ou un proverbe.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/convertCurrency.php">Conversion de devise</a></h2>
<a href="./function-views/convertCurrency.php"><img class="function-list-image" src="/img/function-image/convertCurrency.png" alt=""></a>
<p class="function-list-description">Convertis une valeur dans une devise dans une autre devise.</p>
@ -80,14 +80,14 @@
<div class="row">
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/convertEncoding.php">Conversion des Encodages de caractères</a></h2>
<a href="./function-views/convertEncoding.php"><img class="function-list-image" src="/img/function-image/convertEncoding.png" alt=""></a>
<p class="function-list-description">Convertis des nombres de différentes bases et convertis en UTF-8.</p>
</div>
</div>
<div class="col-sm-12 col-md-6 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/convertRomanArabicNumbers.php">Conversion d'un nombre arabe en nombre romain</a></h2>
<a href="./function-views/convertRomanArabicNumbers.php"><img class="function-list-image" src="/img/function-image/convertRomanArabicNumbers.png" alt=""></a>
<p class="function-list-description">Convertis un nombre arabe en nombre romain (et l'inverse aussi).</p>
@ -97,7 +97,7 @@
<div class="row">
<div class="col-sm-12 pb-4">
<div class="feature text-center pb-5">
<div class="text-center pb-5">
<h2 class="function-list-title"><a href="./function-views/armstrongNumber.php">Nombre d'Armstrong</a></h2>
<a href="./function-views/armstrongNumber.php"><img class="function-list-image" src="/img/function-image/armstrongNumber.png" alt=""></a>
<p class="function-list-description">Vérifie si un nombre fait partie des nombres d'Armstrong ou non.</p>