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

RESPONSIVE Fixing aspect of background decorative card
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Antoine M 2025-10-16 16:20:32 +02:00
parent e8bceba564
commit f57251eb85
2 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
resources/css/blocks/dernieres-dynamiques.css
View File

@ -73,12 +73,17 @@
&__issue-thumbnail-wrapper { &__issue-thumbnail-wrapper {
@apply relative; @apply relative;
.card-background { .card-background {
@apply absolute border-primary border bg-white top-20 left-8; @apply absolute border-primary border bg-white top-10 lg:top-20 left-2 lg:left-8;
height: 330px; height: 330px;
transform: rotate(3deg) scale(0.95);
width: 100%;
@screen lg {
width: 104%; width: 104%;
transform: perspective(800px) rotateY(10deg) skewX(1deg) rotateZ(4deg) rotateX(1deg) transform: perspective(800px) rotateY(10deg) skewX(1deg) rotateZ(4deg)
scale(0.95) translateY(-2px) translateX(-40px); rotateX(1deg) scale(0.95) translateY(-2px) translateX(-40px);
}
z-index: 0; z-index: 0;
&::before { &::before {
@ -98,7 +103,9 @@
height: 330px; height: 330px;
position: relative; position: relative;
z-index: 10; z-index: 10;
@screen lg {
transform: translateX(-30px); transform: translateX(-30px);
}
img { img {
width: calc(100% - 42px); width: calc(100% - 42px);

4
resources/css/blocks/revues-precedentes.css
View File

@ -80,10 +80,10 @@
@apply relative w-full; @apply relative w-full;
.card-background { .card-background {
@apply absolute border-primary border bg-white top-8 md:top-20 left-4 md:left-8; @apply absolute border-primary border bg-white top-10 lg:top-20 left-2 lg:left-8;
height: 260px; height: 260px;
width: 100%; width: 100%;
transform: rotate(3deg) scale(0.98); transform: rotate(3deg) scale(0.95);
@screen lg { @screen lg {
width: 104%; width: 104%;