Généralisation du style pour les pastilles et modification de l'emplacement du bouton et ajout d'une marge pied de page

fichiers/css/personalisation.css

@@ -1,31 +1,32 @@
-body{
+body {
-  background-color: #eee
+  background-color: #eee;
+  margin-bottom: 100px;
 }
 
-#contenu_auth{
+#contenu_auth {
-  max-width:380px;
+  max-width: 380px;
-  margin:auto;
+  margin: auto;
 }
 
-#contenu_auth #envoyer{
+#contenu_auth #envoyer {
-  width:100%;
+  width: 100%;
 }
 
-#logo-accueil{
+#logo-accueil {
-  text-align:center;
+  text-align: center;
-  margin:50px;
+  margin: 50px;
 }
 
-#logo-accueil img{
+#logo-accueil img {
   width: 200px;
 }
 
-#logo-accueil h1{
+#logo-accueil h1 {
-  color:#FFF;
+  color: #FFF;
   font-size: 40pt;
 }
 
-.alert img{
+.alert img {
   height: 1.5em;
   margin-right: 0.3em;
 }
@@ -36,8 +37,8 @@ body{
 
 .bouton-flotant {
   position: fixed;
-  bottom: 40px;
+  bottom: 20px;
-  right: 40px;
+  right: 20px;
   background-color: #0d6efd;
   color: white;
   border-radius: 50%;
@@ -45,3 +46,17 @@ body{
   height: 60px;
   border: 2px solid #0d6efd;
 }
+
+.contour-pastille {
+  margin-top: 5px;
+}
+
+.interieur-pastille {
+  margin: 10px;
+}
+
+.titre-pastille {
+  width: 100%;
+  text-align: center;
+  padding-top: 4px;
+}

services/gestion/alias_virtuels.php

@@ -103,15 +103,15 @@ _HEREDOC_;
 				}
 				echo <<<_HEREDOC_
 					<div class="col-md-6 col-xl-4">
-						<div class="card" style="margin-top:5px;">
+						<div class="card contour-pastille">
-							<div class="d-flex" style="margin:10px">
+							<div class="d-flex interieur-pastille">
 								<div class="champ-interrupteur">
 									<input type="radio" name="{$alias_virtuels_valeurs['id']}" id="allumer{$alias_virtuels_valeurs['id']}" value="1" {$etat_interrupteur_allumer}>
 									<label for="allumer{$alias_virtuels_valeurs['id']}" class="interrupteur-allumer"></label>
 									<input type="radio" name="{$alias_virtuels_valeurs['id']}" id="eteint{$alias_virtuels_valeurs['id']}" value="0" {$etat_interrupteur_eteint}>
 									<label for="eteint{$alias_virtuels_valeurs['id']}" class="interrupteur-eteint"></label>
 								</div>
-								<div style="width:100%;text-align: center;padding-top: 4px;">
+								<div class="titre-pastille">
 								<span>{$alias_virtuels_valeurs['courriel']}</span>
 								</div>
 								<div>