---
import type { StarlightIcon } from '../components/Icons';
import Icon from '../user-components/Icon.astro';
interface Props {
icon: StarlightIcon;
label: string;
}
const { icon, label } = Astro.props;
---
<p class="sl-flex">
<Icon name={icon} size="1.5em" color="var(--sl-color-orange-high)" />
<span>{label}</span>
</p>
<style>
p {
border: 1px solid var(--sl-color-orange);
padding: 0.75em 1em;
background-color: var(--sl-color-orange-low);
color: var(--sl-color-orange-high);
width: max-content;
max-width: 100%;
align-items: center;
gap: 0.75em;
font-size: var(--sl-text-body-sm);
line-height: var(--sl-line-height-headings);
}
</style>