/home/fdhrevqn/public_html/wp-content/plugins.disabled/fox-framework/css/_button.scss
/* Button
-------------------------------------------------------------------------------------- */
.fox-button {
display: inline-block;
margin: 0 10px 5px 0;
vertical-align: bottom;
-ms-touch-action: manipulation;
touch-action: manipulation;
background-image: none;
@include user-select(none);
}
.fox-btn {
@include display(flex);
@include align-content(center);
@include align-items(center);
@include justify-content(center);
text-align: center;
i {
margin-left: 8px;
display: inline-block;
line-height: inherit;
font-size: inherit;
}
}
.btn-primary {
background: $accent;
color: white;
}
/* Alignment
--------------------- */
.fox-button.button-center,
.fox-button.button-right {
display: block;
text-align: center;
margin: 0;
}
.fox-button.button-right {
text-align: right;
margin: 0;
}
.fox-button.button-center .fox-btn,
.fox-button.button-right .fox-btn {
@include display(inline-flex);
}
/* block */
.fox-button.button-block {
display: block;
width: 100%;
margin-left: auto;
margin-right: auto;
}
/* Different Styles
--------------------- */
/* outline */
.fox-btn.btn-outline,
.fox-btn.btn-outline:hover {
background: none;
color: #111;
border: 2px solid;
line-height: 40px;
box-shadow: none;
}
.fox-btn.btn-outline:after {
background: currentColor;
margin-top: 0;
left: -2px;
right: -2px;
}
/* fill */
.fox-btn.btn-fill {
background: none;
color: #111;
border: 2px solid;
line-height: 40px;
box-shadow: none;
&:hover {
color: #fff;
background: #111;
border-color: #111;
}
}