1---
2interface Props {
3 maxWidth?: number;
4 padding?: string;
5 background?: string;
6 class?: string;
7 step?: number;
8}
9const {
10 maxWidth = 1152,
11 padding = "88px 32px",
12 background,
13 class: className,
14 step,
15} = Astro.props;
16---
17
18<section
19 class:list={["alc-section", className]}
20 style={`padding:${padding};${background ? `background:${background};` : ""}`}
21 data-step={step}
22>
23 <div class="alc-section__inner" style={`max-width:${maxWidth}px;`}>
24 <slot />
25 </div>
26</section>
27
28<style>
29 .alc-section__inner {
30 margin: 0 auto;
31 min-width: 0;
32 max-width: 100%;
33 }
34 .alc-section {
35 overflow-x: clip;
36 }
37</style>