Making btn and fab work on link elements

This commit is contained in:
Fabian 2019-09-24 16:30:07 +02:00
parent b884ad3c8e
commit 10a7a41567
5 changed files with 13 additions and 1 deletions

View File

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

View File

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

View File

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

View File

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

View File

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