// Buttons .btn { &.btn-flat { font-weight: 500; color: inherit; background-color: transparent; box-shadow: none; &:not([disabled]):not(.disabled):active { box-shadow: none; } } } // Floating button .btn-floating { position: relative; z-index: 1; display: inline-block; padding: 0; margin: $btn-floating-margin; overflow: hidden; vertical-align: middle; cursor: pointer; border-radius: $btn-floating-border-radius; box-shadow: $z-depth-1-half; transition: $btn-floating-transtion; @include make-btn-floating($btn-floating-width, $btn-floating-height, $btn-floating-icon-size, $btn-floating-line-height); i { display: inline-block; width: inherit; color: $white-base; text-align: center; } &:hover { box-shadow: $z-depth-2; } &:before { border-radius: 0; } &.btn-sm { @include make-btn-floating($btn-floating-width-sm, $btn-floating-height-sm, $btn-floating-icon-size-sm, $btn-floating-line-height-sm); } &.btn-lg { @include make-btn-floating($btn-floating-width-lg, $btn-floating-height-lg, $btn-floating-icon-size-lg, $btn-floating-line-height-lg); } } // Fixed action button .fixed-action-btn { position: fixed; right: $fixed-action-btn-right; bottom: $fixed-action-btn-bottom; z-index: 998; padding-top: $fixed-action-btn-padding-top; margin-bottom: 0; ul { position: absolute; right: 0; bottom: $fixed-action-btn-ul-bottom; left: 0; display: flex; flex-direction: column; height: $fixed-action-btn-ul-bottom; padding: 0; margin: 0 0 15px; text-align: center; transition: 400ms height; li { z-index: 0; display: flex; margin-right: auto; margin-bottom: $fixed-action-btn-li-margin-bottom; margin-left: auto; } a { &.btn-floating { opacity: 0; transition-duration: .4s; transform: scale(.4) translate(0); &.shown { opacity: 1; transform: scale(1) translate(0); } } } } &.active ul { height: 300px; } } button, html [type="button"], [type="reset"], [type="submit"] { appearance: none; } // Rounded buttons .btn-rounded { border-radius: $btn-rounded-border-radius; }