marco.tngl.sh
My personal site.
1---
2const { title } = Astro.props;
3---
4
5<style>
6 .box {
7 position: relative;
8 border: 1px solid oklch(20.8% 0.042 265.755);
9 padding: 24px;
10 margin-block: 24px;
11 border-radius: 4px;
12 }
13
14 .box > h2 {
15 position: absolute;
16 left: 24px;
17 top: -12px;
18 font-size: 12px;
19 height: 24px;
20 line-height: 24px;
21 font-weight: 500;
22 letter-spacing: 3px;
23 margin: 0;
24 background-color: var(--bg);
25 padding-inline: 4px;
26 text-transform: uppercase;
27 }
28</style>
29<div class="box">
30 <h2>{title}</h2>
31 <slot />
32</div>