Change CSS stuff in home page and products page, remove style= in twig template for style.css

public/css/products.css

@@ -0,0 +1,82 @@
+.container_main {
+  background-color: #2E2E2E;
+}
+.tableau {
+  width:100%;
+  background-color: white;
+  table-layout: fixed;
+  border-collapse: collapse;
+  /* border-spacing: 1px; // pour contrer les style de base */
+}
+/* Entête */
+.tableau th {
+  border-spacing: 0;
+  border-collapse: collapse;
+  padding: 0rem;
+  text-align: center;
+  border-left: lightgray 1px solid;
+  background-color:#999690;
+  color:#fff;
+}
+.tableau .colonne_image {
+  padding: 0; !important;
+}
+.tableau td {
+  border-bottom: solid 1px black;
+  border-left: lightgray 1px solid;
+  padding-left: 0.7rem;
+}
+.align_droite {
+
+  text-align: right;
+  padding-right: 2rem;
+}
+.breadcrumb {
+    font-size: 1rem;
+}
+
+.toggle_radio {
+    position: relative;
+    background: rgba(0,0,0,.1);
+    margin: -3px auto 4px 10px;
+    overflow: hidden;
+    padding: 0 !important;
+    border-radius: 50px;
+    height: 28px;
+    width: 215px;
+}
+.toggle_radio > * {
+    float: left;
+}
+.toggle_radio input[type=radio]{
+    display: none;
+}
+.toggle_radio label{
+    color: rgba(0,0,0,.9);
+    z-index: 0;
+    display: block;
+    width: 100px;
+    height: 20px;
+    margin: 3px 3px;
+    border-radius: 50px;
+    cursor: pointer;
+    z-index: 1;
+    text-align: center;
+}
+.toggle_option_slider{
+    width: 100px;
+    height: 20px;
+    position: absolute;
+    top: 4px;
+    border-radius: 50px;
+    transition: all .4s ease;
+}
+
+#first_toggle:checked ~ .toggle_option_slider{
+    background: rgba(0,0,0,.3);
+    left: 3px;
+}
+#second_toggle:checked ~ .toggle_option_slider{
+    background: rgba(0,0,0,.3);
+    left: 109px;
+}

public/css/style.css

@@ -19,10 +19,18 @@ btn-custom {
     -webkit-font-smoothing: antialiased;
 }
 
+#logo_home {
+  width:30rem;
+  margin: 0 auto;
+  margin-bottom: 10px;
+  text-align: center;
+}
+
 img {
   max-width: 100%;
   height: auto;
 }
+
 #la_page {
     text-align: center;
     width: 1174px;
@@ -30,6 +38,7 @@ img {
     height:auto;
     margin-left: auto;
     margin-right: auto;
+    opacity:0.9;
 }
 
 #la_page a {
