Small Button (default)
CODE
×
HTML
<button class='btn btn-secondary small' data-filter='all'>All</button>
CSS
button.btn.btn-secondary.small { font-family: var(--body-font-boldstrong-1); font-style: var(--body-font-boldstrong-2); font-weight: var(--body-font-boldstrong-3); border-top-left-radius: var(--br2-1); border-top-right-radius: var(--br2-2); border-bottom-left-radius: var(--br2-3); border-bottom-right-radius: var(--br2-4); border-width: var(--lw4); padding-left: var(--pl-b); padding-bottom: var(--pb-b); padding-right: var(--pr-b); padding-top: var(--pt-b); width:auto; background-color:transparent; letter-spacing: var(--bls); word-spacing: var(--bws); text-transform: var(--btt); font-size: var(--fs-xxs); border-color: var(--lc7); color: var(--fsb); margin-top: 12px; margin-right: 12px; margin-bottom: 12px; margin-left: 12px; } @media screen and (max-width: 575px) { button.btn.btn-secondary.small { width:auto; } } .btn.small { border-radius: 30px !important; } @media screen and (max-width: 389px) { .btn.small { width: auto; } } .btn.small:not(.active):focus, .btn.small:not(.active):focus-visible { color: var(--fpb) !important; background-color: var(--bsc2) !important; border-color: var(--lsc2) !important; } .btn.small:not(.active):hover { color: var(--fsc2) !important; background-color: var(--bsc4) !important; border-color: var(--lsc1) !important; }
JS
Small Button (default)
Last Edit: Oct 31, 2023, 11:31am
×
All