23 lines
1.4 KiB
HTML
23 lines
1.4 KiB
HTML
<section class="grid lg:grid-cols-[1fr_repeat(3,9%)_1fr] items-center lg:[&:nth-child(even)_aside]:col-start-1 lg:[&:nth-child(even)_main]:col-start-4 lg:[&:nth-child(even)>*]:row-start-1
|
|
[&_figure>*]:clip-path-polygon-[var(--polygonmobile)] lg:[&_figure>*]:clip-path-polygon-[var(--polygon)]
|
|
lg:[&:nth-child(even)_figure>*]:clip-path-polygon-[var(--polygonOdd)]
|
|
lg:[&:nth-child(even)_figure>div]:right-[-10px]
|
|
lg:[&:nth-child(odd)_figure>div]:left-[-10px]
|
|
|
|
lg:[&:nth-child(odd)_main>div]:mr-[-4vw] lg:[&:nth-child(odd)_main>div]:pr-[8vw]
|
|
lg:[&:nth-child(even)_main>div]:ml-[-4vw] lg:[&:nth-child(even)_main>div]:pl-[8vw]
|
|
lg:[&:nth-child(odd)_main>div]:rounded-l-xl lg:[&:nth-child(even)_main>div]:rounded-r-xl
|
|
|
|
lg:[&:nth-child(odd)_main]:pl-10
|
|
lg:[&:nth-child(even)_main]:pr-10
|
|
"
|
|
style="
|
|
--polygon: 8% 0, 100% 0%, 100% 100%, 8% 100%, 0% 50%;
|
|
--polygonOdd: 92% 0, 100% 50%, 92% 100%, 0 100%, 0 0;
|
|
--polygonmobile: 0 0, 65% 7%, 100% 0, 100% 100%, 29% 93%, 0 100%;
|
|
"
|
|
>
|
|
<main class="lg:col-span-2 row-start-2 lg:row-start-auto w-[calc(100%-3rem)] sm:w-96 lg:max-w-none lg:w-full mx-auto lg:py-8">
|
|
<div class="prose prose-invert prose-lg bg-neutral-800 p-8 rounded-b-xl lg:rounded-b-0 rounded-l-0 max-w-none pt-[12vw] lg:pt-8 mt-[-10vw] lg:mt-0 [&>h2]:text-xl md:[&>h2]:text-xl xl:[&>h2]:text-[1.8vw]">
|
|
<h2 class="text-center lg:text-left">{{heading}}</h2>
|