@quick-game/cli/dist/cli-server/client/front_end/panels/elements/stylesSidebarPane.css.js

Command line interface for rapid qg development

// Copyright 2023 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.
// IMPORTANT: this file is auto generated. Please do not edit this file.
/* istanbul ignore file */
const styles = new CSSStyleSheet();
styles.replaceSync(
`/**
 * Copyright 2017 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.
 */

.styles-section {
  min-height: 18px;
  white-space: nowrap;
  user-select: text;
  border-bottom: 1px solid var(--sys-color-divider);
  position: relative;
  overflow: hidden;

  > div {
    padding: 2px 2px 4px 4px;
  }

  &:last-child {
    border-bottom: none;
  }

  &.has-open-popover {
    z-index: 1;
  }

  &.read-only {
    background-color: var(--color-background-opacity-50);
    font-style: italic;
  }

  &:focus-visible,
  &.read-only:focus-visible {
    background-color: var(--color-background-elevation-2);
  }

  .simple-selector.filter-match {
    background-color: var(--color-match-highlight);
    color: var(--color-text-primary);
  }

  .devtools-link {
    user-select: none;
  }

  .styles-section-subtitle devtools-icon {
    margin-bottom: -4px;
  }

  .styles-section-subtitle .devtools-link {
    color: var(--text-primary);
    text-decoration-color: hsl(0deg 0% 60%);
    outline-offset: 0;
  }

  .selector,
  .try-rule-selector-element {
    color: var(--text-disabled);
  }

  .simple-selector.selector-matches,
  &.keyframe-key {
    color: var(--text-primary);
  }

  .style-properties {
    margin: 0;
    padding: 2px 4px 0 0;
    list-style: none;
    clear: both;
    display: flex;
  }

  &.matched-styles .style-properties {
    padding-left: 0;
  }

  & span.simple-selector:hover {
    text-decoration: var(--override-styles-section-text-hover-text-decoration);
    cursor: var(--override-styles-section-text-hover-cursor);
  }

  &.styles-panel-hovered:not(.read-only),
  &.styles-panel-hovered:not(.read-only) devtools-css-query {
    --override-styles-section-text-hover-text-decoration: underline;
    --override-styles-section-text-hover-cursor: default;
  }
}

.sidebar-pane-closing-brace {
  clear: both;
}

.styles-section-title {
  background-origin: padding;
  background-clip: padding;
  word-wrap: break-word;
  white-space: normal;

  .ancestor-rule-list {
    color: var(--text-disabled);
  }
}

.styles-section-subtitle {
  color: var(--text-secondary);
  float: right;
  padding-left: 15px;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  height: 15px;
  margin-bottom: -1px;
}

.sidebar-pane-open-brace,
.sidebar-pane-closing-brace {
  color: var(--text-primary);
}

@keyframes styles-element-state-pane-slidein {
  from {
    margin-top: -60px;
  }

  to {
    margin-top: 0;
  }
}

@keyframes styles-element-state-pane-slideout {
  from {
    margin-top: 0;
  }

  to {
    margin-top: -60px;
  }
}

.styles-sidebar-toolbar-pane {
  position: relative;
  animation-duration: 0.1s;
  animation-direction: normal;
}

.styles-sidebar-toolbar-pane-container {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.styles-selector {
  cursor: text;
}

.styles-sidebar-pane-toolbar-container {
  --override-toolbar-background-color: var(--sys-color-cdt-base-container);

  flex-shrink: 0;
  overflow: hidden;
  position: sticky;
  top: 0;
  background-color: var(--override-toolbar-background-color);
  z-index: 2;
}

.styles-sidebar-pane-toolbar {
  border-bottom: 1px solid var(--sys-color-divider);
  flex-shrink: 0;
}

.font-toolbar-hidden {
  visibility: hidden;
}

.styles-sidebar-pane-filter-box {
  flex: auto;
  display: flex;

  > input {
    border: solid 1px var(--sys-color-neutral-outline);
    border-radius: 4px;
    width: 100%;
    background: var(--sys-color-cdt-base-container);
    padding-left: 4px;
    margin: 3px;

    &:focus,
    &:not(:placeholder-shown) {
      border-color: var(--sys-color-state-focus-ring);
    }

    &:hover:not(:focus) {
      background: var(--sys-color-state-hover-on-subtle);
    }

    &::placeholder {
      color: var(--color-text-secondary);
    }
  }
}

.sidebar-separator {
  background-color: var(--sys-color-surface2);
  padding: 0 5px;
  border-bottom: 1px solid var(--sys-color-divider);
  color: var(--color-text-secondary);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 22px;

  > span.monospace {
    max-width: 180px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    margin-left: 2px;
  }

  &.layer-separator {
    display: flex;
  }

  &.empty-section {
    border-bottom: none;
  }
}

.sidebar-pane-section-toolbar {
  position: absolute;
  right: 0;
  bottom: -1px;
  z-index: 0;

  &.new-rule-toolbar {
    visibility: hidden;
    margin-bottom: 5px;

    --toolbar-height: 16px;
  }

  &.shifted-toolbar {
    padding-right: 32px;
  }
}

.styles-pane:not(.is-editing-style) .styles-section.matched-styles:not(.read-only):hover .sidebar-pane-section-toolbar.new-rule-toolbar {
  visibility: visible;
}

.styles-show-all {
  margin-left: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: -webkit-fill-available;
}

@media (forced-colors: active) {
  .styles-sidebar-pane-filter-box > input {
    border: 1px solid ButtonText;
    background: ButtonFace;
  }

  .sidebar-pane-section-toolbar {
    forced-color-adjust: none;
    border-color: 1px solid ButtonText;
    background-color: ButtonFace;
  }

  .styles-section {
    &:focus-visible,
    &.read-only:focus-visible {
      forced-color-adjust: none;
      background-color: Highlight;
    }

    .styles-section-subtitle {
      .devtools-link {
        color: linktext;
        text-decoration-color: linktext;

        &:focus-visible {
          color: HighlightText;
        }
      }
    }

    &:focus-visible *,
    &.read-only:focus-visible *,
    &:focus-visible .styles-section-subtitle .devtools-link {
      color: HighlightText;
      text-decoration-color: HighlightText;
    }

    &:focus-visible .sidebar-pane-section-toolbar {
      background-color: ButtonFace;
    }

    &:focus-visible {
      --webkit-css-property-color: HighlightText;
    }
  }
}

.spinner::before {
  --dimension: 24px;

  margin-top: 2em;
  left: calc(50% - var(--dimension) / 2);
}

.section-block-expand-icon {
  margin-bottom: -4px;
}

/*# sourceURL=stylesSidebarPane.css */
`);
export default styles;