STYLE Add custom video block styles with stacked background variant
This commit is contained in:
parent
9fadc4571d
commit
a837b19bac
22
resources/css/blocks/variants.css
Normal file
22
resources/css/blocks/variants.css
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
.block-custom-video.is-style-stacked-background,
|
||||
.wp-block-embed.is-style-stacked-background {
|
||||
@apply relative z-10;
|
||||
> * {
|
||||
@apply z-10;
|
||||
}
|
||||
|
||||
.wp-block-embed__wrapper {
|
||||
@apply p-4 bg-white border border-primary;
|
||||
}
|
||||
&:after {
|
||||
@apply content-[''] absolute inset-0 bg-white border border-primary w-full h-full top-0 left-0;
|
||||
z-index: 0;
|
||||
transform: translate(16px, 40px) rotate(-4deg);
|
||||
background: linear-gradient(
|
||||
var(--wp--preset--color--primary),
|
||||
var(--wp--preset--color--primary)
|
||||
)
|
||||
center/calc(100% - 30px) calc(100% - 30px) no-repeat,
|
||||
white;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user