Ver Fonte

effet hover sur teaser laureats

ouidade há 5 dias atrás
pai
commit
5f168b2621

+ 5 - 0
web/themes/custom/eql/dist/assets/css/bundle.css

@@ -4812,6 +4812,8 @@ svg.ext {
   padding: 0.5rem;
   padding-right: 1rem;
   padding-left: 1rem;
+  transition: transform 0.3s ease, box-shadow 0.3s ease;
+  transform-origin: center;
 }
 @media (max-width: 479px) {
   .path-projets .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockprojets-block-1 .view-projets .node-type-projet {
@@ -4820,6 +4822,9 @@ svg.ext {
     padding-top: 2rem;
   }
 }
+.path-projets .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockprojets-block-1 .view-projets .node-type-projet:hover {
+  transform: translateY(-5px);
+}
 .path-projets .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockprojets-block-1 .view-projets .node-type-projet div:first-child {
   display: flex;
   flex-direction: column;

+ 11 - 0
web/themes/custom/eql/scss/pages/_lesprojets.scss

@@ -192,11 +192,22 @@
                                     padding: 0.5rem;
                                     padding-right: 1rem;
                                     padding-left: 1rem;
+
+                                    transition:
+                                    transform 0.3s ease,
+                                    box-shadow 0.3s ease;
+                            
+                                    transform-origin: center;
+
                                     @media (max-width: 479px){
                                         padding-left: 0rem;
                                         padding-right: 0rem;
                                         padding-top: 2rem;
                                     }
+                                    &:hover{
+                                        transform: translateY(-5px);
+                                    }
+
                                     div:first-child{                
                                         display: flex;
                                         flex-direction: column;

+ 0 - 3
web/themes/custom/eql/scss/partials/_node-type-ressource-teaser.scss

@@ -99,9 +99,6 @@ article.node-type-ressource{
         
             overflow: hidden;
             text-overflow: ellipsis;
-        
-            // line-height: 1.5em;
-            // max-height: calc(1.2em * 3);
         }
         .field--name-field-edition{
             order: 7;