Making btn and fab work on link elements

index.html

@@ -116,6 +116,7 @@
             <button class="btn btn-primary">Hallo Welt</button>
 
             <button class="btn fab">+</button>
+            <a class="btn fab fab-left" href="#">-</a>
         </div>
 
         <div class="margin prev">

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hibas123/theme",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "description": "",
   "main": " ",
   "files": [

src/_maketheme.scss

@@ -3,6 +3,7 @@
 $background:false !default;
 $on-background:false !default;
 $button-color: #CCCCCC !default;
+$on-button: #000000 !default;
 
 @if $background==false or $on-background==false {
     @error("background and on-background must be set!");

src/base/_btn.scss

@@ -6,6 +6,10 @@
     font-weight: 500;
     text-transform: uppercase;
     transition: .05s background-color linear;
+    text-decoration: unset;
+    text-align: center;
+    align-items: flex-start;
+    cursor: pointer;
 }
 
 .btn-flat {
@@ -73,4 +77,9 @@
     right: 1.5rem;
 
     border: none;
+}
+
+.fab-left {
+    right: unset;
+    left: 1.5rem;
 }

src/theme/_btn.scss

@@ -1,5 +1,6 @@
 @mixin btn-flat {
     background: $button-color;
+    color: $on-button;
 
     &:hover {
         background: darken($button-color, 5%);