From f364d0ee882be6ac0d4929f4592a716ff1d2efda Mon Sep 17 00:00:00 2001
From: Derick Montague <derick.montague@ibm.com>
Date: Fri, 9 Oct 2020 12:11:39 -0500
Subject: Add icon only button to documentation

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ia00d714b0d33b849a6e9dde8d25e9e9c78d36002
---
 docs/.vuepress/components/BmcButtons.vue | 12 ++++++++++--
 docs/guide/components/button.md          |  5 +++++
 2 files changed, 15 insertions(+), 2 deletions(-)

(limited to 'docs')

diff --git a/docs/.vuepress/components/BmcButtons.vue b/docs/.vuepress/components/BmcButtons.vue
index 2035e4db..795c837a 100644
--- a/docs/.vuepress/components/BmcButtons.vue
+++ b/docs/.vuepress/components/BmcButtons.vue
@@ -13,6 +13,10 @@
             <icon-add />
             <span>Link Button</span>
         </b-button>
+        <b-button variant="link">
+            <icon-trashcan />
+            <span class="sr-only">Delete</span>
+        </b-button>
 
         <h3 class="h4">Disabled</h3>
         <b-button disabled variant="primary">Primary</b-button>
@@ -27,21 +31,25 @@
             <icon-add />
             <span>Link Button</span>
         </b-button>
+        <b-button disabled variant="link">
+            <icon-trashcan />
+            <span class="sr-only">Delete</span>
+        </b-button>
     </div>
 </template>
 
 <script>
 import IconAdd from '@carbon/icons-vue/es/add--alt/20';
+import IconTrashcan from '@carbon/icons-vue/es/trash-can/20';
 import IconArrowRight from '@carbon/icons-vue/es/arrow--right/16';
 export default {
     name: 'BmcButtons',
-    components: { IconAdd, IconArrowRight }
+    components: { IconAdd, IconArrowRight, IconTrashcan }
 }
 </script>
 <style scoped>
     button {
         margin-bottom: 1rem;
-        margin-right: .5rem;
     }
 
     h3 {
diff --git a/docs/guide/components/button.md b/docs/guide/components/button.md
index aeb93edc..6916d438 100644
--- a/docs/guide/components/button.md
+++ b/docs/guide/components/button.md
@@ -13,6 +13,11 @@ Buttons are used to perform an action. The main buttons in the application are t
   <icon-add />
   <span>Primary with icon</span>
 </b-button>
+<b-button variant="link">
+  <icon-trashcan />
+  <span class="sr-only">Delete</span>
+</b-button>
+
 <b-button variant="secondary">Secondary</b-button>
 <b-button variant="danger">Danger</b-button>
 <b-button variant="link">Link Button</b-button>
-- 
cgit v1.2.3