Adds circle buttons to Vue

AgnosticUI · Sep 21, 2020 · 79ba010 · 79ba010
1 parent ad531dc
commit 79ba010
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/agnosticui-vue/src/stories/Button.vue b/agnosticui-vue/src/stories/Button.vue
@@ -32,6 +32,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    isCircle: {
+      type: Boolean,
+      default: false,
+    },
     isRounded: {
       type: Boolean,
       default: false,
@@ -64,6 +68,7 @@ export default {
         [this.$style["btn-blank"]]: this.isBlank,
         [this.$style["btn-block"]]: this.isBlock,
         [this.$style["btn-rounded"]]: this.isRounded,
+        [this.$style["btn-circle"]]: this.isCircle,
         [this.$style["btn-raised"]]: this.isRaised,
         [this.$style["btn-primary"]]: this.mode === "primary",
         [this.$style["btn-secondary"]]: this.mode === "secondary",

diff --git a/agnosticui-vue/src/stories/ButtonTests.vue b/agnosticui-vue/src/stories/ButtonTests.vue
@@ -8,6 +8,7 @@
       <Button isRounded>Go</Button>
       <Button isRaised isRounded>Go</Button>
       <Button isBordered isRounded>Go</Button>
+      <Button isCircle isBordered>Go</Button>
     </div>
     <div>
       <Button mode="primary">Go</Button>
@@ -17,6 +18,7 @@
       <Button mode="primary" isRounded>Go</Button>
       <Button mode="primary" isRaised isRounded>Go</Button>
       <Button mode="primary" isBordered isRounded>Go</Button>
+      <Button mode="primary" isCircle isBordered>Go</Button>
     </div>
     <div>
       <Button mode="secondary">Go</Button>
@@ -26,6 +28,7 @@
       <Button mode="secondary" isRounded>Go</Button>
       <Button mode="secondary" isRaised isRounded>Go</Button>
       <Button mode="secondary" isBordered isRounded>Go</Button>
+      <Button mode="secondary" isCircle isBordered>Go</Button>
     </div>
 
     <div>