Accueil et chemins relatifs

res/style.css

@@ -44,6 +44,24 @@ header {
     font-size: 2em;
 }
 
+.invite {
+    margin: 50px 0;
+    text-align: center;
+}
+
+.choix-appli-wrapper {
+    margin: 20px 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+}
+
+.choix-appli-wrapper a:link, .choix-appli-wrapper a:visited {
+    text-decoration: none;
+    color: black;
+}
+
 main {
     width: clamp(400px, 70%, 1200px);
     margin: 30px auto;
@@ -60,18 +78,30 @@ main {
     gap: 15px;
 }
 
-.resultat div {
+.resultat div, .choix-appli-wrapper div {
     padding: 15px;
     border: 1px solid #ddd;
     text-align: center;
     max-width: 500px;
 }
 
-.resultat div span {
+.choix-appli-wrapper div {
+    transition: background-color 200ms;
+}
+
+.choix-appli-wrapper div:hover {
+    background-color: #fafafa;
+}
+
+.choix-appli-wrapper div:active {
+    background-color: #eeeeee;
+}
+
+.resultat div span, .choix-appli-wrapper span {
     font-size: 2em;
 }
 
-.resultat div p {
+.resultat div p, .choix-appli-wrapper p {
     margin-top: 15px;
 }
 
@@ -84,13 +114,13 @@ main {
         width: 100vw;
     }
 
-    .resultat {
+    .resultat, .choix-appli-wrapper {
         position: static;
         flex-direction: column;
         align-items: center;
     }
 
-    .resultat div {
+    .resultat div, .choix-appli-wrapper a {
         width: clamp(300px, 60%, 700px);
     }