patterns/chip

redirects.yaml

@@ -54,3 +54,4 @@
 /docs/utilities/visualise-font-metrics: /docs/utilities/font-metrics
 /docs/utilities/no-margin: /docs/utilities/margin-collapse
 /docs/utilities/no-padding: /docs/utilities/margin-collapse
+/docs/examples/patterns/chip/dark: /docs/examples/patterns/chip/default?theme=dark

templates/docs/examples/patterns/chip/combined.html

@@ -0,0 +1,16 @@
+{% extends "_layouts/examples.html" %}
+{% block title %}Chip / Combined{% endblock %}
+
+{% block standalone_css %}patterns_chip{% endblock %}
+
+{% block content %}
+{% with is_combined = true %}
+<section>{% include 'docs/examples/patterns/chip/colors.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/default.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/dense.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/inline.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/long-values.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/variants.html' %}</section>
+<section>{% include 'docs/examples/patterns/chip/with-dismiss.html' %}</section>
+{% endwith %}
+{% endblock %}

templates/docs/patterns/chip/index.md

@@ -44,11 +44,9 @@ View example of the inline chip pattern
 
 ## Dark chips
 
-To use chips on a dark background the `is-dark` class can be applied. If the chip includes the dismiss icon, you'll need to add the `is-light` class to the icon. To ensure the dark chips are accessible, the background colour used must `#2b2b2b` or darker:
+To use chips on a dark background the `is-dark` class can be applied. If the chip includes the dismiss icon, you'll need to add the `is-light` class to the icon. To ensure the dark chips are accessible, the background colour used must `#2b2b2b` or darker.
 
-<div class="embedded-example"><a href="/docs/examples/patterns/chip/dark" class="js-example">
-View example of the dark chip pattern
-</a></div>
+[See an example of chips on dark background](/docs/examples/patterns/chip/default?theme=dark)
 
 ## Import