@@ -58,6 +67,7 @@ li {
   background-size: 100% auto;
   font-family: Bree Serif, Arial, sans-serif;
   font-size: 14px;
+  opacity:0.97;
 }
 header.header {
   width: 389px;
@@ -98,7 +108,20 @@ header.header img {
 }
 .container {
   font-family: Arial, sans-serif;
+  height:auto; width:28rem;
+  text-align:center;border: 0px
 }
+
+.row {
+  width:28rem;
+  margin-left: -5.1rem;
+}
+
+.home_map {
+  font-size:1.2rem;
+  font-weight:bold;
+}
+
 .profil_user {
     height: 400px;
     width: 900px;
@@ -169,7 +192,7 @@ header.header img {
 }
 
 body.loading .loadingPubkey {
-    overflow: hidden;   
+    overflow: hidden;
     display: block;
 }
 
@@ -268,3 +291,89 @@ body.loading .loadingPubkey {
       }
 
 }
+
+/* Fix products.css */
+
+
+.container_main {
+  background-color: #2E2E2E;
+}
+.tableau {
+  width:100%;
+  background-color: white;
+  table-layout: fixed;
+  border-collapse: collapse;
+  /* border-spacing: 1px; // pour contrer les style de base */
+}
+/* Entête */
+.tableau th {
+  border-spacing: 0;
+  border-collapse: collapse;
+  padding: 0rem;
+  text-align: center;
+  border-left: lightgray 1px solid;
+  background-color:#999690;
+  color:#fff;
+}
+.tableau .colonne_image {
+  padding: 0; !important;
+}
+.tableau td {
+  border-bottom: solid 1px black;
+  border-left: lightgray 1px solid;
+  padding-left: 0.7rem;
+}
+.align_droite {
+
+  text-align: right;
+  padding-right: 2rem;
+}
+.breadcrumb {
+    font-size: 1rem;
+}
+
+.toggle_radio {
+    position: relative;
+    background: rgba(0,0,0,.1);
+    margin: -3px auto 4px 10px;
+    overflow: hidden;
+    padding: 0 !important;
+    border-radius: 50px;
+    height: 28px;
+    width: 215px;
+}
+.toggle_radio > * {
+    float: left;
+}
+.toggle_radio input[type=radio]{
+    display: none;
+}
+.toggle_radio label{
+    color: rgba(0,0,0,.9);
+    z-index: 0;
+    display: block;
+    width: 100px;
+    height: 20px;
+    margin: 3px 3px;
+    border-radius: 50px;
+    cursor: pointer;
+    z-index: 1;
+    text-align: center;
+}
+.toggle_option_slider{
+    width: 100px;
+    height: 20px;
+    position: absolute;
+    top: 4px;
+    border-radius: 50px;
+    transition: all .4s ease;
+}
+
+#first_toggle:checked ~ .toggle_option_slider{
+    background: rgba(0,0,0,.3);
+    left: 3px;
+}
+#second_toggle:checked ~ .toggle_option_slider{
+    background: rgba(0,0,0,.3);
+    left: 109px;
+}

public/models/readRecords.php

@@ -67,7 +67,7 @@
             if (file_exists($imagep) && $row['image']) {
                 $data .= '<td><img src="/uploads/products/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
             } else {
-                $data .= '<td><img src="/uploads/default.png" width="50" height="50" /></td>';
+                $data .= '<td><img src="/uploads/default.png" width="30" height="30" /></td>';
             }
             $data .= '<td>'.$vendeur_format.'</td>';
             $data .= '<td>'.$cle_pub_format.'</td>';

public/models/readRecords2.php

@@ -59,7 +59,7 @@
 			if (file_exists($imagep) && $row['image']) {
 					$data .= '<td><img src="/uploads/recherches/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
 			} else {
-					$data .= '<td><img src="/uploads/default.png" width="50" height="50" /></td>';
+					$data .= '<td><img src="/uploads/default.png" width="30" height="30" /></td>';
 			}
 			$data .= '<td>'.$vendeur_format.'</td>';
 			$data .= '<td>'.$pubkeyShort.'...</td>';

src/Gmarche/views/index.twig

@@ -4,9 +4,9 @@
     Ğ1-Marché : Régions {% if page > 1 %}, page {{ page }} {% endif %}
 {% endblock %}
 {% block body %}
-    <div class="container" style="height:auto; width:28rem; text-align:center;border: 0px">
+    <div class="container">
-        <img src="\images\logo_home.jpg" style="width:22rem;"/>
+        <img id="logo_home" src="\images\logo_home.jpg"/>
-        <div class="row card" style="width:28rem;margin-left: -5.1rem;">
+        <div class="row card">
             <ul class="list-group list-group-flush">
                 <div class="mapcontainer">
                     <div class="map">
