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

STYLE Fixing and refining content-box

Browse Source
This commit is contained in:
Antoine M 2026-03-24 17:55:10 +01:00
parent 41ad51d03e
commit e54ee06cc0
1 changed files with 94 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
resources/css/blocks/content-box.css
View File

@ -4,25 +4,26 @@
.content-box {
@apply relative px-4 md:px-8;
&--variant-framed {
@apply border border-carhop-green-600;
}
&--variant-backgrounded {
@apply py-16;
background-color: var(--content-box-background-color, transparent);
}
&--variant-framed-backgrounded {
@apply py-16;
@apply border border-carhop-green-600;
background-color: var(--content-box-background-color, transparent);
}
&--shape-straight {
@apply py-16;
background-color: var(--content-box-background-color, transparent);
}
&--shapeA,
&--shapeB {
&--shapeB,
&--shapeC {
@apply !relative;
background-color: transparent !important;
@ -30,14 +31,12 @@
@apply z-10 relative;
}
}
.content-box__shape {
@apply top-0 left-0 w-full h-full absolute;
}
@apply py-16;
background-color: var(--content-box-background-color, transparent);
}
&.alignwide,
&.aligncontained {
@ -133,6 +132,7 @@ ul {
.carhop-heading:not(:first-child) {
@apply pt-32;
}
}
main > .content-box:first-child {
@media (max-width: 1441px) {
@ -166,7 +166,7 @@ body.wp-admin.post-type-articles .content-box,
body.single-activites .content-box,
body.wp-admin.post-type-page .content-box,
body.page .content-box {
/* @apply py-16; */
@apply py-16;
color: var(--content-box-text-color);
.carhop-heading p {
@ -207,3 +207,29 @@ body.page .content-box {
) {
@apply !mb-0;
}
.wp-block-carhop-blocks-content-box.alignfull + .alignfull {
@apply !mt-0;
}
.wp-block-carhop-blocks-content-box.alignfull:has(+ .alignfull) {
@apply !mb-0;
}
.page-single:has(
.content-wrapper[data-active-tab='post']
.post-content.entry-content
> .content-box.alignfull:last-child
) {
.content-wrapper + .alignfull {
@apply !-mb-12;
}
.content-wrapper + .alignfull {
/* @apply !bg-red-500 opacity-40; */
margin-top: -70px !important;
}
}
.content-box--variant-backgrounded.content-box--shapeC.alignfull + .alignfull {
@apply !-mt-5;
}