/* Copyright 2022 The Chromium Authors
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file. */
/* #css_wrapper_metadata_start
* #type=style
* #scheme=relative
* #css_wrapper_metadata_end */
cr-button {
border-color: var(--cros-button-stroke-color-secondary);
border-radius: 16px;
}
/* TODO: After Jelly launches, most of the cr-button colors can be removed. */
cr-button.primary {
background-color: var(--cros-button-background-color-primary);
border: 0;
--text-color: var(--cros-button-label-color-primary);
--ink-color: var(--cros-button-ripple-color-primary);
--hover-bg-color: var(--cros-button-background-color-primary-hover-preblended);
--disabled-bg: var(--cros-button-background-color-primary-disabled);
--disabled-text-color: var(--cros-button-label-color-primary-disabled);
}
cr-button.primary:active {
box-shadow: none;
}
cr-button.primary:hover {
background-color: var(--cros-button-background-color-primary-hover-preblended);
}
cr-button.secondary {
background-color: var(--cros-button-background-color-secondary);
border: 1px solid var(--cros-button-stroke-color-secondary);
--text-color: var(--cros-button-label-color-secondary);
--border-color: var(--cros-button-stroke-color-secondary);
--ink-color: var(--cros-button-ripple-color-secondary);
--hover-border-color: var(--cros-button-stroke-color-secondary-hover);
--hover-bg-color: var(--cros-button-background-color-secondary-hover);
--disabled-text-color: var(--cros-button-label-color-secondary-disabled);
--disabled-border-color: var(--cros-button-stroke-color-secondary-disabled);
}
cr-button.secondary:hover {
background-color: var(--cros-button-background-color-secondary-hover);
}
cr-icon-button:focus-visible,
cr-button:focus-visible {
box-shadow: none;
outline: 2px solid var(--cros-sys-focus_ring, rgba(var(--cros-focus-ring-color-rgb), 0.8));
}
cr-icon-button:hover,
cr-button:hover {
background-color: var(--cros-ripple-color);
box-shadow: none;
}
cr-button[aria-pressed=true],
cr-button[aria-selected=true] {
background-color: var(--cros-sys-highlight_shape, var(--cros-highlight-color));
border: none;
}
iron-icon {
--iron-icon-height: 20px;
--iron-icon-width: 20px;
}
cr-icon-button {
--cr-icon-button-fill-color: var(--cros-menu-icon-color);
}