@@ -42,69 +42,69 @@
                 'region-84': {
                     value: "Auvergne-Rhône-Alpes",
                     href: "france/auvergne-rhone-alpes",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Auvergne-Rhône-Alpes</span>"}
+                    tooltip: {content: "<span class='home_map'> Auvergne-Rhône-Alpes</span>"}
                 },
                 'region-53': {
                     value: "Bretagne",
                     href: "france/bretagne",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Bretagne</span>"}
+                    tooltip: {content: "<span class='home_map'>Bretagne</span>"}
                 },
                 'region-27': {
                     value: "Bourgogne-Franche-Comté",
                     href: "france/bourgogne-franche-comte",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Bourgogne-Franche-Comté</span>"}
+                    tooltip: {content: "<span class='home_map'>Bourgogne-Franche-Comté</span>"}
                 },
                 'region-24': {
                     value: "Centre-Val de Loire",
                     href: "france/centre-val-de-loire",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Centre-Val de Loire</span>"}
+                    tooltip: {content: "<span class='home_map'>Centre-Val de Loire</span>"}
                 },
                 'region-94': {
                     value: "Corse",
                     href: "france/corse",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Corse</span>"}
+                    tooltip: {content: "<span class='home_map'>Corse</span>"}
                 },
                 'region-44': {
                     value: "Grand-Est",
                     href: "france/grand-est",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Grand-Est</span>"}
+                    tooltip: {content: "<span class='home_map'>Grand-Est</span>"}
                 },
                 'region-32': {
                     value: "Hauts-de-France",
                     href: "france/hauts-de-france",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Hauts-de-France</span>"}
+                    tooltip: {content: "<span class='home_map'>Hauts-de-France</span>"}
                 },
                 'region-11': {
                     value: "Ile-de-France",
                     href: "france/ile-de-france",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Ile-de-France</span>"}
+                    tooltip: {content: "<span class='home_map'>Ile-de-France</span>"}
                 },
                 'region-28': {
                     value: "Normandie",
                     href: "france/normandie",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Normandie</span>"}
+                    tooltip: {content: "<span class='home_map'>Normandie</span>"}
                 },
                 'region-75': {
                     value: "Nouvelle-Aquitaine",
                     href: "france/nouvelle-aquitaine",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Nouvelle-Aquitaine</span>"}
+                    tooltip: {content: "<span class='home_map'>Nouvelle-Aquitaine</span>"}
                 },
                 'region-76': {
                     value: "Occitanie",
                     href: "france/occitanie",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Occitanie</span>"}
+                    tooltip: {content: "<span class='home_map'>Occitanie</span>"}
                 },
                 'region-52': {
                     value: "Pays de la Loire",
                     href: "france/pays-de-la-loire",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Pays de la Loire</span>"}
+                    tooltip: {content: "<span class='home_map'>Pays de la Loire</span>"}
                 },
                 'region-93': {
                     value: "Provence-Alpes-Côte d'Azur",
                     href: "france/provence-alpes-cote-d-azur",
-                    tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Provence-Alpes-Côte d'Azur</span>"}
+                    tooltip: {content: "<span class='home_map'>Provence-Alpes-Côte d'Azur</span>"}
                 }
             }
         });
     </script>
-{% endblock %}
+{% endblock %}

src/Product/views/admin/products/index.twig

@@ -2,91 +2,11 @@
 {% extends 'layout.twig' %}
 {% block title "Ğ1-Marché - Produits" %}
 
+
 {% block body %}
