diff --git a/static/src/css/pylote.css b/static/src/css/pylote.css
index 8c4a1e7cd447e48caa0a2e313fcddfafebb77fe7..b3b448d32d51824ed532d43e36731e6c70bd0146 100644
--- a/static/src/css/pylote.css
+++ b/static/src/css/pylote.css
@@ -787,6 +787,7 @@ hr{
border-bottom: 1px solid #56A099;
margin-right: 3px;
margin-left: 3px;
+ width: 35px;
margin-top: 10px;
}
@@ -828,10 +829,6 @@ li.lang {
letter-spacing: 2px;
}
-.circle-home-border h6{
- font-size: 17px;
-}
-
.circle-home-border p{
color: #56A099;
font-weight: 700;
@@ -842,15 +839,15 @@ li.lang {
}
.circle-home-border{
- background-image: url("/pylote_website/static/src/img/bord-cercle.png");
+ /*background-image: url("/pylote_website/static/src/img/bord-cercle.png");
background-size: contain;
- background-repeat: no-repeat;
+ background-repeat: no-repeat;*/
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
- width: 80px;
- height: 80px;
+ width: 85px;
+ height: 85px;
position: relative;
}
@@ -891,14 +888,6 @@ li.lang {
height: 110px;
}
-#cleaner .circle-home-border h1{
- margin: 0 auto;
- text-transform: uppercase;
- font-size: 15px;
- line-height: 10px;
- font-weight: 700;
-}
-
#cleaner .circle-home{
width: 165px;
height: 165px;
@@ -1533,10 +1522,6 @@ h2.o_default_snippet_text:after{
font-size: 14px;
}
-.circle-home-border p.o_default_snippet_text{
- font-size: 11px;
-}
-
.s_carousel.s_carousel_default .carousel-control-prev-icon:before, .s_carousel.s_carousel_default .carousel-control-next-icon:before, .s_quotes_carousel.s_carousel_default .carousel-control-prev-icon:before, .s_quotes_carousel.s_carousel_default .carousel-control-next-icon:before{
color: #56A099;
}
diff --git a/static/src/img/._pictos_cleaner.png b/static/src/img/._pictos_cleaner.png
new file mode 100644
index 0000000000000000000000000000000000000000..a1cd088b420f1979d3dc5ea0ad260c3674378688
Binary files /dev/null and b/static/src/img/._pictos_cleaner.png differ
diff --git a/static/src/img/._pictos_greener.png b/static/src/img/._pictos_greener.png
new file mode 100644
index 0000000000000000000000000000000000000000..a9c43702db42d404d272da747d6d15d56630d204
Binary files /dev/null and b/static/src/img/._pictos_greener.png differ
diff --git a/static/src/img/._pictos_safer.png b/static/src/img/._pictos_safer.png
new file mode 100644
index 0000000000000000000000000000000000000000..69603610ce5b0212bdadf75bce0b8a19b6b808fd
Binary files /dev/null and b/static/src/img/._pictos_safer.png differ
diff --git a/static/src/img/pictos_cleaner.png b/static/src/img/pictos_cleaner.png
new file mode 100644
index 0000000000000000000000000000000000000000..a544f5b6eb1e6ce53dda0322c44b0dd2139b8f83
Binary files /dev/null and b/static/src/img/pictos_cleaner.png differ
diff --git a/static/src/img/pictos_greener.png b/static/src/img/pictos_greener.png
new file mode 100644
index 0000000000000000000000000000000000000000..cf3fa2200602dd09d6f072c03dd3a5f94c6387ad
Binary files /dev/null and b/static/src/img/pictos_greener.png differ
diff --git a/static/src/img/pictos_safer.png b/static/src/img/pictos_safer.png
new file mode 100644
index 0000000000000000000000000000000000000000..d4e5c499c04aa0e2091aacf4ab93e409f5633ce4
Binary files /dev/null and b/static/src/img/pictos_safer.png differ
diff --git a/views/home.xml b/views/home.xml
index c7d612df569ab9b7e1da23a71edb7061d219e2b1..2556563485fdeb49021b2636dfeb97964ae33a8e 100644
--- a/views/home.xml
+++ b/views/home.xml
@@ -19,7 +19,7 @@
<a id="cleaner-home" href="#">
<div class="circle-top">
<div class="circle-home-border">
- <h6>Cleaner</h6>
+ <img src="/pylote_website/static/src/img/pictos_cleaner.png" class="img img-responsive" />
</div>
</div>
<div class="circle-home-text">
@@ -33,7 +33,7 @@
<a id="safer-home" href="#">
<div class="circle-top">
<div class="circle-home-border">
- <h6>Safer</h6>
+ <img src="/pylote_website/static/src/img/pictos_safer.png" class="img img-responsive" />
</div>
</div>
<div class="circle-home-text">
@@ -47,7 +47,7 @@
<a id="greener-home" href="#">
<div class="circle-top">
<div class="circle-home-border">
- <h6>Greener</h6>
+ <img src="/pylote_website/static/src/img/pictos_greener.png" class="img img-responsive" />
</div>
</div>
<div class="circle-home-text">
@@ -62,24 +62,24 @@
<div class="d-block d-sm-none-pylote container">
<div class="d-flex pt-5 pb-5">
<div class="home-bloc">
- <div class="circle-home-border circle-home-border-mobil">
- <!-- <div class="circle-home circle-home-mobile"> -->
- <p><a id="cleaner-home-mobil" href="#">Cleaner</a></p>
- <!-- </div> -->
+ <div class="circle-home-border ">
+ <a id="cleaner-home-mobil" href="#">
+ <img src="/pylote_website/static/src/img/pictos_cleaner.png" class="img img-responsive" />
+ </a>
</div>
</div>
<div class="home-bloc">
- <div class="circle-home-border circle-home-border-mobil">
- <!-- <div class="circle-home circle-home-mobile"> -->
- <p><a id="safer-home-mobil" href="#">Safer</a></p>
- <!-- </div> -->
+ <div class="circle-home-border">
+ <a id="safer-home-mobil" href="#">
+ <img src="/pylote_website/static/src/img/pictos_safer.png" class="img img-responsive" />
+ </a>
</div>
</div>
<div class="home-bloc">
- <div class="circle-home-border circle-home-border-mobil">
- <!-- <div class="circle-home circle-home-mobile"> -->
- <p><a id="greener-home-mobil" href="#">Greener</a></p>
- <!-- </div> -->
+ <div class="circle-home-border">
+ <a id="greener-home-mobil" href="#">
+ <img src="/pylote_website/static/src/img/pictos_greener.png" class="img img-responsive" />
+ </a>
</div>
</div>
</div>
@@ -299,7 +299,7 @@
<div id="cleaner" class="pt-5 pb-5">
<div class="container">
<div class="circle-home-border mb-5">
- <h1><a id="modal-close-cleaner" href="#">Cleaner</a></h1>
+ <a id="modal-close-cleaner" href="#"><img src="/pylote_website/static/src/img/pictos_cleaner.png" class="img img-responsive" /></a>
</div>
<div class="row pt-5 pb-4">
<div class="col">
@@ -408,7 +408,7 @@
<div id="cleaner" class="pt-5 pb-5">
<div class="container">
<div class="circle-home-border mb-5">
- <h1><a id="modal-close-safer" href="#">Safer</a></h1>
+ <a id="modal-close-safer" href="#"><img src="/pylote_website/static/src/img/pictos_safer.png" class="img img-responsive" /></a>
</div>
<div class="row pt-5 pb-4">
<div class="col">
@@ -452,7 +452,7 @@
<div id="cleaner" class="pt-5 pb-5">
<div class="container">
<div class="circle-home-border mb-5">
- <h1><a id="modal-close-greener" href="#">Greener</a></h1>
+ <a id="modal-close-greener" href="#"><img src="/pylote_website/static/src/img/pictos_greener.png" class="img img-responsive" /></a>
</div>
<div class="row pt-5 pb-4">
<div class="col">
diff --git a/views/snippets.xml b/views/snippets.xml
index 8eebbfc579b52ae54e19267b452811dbf9861ffa..0a15afc167e342a8d8dd0b8a58c228ff8304cacc 100644
--- a/views/snippets.xml
+++ b/views/snippets.xml
@@ -24,7 +24,7 @@
<div class="carousel-right">
<div class="carousel-right-inner-border carousel-right-inner">
<div class="circle-home-border">
- <p>Cleaner</p>
+ <img src="/pylote_website/static/src/img/pictos_cleaner.png" class="img img-responsive" />
</div>
<div class="carousel-text-right-inner">
<p>We maintain microbiological hygiene until the use</p>
@@ -32,16 +32,15 @@
</div>
<div class="carousel-right-inner-border carousel-right-inner">
<div class="circle-home-border">
- <p>Safer</p>
- </div>
+ <img src="/pylote_website/static/src/img/pictos_safer.png" class="img img-responsive" />
+ </div>
<div class="carousel-text-right-inner">
<p>We remove preservatives up to 0%</p>
</div>
</div>
<div class="carousel-right-inner">
<div class="circle-home-border">
- <p>Greener</p>
-
+ <img src="/pylote_website/static/src/img/pictos_greener.png" class="img img-responsive" />
</div>
<div class="carousel-text-right-inner">
<p>Lighter and recyclable</p>