UNPKG

chrome-devtools-frontend

Version:
75 lines (62 loc) 1.68 kB
/* * Copyright 2024 The Chromium Authors. All rights reserved. * Use of this source code is governed by a BSD-style license that can be * found in the LICENSE file. */ :host { width: fit-content; height: fit-content; } button { padding: 0; margin: 0; background: 0; border: 0; position: relative; width: var(--sys-size-8); height: var(--sys-size-8); box-shadow: var(--sys-elevation-level2); border-radius: var(--sys-shape-corner-extra-small); display: flex; justify-content: center; align-items: center; :host-context(:not(.theme-with-dark-background)) & { background-color: var(--sys-color-tonal-container); } :host-context(.theme-with-dark-background) & { background-color: var(--sys-color-primary); } & > devtools-icon { width: var(--sys-size-7); height: var(--sys-size-7); } :host-context(:not(.theme-with-dark-background)) & > devtools-icon { color: var(--sys-color-on-tonal-container); } :host-context(.theme-with-dark-background) & > devtools-icon { color: var(--sys-color-on-primary); } &:not(:disabled):hover::after, &:not(:disabled):hover::before { content: ""; height: 100%; width: 100%; border-radius: inherit; position: absolute; top: 0; left: 0; } &:not(:disabled):hover::after { background-color: var(--sys-color-state-hover-on-subtle); } &:not(:disabled):active::before { background-color: var(--sys-color-state-ripple-neutral-on-subtle); } &:focus-visible { outline: 2px solid var(--sys-color-state-focus-ring); outline-offset: 2px; } &:disabled > devtools-icon { color: var(--sys-color-state-disabled); } }