-  <style>
+    <link href="css/style.css" rel="stylesheet">
-    .tableau {
-      width:100%;
-      background-color: white;
-      table-layout: fixed;
-      border-collapse: collapse;
-      /* border-spacing: 1px; // pour contrer les style de base */
-    }
-    /* Entête */
-    .tableau th {
-      border-spacing: 0;
-      border-collapse: collapse;
-      padding: 0rem;
-      text-align: center;
-      border-left: lightgray 1px solid;
-      background-color:#999690;
-      color:#fff;
-    }
-    .tableau .colonne_image {
-      padding: 0; !important;
-    }
-    .tableau td {
-      border-bottom: solid 1px black;
-      border-left: lightgray 1px solid;
-      padding-left: 0.7rem;
-    }
-    .align_droite {
-
-      text-align: right;
-      padding-right: 2rem;
-    }
-    .breadcrumb {
-        font-size: 1rem;
-    }
-
-    .toggle_radio {
-        position: relative;
-        background: rgba(0,0,0,.1);
-        margin: -3px auto 4px 10px;
-        overflow: hidden;
-        padding: 0 !important;
-        border-radius: 50px;
-        height: 28px;
-        width: 215px;
-    }
-    .toggle_radio > * {
-        float: left;
-    }
-    .toggle_radio input[type=radio]{
-        display: none;
-    }
-    .toggle_radio label{
-        color: rgba(0,0,0,.9);
-        z-index: 0;
-        display: block;
-        width: 100px;
-        height: 20px;
-        margin: 3px 3px;
-        border-radius: 50px;
-        cursor: pointer;
-        z-index: 1;
-        text-align: center;
-    }
-    .toggle_option_slider{
-        width: 100px;
-        height: 20px;
-        position: absolute;
-        top: 4px;
-        border-radius: 50px;
-        transition: all .4s ease;
-    }
-
-    #first_toggle:checked ~ .toggle_option_slider{
-        background: rgba(0,0,0,.3);
-        left: 3px;
-    }
-    #second_toggle:checked ~ .toggle_option_slider{
-        background: rgba(0,0,0,.3);
-        left: 109px;
-    }
-
-  </style>
     <script type="text/javascript" src="/js/script.js"></script>
-    <div class="container_main" style="background-color: black;">
+    <div class="container_main">
         <!-- Fil d'Ariane -->
         <div class="breadcrumbs" >
             <nav aria-label="breadcrumb">

src/Product/views/admin/recherches/index.twig

@@ -3,91 +3,9 @@
 {% block title "Ğ1-Marché - Recherches" %}
 
 {% block body %}
-  <style>
+    <link href="css/style.css" rel="stylesheet">
-    .tableau {
-      width:100%;
-      background-color: white;
-      table-layout: fixed;
-      border-collapse: collapse;
-      /* border-spacing: 1px; // pour contrer les style de base */
-    }
-    /* Entête */
-    .tableau th {
-      border-spacing: 0;
-      border-collapse: collapse;
-      padding: 0rem;
-      text-align: center;
-      border-left: lightgray 1px solid;
-      background-color:#999690;
-      color:#fff;
-    }
-    .tableau .colonne_image {
-      padding: 0; !important;
-    }
-    .tableau td {
-      border-bottom: solid 1px black;
-      border-left: lightgray 1px solid;
-      padding-left: 0.7rem;
-    }
-    .align_droite {
-
-      text-align: right;
-      padding-right: 2rem;
-    }
-    .breadcrumb {
-        font-size: 1rem;
-    }
-
-    .toggle_radio {
-        position: relative;
-        background: rgba(0,0,0,.1);
-        margin: -3px auto 4px 10px;
-        overflow: hidden;
-        padding: 0 !important;
-        border-radius: 50px;
-        height: 28px;
-        width: 215px;
-    }
-    .toggle_radio > * {
-        float: left;
-    }
-    .toggle_radio input[type=radio]{
-        display: none;
-    }
-    .toggle_radio label{
-       /* font: 90%/1.618 "Source Sans Pro";*/
-        color: rgba(0,0,0,.9);
-        z-index: 0;
-        display: block;
-        width: 100px;
-        height: 20px;
-        margin: 3px 3px;
-        border-radius: 50px;
-        cursor: pointer;
-        z-index: 1;
-        text-align: center;
-    }
-    .toggle_option_slider{
-        width: 100px;
-        height: 20px;
-        position: absolute;
-        top: 4px;
-        border-radius: 50px;
-        transition: all .4s ease;
-    }
-
-    #first_toggle:checked ~ .toggle_option_slider{
-        background: rgba(0,0,0,.3);
-        left: 3px;
-    }
-    #second_toggle:checked ~ .toggle_option_slider{
-        background: rgba(0,0,0,.3);
-        left: 109px;
-    }
-
-  </style>
     <script type="text/javascript" src="/js/script.js"></script>
-    <div class="container_main" style="background-color: black;">
+    <div class="container_main">
         <!-- Fil d'Ariane -->
         <div class="breadcrumbs" >
             <nav aria-label="breadcrumb">