This repository has been archived on 2026-01-08. You can view files and clone it. You cannot open issues or pull requests or push a commit.
Files
plyr/demo/src/less/components/buttons.less
T
2017-11-20 21:23:49 +11:00

63 lines
1.3 KiB
Plaintext

// ==========================================================================
// Buttons
// ==========================================================================
// Shared
.button,
.button__count {
position: relative;
display: inline-flex;
vertical-align: middle;
align-items: center;
padding: (@spacing-base * 0.75);
border-radius: @border-radius-base;
box-shadow: 0 1px 1px fade(#000, 10%);
background: #fff;
border: 0;
user-select: none;
text-shadow: none;
color: @gray;
}
// Buttons
.button {
padding-left: @spacing-base;
padding-right: @spacing-base;
transition: all 0.2s ease;
font-weight: @font-weight-bold;
&:hover,
&:focus {
color: @gray-dark;
outline: 0;
&::after {
display: none;
}
}
&.tab-focus {
.tab-focus();
}
}
// Count bubble
.button__count {
margin-left: (@spacing-base / 2);
animation: fadein 0.2s ease;
font-weight: @font-weight-medium;
&::before {
content: '';
position: absolute;
width: 0;
height: 0;
right: 100%;
top: 50%;
transform: translateY(-50%);
border: @arrow-size solid transparent;
border-right-color: #fff;
border-left-width: 0;
}
}