starlight-digital-garden
Version:
Digital garden for starlight
53 lines (47 loc) • 1.16 kB
CSS
.pan-zoom-button {
outline: none;
margin: 0;
width: auto;
overflow: visible;
background: transparent;
/* inherit font & color from ancestor */
font: inherit;
/* Corrects font smoothing for webkit */
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
/* Corrects inability to style clickable input types in iOS */
-webkit-appearance: none;
appearance: none;
color: var(--sl-color-white);
background-color: var(--sl-color-bg);
margin-block: 1rem;
margin-inline-end: 1rem;
align-items: center;
border: 1px solid var(--sl-color-white);
border-radius: 999rem;
display: inline-flex;
font-size: var(--sl-text-sm);
gap: 0.5em;
line-height: 1.1875;
outline-offset: 0.25rem;
padding: 0.4375rem 1.125rem;
cursor: pointer;
}
.pan-zoom-button:active {
background-color: var(--sl-color-accent);
color: var(--sl-color-black);
border-color: transparent;
}
.pan-zoom-button::-moz-focus-inner {
border: 0;
padding: 0;
}
.pan-zoom-button:focus {
outline: none;
}
.pan-zoom-button:focus:not(:focus-visible) {
outline: none;
}
.pan-zoom-button:focus:not(:-moz-focusring) {
outline: none;
}