[UPD] minor styling changes ✨

front/src/App.vue

@@ -2,9 +2,9 @@
 <div id="app">
   <div v-show="!hide_warning" id="mobile-warning">
     <p>⚠️ 🖥 ⚠️<br>
-      L'ergonomie de cette application a tout d'abord été pensée pour un usage sur desktop.
+      L'ergonomie de cette application a tout d'abord été pensée pour un usage sur ordinateur.
       Pour une meilleure expérience, nous vous recommandons d'utiliser l'impactometre
-      sur un support avec une plus grande surface d'affichage.
+      sur un support avec une plus grande surface d'affichage :)
       <br><br>
       <a href="#" @click.prevent="hide_warning = true">Continuer tout de même ➡️</a>
     </p>
@@ -123,9 +123,6 @@ export default {
   height: 92vh;
 }
 
-main {
-}
-
 .scenarios {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;

front/src/components/Scenario.vue

@@ -289,26 +289,25 @@ export default {
 </script>
 
 <style>
-.scenarios {
-}
-
-.scenario {
-  margin: 0 10px;
-  min-width: 250px;
-}
 
 /*
  *    SCENARIO-FULL
  */
 
+.scenario {
+  margin: 0 20px;
+}
+
 .scenario-full {
   height: auto;
-  min-height: 80%;
-  margin: 30px 10px;
+  min-width: 241px;
+  min-height: 90%;
+  margin: 30px 0;
   border-radius: 15px;
   box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
   /* padding-bottom:25px; */
 }
+
 .scenario-full .scenario-header {
   border-radius: 15px 15px 0 0;
   height: 60px;
@@ -377,9 +376,11 @@ export default {
 /*
  *    SCENARIO-SECTIONS AND SCENARIO-LINES
  */
-.scenario-section {
-  margin-bottom: 0;
+
+.scenario-body {
+  margin-top: 20px;
 }
+
 .scenario-section-header {
   margin: 10px;
   font-weight: bold;
@@ -479,13 +480,11 @@ select.select-journey {
 /*
  *    SCENARIO-EMPTY
  */
-.scenario-body {
-  margin-top: 20px;
-}
+
 .scenario-empty {
-  min-width: 230px;
-  min-height: 80%;
-  margin: 30px 10px;
+  min-width: 241px;
+  min-height: 90%;
+  margin: 30px 0;
   border-radius: 15px;
   box-sizing: border-box;
   border: 1px dashed #000000;