@fancyapps/ui/dist/shared/buttons.css

Robust JavaScript UI Component Library

:root{--f-button-width: 40px;--f-button-height: 40px;--f-button-border: 0;--f-button-border-radius: 0;--f-button-color: #374151;--f-button-bg: #f8f8f8;--f-button-shadow: none;--f-button-transition: all .15s ease;--f-button-transform: none;--f-button-outline-width: 1px;--f-button-outline-color: rgba(0, 0, 0, .7);--f-button-svg-width: 20px;--f-button-svg-height: 20px;--f-button-svg-stroke-width: 1.5;--f-button-svg-fill: none;--f-button-svg-filter: none;--f-button-svg-opacity: 1;--f-button-svg-disabled-opacity: .5;--f-button-svg-transition: opacity .15s ease;--f-button-svg-transform: none}.f-button{width:var(--f-button-width);height:var(--f-button-height);border:var(--f-button-border);border-radius:var(--f-button-border-radius);color:var(--f-button-color);background:var(--f-button-bg);box-shadow:var(--f-button-shadow);transform:var(--f-button-transform);transition:var(--f-button-transition);backdrop-filter:var(--f-button-backdrop-filter);display:flex;justify-content:center;align-items:center;box-sizing:content-box;position:relative;margin:0;padding:0;pointer-events:all;cursor:pointer;overflow:hidden}@media (hover: hover){.f-button:hover:not([aria-disabled]){color:var(--f-button-hover-color, var(--f-button-color));background-color:var(--f-button-hover-bg, var(--f-button-bg))}}.f-button:active:not([aria-disabled]){color:var(--f-button-active-color, var(--f-button-hover-color, var(--f-button-color)));background-color:var(--f-button-active-bg, var(--f-button-hover-bg, var(--f-button-bg)))}.f-button:focus{outline:none}.f-button:focus-visible{outline:var(--f-button-outline-width) solid var(--f-button-outline-color);outline-offset:var(--f-button-outline-offset);position:relative;z-index:1}.f-button svg{width:var(--f-button-svg-width);height:var(--f-button-svg-height);transform:var(--f-button-svg-transform);fill:var(--f-button-svg-fill);filter:var(--f-button-svg-filter);opacity:var(--f-button-svg-opacity, 1);transition:var(--f-button-svg-transition);stroke:currentColor;stroke-width:var(--f-button-svg-stroke-width);stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.f-button[aria-disabled]{cursor:default}.f-button[aria-disabled] svg{opacity:var(--f-button-svg-disabled-opacity)}