css fichier unique node ressource teaser

2025-05-16 14:17:33 +02:00
parent 65a95309d5
commit ac7654c8f2
5 changed files with 742 additions and 331 deletions
@@ -0,0 +1,175 @@
+.node-type-ressource{
+    margin-bottom: 1rem ;
+    padding-right: 1rem;  
+    .ext{
+        color: black;
+    }
+    svg.ext{
+        display: none;
+    }
+    &.type-de-ressource-Productions-du-programme-Engagés-pour-la-qualité-du-logement-de-demain{
+        // background-color: $background-actus;
+        .wrapper-ressource{
+            display: grid;
+            grid-template-columns: 1fr 1.8fr; 
+            grid-template-rows: repeat(5 1fr);
+            .field--name-field-type-de-ressource{
+                order: 2;
+                grid-row: 2;
+                margin-bottom: 1rem;
+            }
+            .field--name-field-type-de-media{
+                order: 1;
+                grid-row: 1;
+                
+            }
+            .field--name-field-images{
+                order: 3;
+                grid-row: 3 /span 5;
+                height: auto;
+                width: 90%;
+                img{
+                    height: auto;
+                    width: 90%;
+                    border: 1px solid #a3a3a3;
+                }
+            }
+            .field--name-title{
+                grid-row: 3;
+                margin-top: 0;
+                a{
+                    color: $blue-light;
+                    font-size: 1.2rem;
+                    font-style: normal;
+                }
+            }
+            .field--name-field-sous-titre{
+                grid-row: 4;
+                color: $blue-light;
+                font-size: 0.8rem;
+                font-weight: 800;
+            }
+            .field--name-field-auteur-s-{
+                grid-row: 5;
+            }
+            .field--name-field-edition{
+                grid-row: 6;
+            }
+            .field--name-field-date-de-parution{
+                grid-row: 7;
+            }
+            .field--name-field-mots-clefs{
+                grid-row: 8;
+            }
+        }
+    }
+    &.type-de-ressource-Paroles-de-lauréats{
+        // background-color: $background-actus;
+    }
+    @media (max-width: 479px) {
+        margin-left: 0;                                                
+    }   
+    .wrapper-ressource{    
+                                                           
+        .field--name-field-type-de-ressource, 
+        .field--name-field-type-de-media{
+            grid-column: 1;
+            text-transform: uppercase;
+            line-height: 1.1rem;
+            margin-top: 0.5rem;                                              
+            a{
+                color: $blue-light;
+                font-weight: 900;
+                font-size: 0.8rem;
+                pointer-events: none;
+                cursor: default;
+            }
+        }
+        .field--name-title{
+            grid-column: 2;
+            margin-top: 0.5rem;
+
+            h2{
+                margin: 0;
+                line-height: 1rem;
+                a{
+                    color: $black;
+                    font-size: 1rem;
+                    font-weight: 900;
+                    font-style: italic;
+                }
+
+            }
+        }
+        .field--name-field-auteur-s-{
+            grid-column: 2;
+            margin-top: 0.5rem;
+            font-weight: 800;
+            line-height: 1.1rem;
+            p{
+                margin: 0;
+                
+            }
+            .field__label{
+                display:none;
+            }
+        }
+        .field--name-field-sous-titre{
+            grid-column: 2;
+            margin-top: 0.5rem;
+        }
+        .field--name-field-edition{
+            grid-column: 2;
+            margin-top: 0.5rem;
+            p{
+                margin: 0;
+            }
+            .field__label{
+                display:none;
+            }
+        }
+        .field--name-field-images{
+            grid-column: 1;
+            .field__item{
+                height: 100px;
+            }
+            img{
+                height: 100%;
+                width: auto;
+            }
+        }
+        .field--name-field-date-de-parution{
+            grid-column: 2;
+            margin-top: 0.3rem;
+        }
+        .field--name-field-mots-clefs{
+            grid-column: 2;
+            display: flex;
+            margin-top: 1rem;
+            flex-direction: row;
+            flex-wrap: wrap;
+        
+            .field__item{
+                margin-right: 0.5rem;
+                padding-left: 0.3rem;
+                padding-right: 0.3rem;
+                font-size: 0.7rem;
+            
+                a{
+                    background: $blue-dark;
+                    color: $white;
+                    font-weight: 800;
+                    vertical-align: super;
+                    padding-left: 0.1rem;
+                    padding-right: 0.1rem;
+                    display: inline-flex;
+                    pointer-events: none;
+                    cursor: default;
+                }
+            }
+        }
+        ul.links.inline{
+            display: none;
+        }
+    } 
+}