webawesome/docs/_layouts/element.njk

{% extends '../_layouts/block.njk' %}

{# Component header #}
{% block notes %}
  {% if component %}
  <wa-callout variant="success">
    <wa-icon slot="icon" name="lightbulb" variant="regular"></wa-icon>
    Want to do more?
    Check out the {% for name in (component | toList) -%}
      {{ ' and ' if loop.last and not loop.first }}<a href="/docs/components/{{ name }}"><code>&lt;wa-{{ name }}&gt;</code></a>{{ ', ' if not loop.last }}
      {%- endfor %} component{{ 's' if (component | isList) }}</a>!
  </wa-callout>
  {% endif %}
{% endblock %}

{% block afterContent %}
{% if file %}
{% markdown %}
## Opting In to Native {{ title }} Styles

If you want to use the Native {{ title }} styles **without including the entirety of Web Awesome Native Styles**,
 you can include the following CSS files from the Web Awesome CDN.

{% set stylesheet = file %}
{% include 'import-stylesheet-code.md.njk' %}

To use all of Web Awesome Native styles, follow the [instructions on the Native Styles overview page](../).

{% endmarkdown %}
{% endif %}

{% endblock %}