Antoine/Deligraph-V3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refining block reordering and padding chaining
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Antoine M 2025-02-06 16:18:44 +01:00
parent 408d669e0c
commit d1e9d229b0
1 changed files with 62 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
css/app.css
View File

@ -104,6 +104,14 @@
content: none; content: none;
} }
.deligraph-blocks-chapter-section + .gallery-website-screens{
margin-top: 3rem;
}
.simple-screen--white + .gallery-website-screens{
margin-top: 8rem;
}
.wp-admin.post-type-portfolio .is-root-container, .wp-admin.post-type-portfolio .is-root-container,
.portfolio-single{ .portfolio-single{
margin-left: auto; margin-left: auto;
@ -437,10 +445,23 @@
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1)); background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
padding: 2.5rem; padding: 2.5rem;
}
.gallery-website-screens--padding-simple{
padding-top: 2.5rem;
padding-bottom: 2.5rem;
}
.gallery-website-screens--padding-double{
padding-top: 4rem;
padding-bottom: 4rem;
}
.gallery-website-screens{
margin: 0 calc(50% - 50vw); margin: 0 calc(50% - 50vw);
} }
.gallery-website-screens ul{ .gallery-website-screens__screens-grid{
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
list-style-type: none; list-style-type: none;
@ -451,45 +472,75 @@
} }
@media (min-width: 782px){ @media (min-width: 782px){
.gallery-website-screens ul{ .gallery-website-screens__screens-grid{
padding-left: 1rem; padding-left: 1rem;
padding-right: 1rem; padding-right: 1rem;
} }
} }
@media (min-width: 960px){ @media (min-width: 960px){
.gallery-website-screens ul{ .gallery-website-screens__screens-grid{
padding-left: 3rem; padding-left: 3rem;
padding-right: 3rem; padding-right: 3rem;
} }
} }
.gallery-website-screens ul.is-grid{ .gallery-website-screens__screens-grid.is-grid{
display: grid; display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr));
} }
@media (min-width: 960px){ @media (min-width: 960px){
.gallery-website-screens ul.is-grid{ .gallery-website-screens__screens-grid.is-grid{
grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-columns: repeat(3, minmax(0, 1fr));
} }
} }
.gallery-website-screens ul.is-flex{ .gallery-website-screens__screens-grid.is-flex{
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
} }
.gallery-website-screens ul.is-mobile-capture{ .gallery-website-screens__screens-grid.is-flex img{
gap: 6rem; max-height: 24rem;
} }
.gallery-website-screens ul.is-mobile-capture img{ @media (min-width: 782px){
.gallery-website-screens__screens-grid.is-mobile-capture{
gap: 1.5rem;
}
}
@media (min-width: 1280px){
.gallery-website-screens__screens-grid.is-mobile-capture{
gap: 3rem;
}
}
.gallery-website-screens__screens-grid.is-mobile-capture img{
max-width: 15rem; max-width: 15rem;
border-radius: 1.5rem; border-radius: 0.75rem;
} }
.gallery-website-screens ul{ @media (min-width: 1280px){
.gallery-website-screens__screens-grid.is-mobile-capture img{
border-radius: 1.5rem;
}
}
.gallery-website-screens__screens-grid .gallery-website-screens__single-screen img {
width: 100%;
/* Fixe la largeur max */
height: 100%;
/* Fixe la hauteur max */
max-height: 800px;
/* Ajuste selon ton besoin */
-o-object-fit: cover;
object-fit: cover;
/* Évite les déformations */
}
.gallery-website-screens__screens-grid{
max-width: 1800px; max-width: 1800px;
} }