blob: 8c75cb96c8e4752e773b34befcbfcff4be322e7a (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
<script>
import BlowoutToolbelt from "$shared/components/blowout-toolbelt.svelte";
</script>
<style>
#decoration {
position: absolute;
top: 0;
left: 0;
pointer-events: none;
width: 100%;
height: 100%;
overflow: hidden;
z-index: 1;
}
#decoration svg {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 134%;
min-width: 1280px;
max-width: 1920px;
height: auto;
}
</style>
<BlowoutToolbelt/>
<main class="container-fluid padding-x-xs padding-x-xxl@xs padding-y-md padding-y-lg@md max-width-sm">
<div class="z-index-2 position-relative">
<slot/>
</div>
<figure id="decoration"
class="z-index-1"
aria-hidden="true">
<svg class="color-contrast-higher opacity-10%"
viewBox="0 0 1920 450"
fill="none">
<g stroke="currentColor"
stroke-width="2"
stroke-linejoin="round"
stroke-linecap="round">
<path d="M1449 94.9993V3L1354 48.9995L1259 3V94.9993L1354 140.999L1449 94.9993Z"/>
<path d="M1639 94.9993V3L1544 48.9995L1449 3V94.9993L1544 140.999L1639 94.9993Z"/>
<path d="M1354 49.0002V141"/>
<path d="M1544 49.0002V141"/>
<path d="M1449 94.9995L1544 140.999L1449 186.999L1354 140.999L1449 94.9995Z"/>
<path d="M1544 141V232.999L1449 278.999L1354 232.999V141"/>
<path d="M1449 187V279"/>
<path d="M1544 264L1639 310L1544 355.999L1449 310L1544 264Z"/>
<path d="M1639 310V402L1544 447.999L1449 402V310"/>
<path d="M1544 356.001V448"/>
<path d="M1639 94.9995L1734 140.999L1639 186.999L1544 140.999L1639 94.9995Z"/>
<path d="M1734 141V232.999L1639 278.999L1544 232.999V141"/>
<path d="M1639 187V279"/>
</g>
</svg>
</figure>
</main>
|
