Update about $ contact

public/stylesheets/style.css

@@ -16,12 +16,6 @@ body {
   background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px;
 }
 
-@media (hover: none) and (pointer: coarse) {
-  body {
-    font-size: xx-large;
-  }
-}
-
 .card {
   display: flex;
   flex-direction: column;
@@ -115,17 +109,22 @@ a {
   right: 0;
   height: max-content;
   width: max-content;
+  max-height: 100%;
+  max-width: 90%;
 }
 
 .images {
   display: flex;
   justify-content: space-around;
+  flex-wrap: wrap;
+  overflow-y: auto;
 }
 
 .images>div {
   display: flex;
   align-items: center;
   flex-direction: column;
+  margin: 1em;
 }
 
 .images img {
@@ -159,3 +158,9 @@ p.before-link a::before {
 .sandwich {
   margin-left: 1em;
 }
+
+@media (hover: none) and (pointer: coarse) {
+  body {
+    font-size: xx-large;
+  }
+}

views/index.pug

@@ -49,16 +49,40 @@ block content
     p This software respond to the COVID-19 health crisis for the following students' offices food supply
     div.images
       div
-        img(src="images/logoInfo.png")
-        p IT student office
+        img(src="images/logoBio.png")
+        p Bio student office
+      div
+        img(src="images/logoChimie.png")
+        p Chemical student office
       div
         img(src="images/logoGC.png")
         p Civil engineering student office
+      div
+        img(src="images/logoGCGP.png")
+        p Chemical and process engineering student office
+      div
+        img(src="images/logoGEA.png")
+        p Management of companies and administrations student office
+      div
+        img(src="images/logoInfo.png")
+        p IT student office
     p.before-link Made with ❤️ by
       a(href="https://www.linkedin.com/in/florian-charlaix" target="_blank") Florian Charlaix
   div#contact.card.hide
     h1 Contact
-    p.before-link Order issue
-      a(href="") test@test.fr
+    p.before-link Order issue:
+      a(href="mailto: ") test@test.fr
+    p.before-link Bio student office:
+      a(href="mailto: ")
+    p.before-link Chemical student office:
+      a(href="mailto: ")
+    p.before-link Civil engineering student office:
+      a(href="mailto: ")
+    p.before-link Chemical and process engineering student office:
+      a(href="mailto: bde.gcgp.lyon1@gmail.com") bde.gcgp.lyon1@gmail.com
+    p.before-link Management of companies and administrations student office:
+      a(href="mailto: ")
+    p.before-link IT student office:
+      a(href="mailto: contact@bde-info.org") contact@bde-info.org
 
   script(src="javascripts/index.js")