@zplane-web/craft-licensing

Pills 

<div class="pills">
    <div class="pills__pill">

        <div class="pill pill--yellow"><span class="pill__text u-underline">A pill</span></div>
    </div>
    <div class="pills__pill">

        <div class="pill pill--steel"><span class="pill__text u-underline">A pill</span></div>
    </div>
    <div class="pills__pill">

        <div class="pill pill--gray"><span class="pill__text u-underline">A pill</span></div>
    </div>
</div>
 
<div {{ html_attributes({
  id: id ?? false,
  class: 'pills',
}, attrs ?? {}) }}>
  {% for pill in pills %}
    <div class="pills__pill">
      {% include '@pill' with pill only %}
    </div>
  {% endfor %}
</div>
 
{
  "pills": [
    {
      "text": "A pill",
      "color": "yellow"
    },
    {
      "text": "A pill",
      "color": "steel"
    },
    {
      "text": "A pill",
      "color": "gray"
    }
  ]
}
  • Content: 
    .pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
  • URL: /components/raw/pills/pills.scss
  • Filesystem Path: src/components/3-molecules/pills/pills.scss
  • Size: 62 Bytes

No notes defined.