From 7e7e0568f5169d6cc2e8ffe096bea46773be62fa Mon Sep 17 00:00:00 2001
From: KevinMidboe <kevin.midboe@gmail.com>
Date: Sun, 19 Jul 2020 19:18:28 +0200
Subject: [PATCH] Button has xs prop and size.

---
 frontend/components/ui/Button.vue | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/frontend/components/ui/Button.vue b/frontend/components/ui/Button.vue
index 6764260..b416794 100644
--- a/frontend/components/ui/Button.vue
+++ b/frontend/components/ui/Button.vue
@@ -15,6 +15,11 @@ export default {
       default: false,
       required: false
     },
+    xs: {
+      type: Boolean,
+      default: false,
+      required: false
+    },
     scaleRotate: {
       type: Boolean,
       default: false
@@ -28,6 +33,8 @@ export default {
         classNames.push('scale-rotate')
       if (this.small)
         classNames.push('small');
+      if (this.xs)
+        classNames.push('xs');
       if (this.color)
         classNames.push(this.color);
       return classNames.join(' ');
@@ -57,6 +64,11 @@ button {
     font-size: var(--btn-sm);
   }
 
+  &.xs {
+    padding: var(--space-xs) var(--space-sm);
+    font-size: var(--btn-xs);
+  }
+
   @media(hover: hover) and (pointer: fine) {
     &.scale-rotate:hover {
       transform: rotate(4deg) scale(1.05);