removed change lang button because didn't work, needs to be fixed

layouts/partials/modals_senzaparole.html

@@ -15,7 +15,26 @@
               <h2>{{ .title  | markdownify }}</h2>
               <!-- <p class="item-intro text-muted">{{ .subtitle | markdownify }}</p> -->
 
-              <div class="lang_select"></div>
+              <script>
+                function changeLang() {
+                   desc_it = document.getElementById("desc_it");
+                   desc_en = document.getElementById("desc_en");
+                   lan_sel = document.getElementById("lang_select");
+
+                   if (desc_it.style.display == "none") {
+                     desc_it.style.display = "block";
+                     desc_en.style.display = "none";
+                     lan_sel.style.backgroundImage = 'url(../img/flagit.png)';
+                   }
+                   else {
+                     desc_it.style.display = "none";
+                     desc_en.style.display = "block";
+                     lan_sel.style.backgroundImage = 'url(../img/flaguk.png)';
+                   }
+                }
+              </script>
+
+              <div id="lang_select" onclick="changeLang()"></div>
 
               <p class="desc" id="desc_en">{{ .description }}</p>
               <p class="desc" id="desc_it">{{ .descriptionIT }}</p>

static/css/vision.css

@@ -67,6 +67,17 @@ section.bg-darkest-gray {
    }
 }
 
+@keyframes appearSoftFromTop {
+   0% {
+      transform: translateY(-10%);
+      opacity: 0;
+   }
+   100% {
+      transform: translateY(0);
+      opacity: 1;
+   }
+}
+
 @keyframes appearFromLeft {
    0% {
       transform: translateX(-400%);
@@ -453,6 +464,7 @@ section h3.section-subheading {
   text-align: justify;
 }
 
+
 /*.portfolio-modal .close-modal {
    transition: all .4s;
    position: fixed;
@@ -544,14 +556,46 @@ section h3.section-subheading {
   /*background-color: #3c3c3c;
   background-image: url('../img/texture_dark.png');
   color: #fff;*/
+  /*animation: appearSoftFromTop .3s;*/
 }
 .img-centered {
    max-width: 100%;
 }
 .portfolio-modal .modal-content p {
   line-height: 1.6em;
+  animation: appearSoftFromTop .6s;
 }
+.portfolio-modal .modal-content h2 {
+  animation: appearSoftFromTop .6s;
+}
+.senzaparole #desc_it {
 
+}
+.senzaparole #desc_en {
+  display: none;
+}
+.senzaparole #lang_select {
+  height: 24px;
+  width: 24px;
+  background-image: url("../img/flagit.png");
+  background-size: cover;
+  border-radius: 15px;
+  position: absolute;
+  right: 2px;
+  top: 16px;
+  box-shadow: 0 2px 10px -3px rgba(0, 0, 0, 0.6);
+  transition: all .3s;
+  cursor: pointer;
+
+  display: none;
+}
+.senzaparole #lang_select:hover {
+  box-shadow: 0 2px 8px -1px rgba(0, 0, 0, 0.3);
+  transform: translateY(2px);
+}
+.senzaparole #lang_select:active {
+  transform: translateY(5px);
+}
 .portfolio-modal .modal-content img {
    /*box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.4);*/
    box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.35);
@@ -568,6 +612,7 @@ section h3.section-subheading {
   padding: 50px;
   margin: 40px 10px;
   background-color: #fff;
+  transition: all .4s;
   /*transform: rotate(-1deg);*/
   /*transform-origin: 50% 50%;*/
 }