Center Content each page

This commit is contained in:
Divlo 2019-08-19 01:21:00 +02:00
parent e53dc3bb91
commit 18fd18fec0
7 changed files with 80 additions and 68 deletions

View File

@ -8,9 +8,11 @@
<?php include("./incl/menu.php");?> <?php include("./incl/menu.php");?>
<!-- Page Content --> <!-- Page Content -->
<div class="container"> <div class="jumbotron d-flex align-items-center">
<h1>Erreur <span class="important">404</span></h1> <div class="container">
<p class="pt-3 text-center">Cette page n'existe pas! <a href="/index.php" class="important">Revenir à la page d'accueil ?</a></p> <h1>Erreur <span class="important">404</span></h1>
<p class="pt-3 text-center">Cette page n'existe pas! <a href="/index.php" class="important">Revenir à la page d'accueil ?</a></p>
</div>
</div> </div>
<!-- Footer --> <!-- Footer -->

View File

@ -38,9 +38,6 @@ p {
} }
/* HEADER */ /* HEADER */
header {
margin-bottom: 4%;
}
#header-container { #header-container {
padding-bottom: 0; padding-bottom: 0;
} }
@ -52,8 +49,11 @@ header {
} }
/* CONTENT */ /* CONTENT */
.container { @media (min-width: 576px) {
padding-bottom: 25px; .jumbotron {padding: 6.17rem 2rem;}
}
.jumbotron {
background-color: var(--background-color) !important;
} }
.table { .table {
color: white; color: white;

View File

@ -1,4 +1,5 @@
<footer class="text-center"> </div>
<footer class="text-center">
<a href="#" class="important"><i class="fas fa-arrow-up"></i></a> <a href="#" class="important"><i class="fas fa-arrow-up"></i></a>
<div class="realDateTime">Affichage de l'heure en temps réel : <span class="important" id="realDateTime"></span></div> <div class="realDateTime">Affichage de l'heure en temps réel : <span class="important" id="realDateTime"></span></div>
<div class="footer-text"><a href="https://divlo.fr/" target="_blank">Divlo</a> | Tous droits réservés</div> <div class="footer-text"><a href="https://divlo.fr/" target="_blank">Divlo</a> | Tous droits réservés</div>

View File

@ -15,4 +15,6 @@
</div> </div>
</div> </div>
</nav> </nav>
</header> </header>
<div class="jumbotron d-flex align-items-center">

View File

@ -25,19 +25,21 @@
</header> </header>
<!-- Page Content --> <!-- Page Content -->
<div class="container"> <div class="jumbotron d-flex align-items-center">
<h1>Bienvenue sur <span class="important">FunctionProject</span>! 🎉</h1> <div class="container">
<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. <h1>Bienvenue sur <span class="important">FunctionProject</span>! 🎉</h1>
<br> <br> <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.
<div><p class="text-center"> <br> <br>
<a href="./views/function-list.php">Cliquez ici pour accéder à la liste des fonctions.</a> <div><p class="text-center">
<br> <br> <a href="./views/function-list.php">Cliquez ici pour accéder à la liste des fonctions.</a>
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> <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>.
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> <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>.
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> 📝. <br> <br>
</p></div> 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>
</div> </div>
<!-- Footer --> <!-- Footer -->

View File

@ -8,22 +8,25 @@
<?php include("../incl/menu.php");?> <?php include("../incl/menu.php");?>
<!-- Page Content --> <!-- Page Content -->
<div class="container"> <div class="jumbotron d-flex align-items-center">
<h1><span class="important">La météo</span> :</h1> <div class="container">
<p class="pt-3 text-center">Affiche la météo et l'heure local selon la ville.</p> <h1><span class="important">La météo</span> :</h1>
<div class="form-group"> <p class="pt-3 text-center">Affiche la météo et l'heure local selon la ville.</p>
<label for="cityName">Entrez le nom d'une ville :</label> <div class="form-group">
<input name="cityName" type="text" id="cityName" placeholder="(e.g : Paris)" class="form-control"> <label for="cityName">Entrez le nom d'une ville :</label>
<br> <input name="cityName" type="text" id="cityName" placeholder="(e.g : Paris)" class="form-control">
<div class="form-row text-center"> <br>
<div class="col-12"> <div class="form-row text-center">
<button type="submit" id="submitWeatherRequest" class="btn btn-dark text-center">Envoyer</button> <div class="col-12">
<button type="submit" id="submitWeatherRequest" class="btn btn-dark text-center">Envoyer</button>
</div>
</div> </div>
<br> <br>
<p class="results text-center">La ville que vous avez rentré n'existe pas (dans l'API).</p>
</div> </div>
<br> <br>
<p class="results text-center">La ville que vous avez rentré n'existe pas (dans l'API).</p>
</div> </div>
</div> </div>
<script> <script>
$(function () { $(function () {
$("#cityName").click(function() { $("#cityName").click(function() {

View File

@ -25,39 +25,41 @@
</header> </header>
<!-- Page Content --> <!-- Page Content -->
<div class="container"> <div class="jumbotron d-flex align-items-center">
<div class="row"> <div class="container">
<h1>La liste des <span class="important">Fonctions</span> :</h1> <div class="row">
<table class="table table-bordered mt-5"> <h1>La liste des <span class="important">Fonctions</span> :</h1>
<thead> <table class="table table-bordered mt-5">
<tr> <thead>
<th scope="col">Nom</th> <tr>
<th scope="col">Description</th> <th scope="col">Nom</th>
</tr> <th scope="col">Description</th>
</thead> </tr>
<tbody> </thead>
<tr> <tbody>
<td><a href="./function-views/weatherRequest.php">Météo</a></td> <tr>
<td>Affiche la météo et l'heure local selon la ville.</td> <td><a href="./function-views/weatherRequest.php">Météo</a></td>
</tr> <td>Affiche la météo et l'heure local selon la ville.</td>
<tr> </tr>
<td><a href="./function-views/randomNumber.php">Nombre aléatoire</a></td> <tr>
<td>Génère un nombre aléatoire entre un minimum inclus et un maximum inclus.</td> <td><a href="./function-views/randomNumber.php">Nombre aléatoire</a></td>
</tr> <td>Génère un nombre aléatoire entre un minimum inclus et un maximum inclus.</td>
<tr> </tr>
<td><a href="./function-views/calculateAge.php">Quelle âge avez-vous ?</a></td> <tr>
<td>Calcule l'âge de quelqu'un selon la date de naissance.</td> <td><a href="./function-views/calculateAge.php">Quelle âge avez-vous ?</a></td>
</tr> <td>Calcule l'âge de quelqu'un selon la date de naissance.</td>
<tr> </tr>
<td><a href="./function-views/convertTemperature.php">Conversion de Température</a></td> <tr>
<td>Convertit des Degré Celsius en Degré Fahrenheit et l'inverse aussi.</td> <td><a href="./function-views/convertTemperature.php">Conversion de Température</a></td>
</tr> <td>Convertit des Degré Celsius en Degré Fahrenheit et l'inverse aussi.</td>
<tr> </tr>
<td><a href="./function-views/convertDistance.php">Conversion de Distance</a></td> <tr>
<td>Convertit la longueur (distance) avec les unités allant de picomètre au Téramètre.</td> <td><a href="./function-views/convertDistance.php">Conversion de Distance</a></td>
</tr> <td>Convertit la longueur (distance) avec les unités allant de picomètre au Téramètre.</td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
</div> </div>
</div> </div>