gecko-dev/toolkit/themes/shared/findBar.inc.css

/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

findbar {
  border-top: 1px solid ThreeDShadow;
  min-width: 1px;
  transition-property: margin-bottom, opacity, visibility;
  transition-duration: 150ms, 150ms, 0s;
  transition-timing-function: ease-in-out, ease-in-out, linear;
}

findbar[hidden] {
  /* Override display:none to make the transition work. */
  display: -moz-box;
  visibility: collapse;
  margin-bottom: -1em;
  opacity: 0;
  transition-delay: 0s, 0s, 150ms;
}

findbar[noanim] {
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}

.findbar-container {
  padding-inline-start: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.findbar-closebutton {
  padding: 0 8px;
}

/* Search field */

/* Don't apply theme colors on findbar when header image is applied to avoid
contrast issues, see bug 1506913 */
:root[lwtheme-image] findbar {
  --lwt-toolbar-field-background-color: initial;
  --lwt-toolbar-field-color: initial;
  --lwt-toolbar-field-border-color: initial;
  --lwt-toolbar-field-focus: initial;
  --lwt-toolbar-field-focus-color: initial;
}

html|input.findbar-textbox {
  -moz-appearance: none;
  background-color: -moz-Field;
  border: 1px solid var(--lwt-toolbar-field-border-color, ThreeDShadow);
  border-start-start-radius: 2px;
  border-end-start-radius: 2px;
  margin: 0;
  padding: 2px 5px;
  width: 14em;
}

html|input.findbar-textbox:-moz-lwtheme {
  background-color: var(--lwt-toolbar-field-background-color, -moz-Field);
  color: var(--lwt-toolbar-field-color, -moz-FieldText);
}

html|input.findbar-textbox:focus {
  background-color: var(--lwt-toolbar-field-focus, var(--lwt-toolbar-field-background-color, -moz-Field));
  color: var(--lwt-toolbar-field-focus-color, var(--lwt-toolbar-field-color, -moz-FieldText));
  border-color: var(--toolbar-field-focus-border-color, Highlight);
}

html|input.findbar-textbox[status="notfound"] {
  background-color: rgba(255,0,57,.3);
  color: inherit;
}

html|input.findbar-textbox[flash="true"] {
  background-color: rgba(255,233,0,.3);
  color: inherit;
}

html|input.findbar-textbox.minimal {
  border-radius: 2px;
}

.findbar-find-previous,
.findbar-find-next {
  margin-inline-start: 0;
  -moz-appearance: none;
  background: rgba(255,255,255,.2);
  border: 1px solid ThreeDShadow;
  padding: 2px 5px;
  line-height: 1em;
  -moz-context-properties: fill;
  fill: currentColor;
  color: inherit;
}

.findbar-find-previous:not([disabled]):hover,
.findbar-find-next:not([disabled]):hover {
  background: rgba(190,190,190,.2);
}

.findbar-find-previous:not([disabled]):hover:active,
.findbar-find-next:not([disabled]):hover:active {
  background: rgba(23,50,76,.2);
  box-shadow: 0 1px 2px rgba(10,31,51,.2) inset;
}

.findbar-find-previous {
  list-style-image: url(chrome://global/skin/icons/find-previous-arrow.svg);
  border-right-width: 0;
  border-left-width: 0;
  margin-inline-end: 0;
}

.findbar-find-next {
  list-style-image: url(chrome://global/skin/icons/find-next-arrow.svg);
  border-start-end-radius: 2px;
  border-end-end-radius: 2px;
}

.findbar-find-next:-moz-lwtheme,
.findbar-find-previous:-moz-lwtheme {
  border-color: var(--lwt-toolbar-field-border-color, ThreeDShadow);
}

.findbar-find-previous > .toolbarbutton-icon,
.findbar-find-next > .toolbarbutton-icon {
  margin: 0;
}

.findbar-find-previous[disabled="true"] > .toolbarbutton-icon,
.findbar-find-next[disabled="true"] > .toolbarbutton-icon {
  opacity: .4;
}

.findbar-highlight,
.findbar-case-sensitive,
.findbar-entire-word {
  margin-inline-start: 5px;
}

.findbar-highlight > .toolbarbutton-icon,
.findbar-case-sensitive > .toolbarbutton-icon,
.findbar-entire-word > .toolbarbutton-icon {
  display: none;
}

.findbar-find-status,
.found-matches {
  color: GrayText;
  margin: 0 !important;
  margin-inline-start: 12px !important;
}

.findbar-find-status:-moz-lwtheme,
.found-matches:-moz-lwtheme {
  color: inherit;
  opacity: .6;
}

.find-status-icon[status="pending"] {
  list-style-image: url("chrome://global/skin/icons/loading.png");
}

@media (min-resolution: 1.1dppx) {
  .find-status-icon[status="pending"] {
    width: 16px;
    list-style-image: url("chrome://global/skin/icons/loading@2x.png");
  }
}