From ca2a68b9c61d5113c43a5a8419762331907a5868 Mon Sep 17 00:00:00 2001
From: Drew Jones <drew.jones@centrica.com>
Date: Fri, 8 Mar 2024 16:47:59 +0000
Subject: [PATCH] chore: add example code marks

---
 src/content/docs/components/ns-card.mdx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/content/docs/components/ns-card.mdx b/src/content/docs/components/ns-card.mdx
index 41e324752..15f3664b7 100644
--- a/src/content/docs/components/ns-card.mdx
+++ b/src/content/docs/components/ns-card.mdx
@@ -119,7 +119,7 @@ Cards are to be used to apply a container around a related grouping of informati
 
 #### `slot="action"`
 
-```html
+```html {4-6}
 <ns-card type="support" decoration="bulb">
   <h3 slot="heading">Get energy with us</h3>
   <p slot="paragraph">We've got a tariff to suit every home and family.</p>
@@ -137,7 +137,7 @@ If you have a group of cards, try to make sure that the pill is placed in the sa
 
 ##### Screen readers with ns-pill
 
-```html
+```html {3}
 <ns-card>
   <h3 slot="heading">
     <ns-pill>Special Offer</ns-pill>
@@ -153,7 +153,7 @@ In the above example the screen reader will read out "Special Offer Get energy w
 
 If using with a type of `support` with an image. There is also the option to place the pill over the image using the `pillOverImage` attribute. Note the `ns-pill` will need to be in the `paragraph` slot as it is no longer related to the heading.
 
-```html
+```html {4} "pillOverImage"
 <ns-card type="support" image="path/to/image" pillOverImage>
   <h3 slot="heading">Get energy with us</h3>
   <p slot="paragraph">