UNPKG

@yuebai008/cli

Version:

Command line interface for rapid qg-minigame development

1 lines 8.52 kB
export default{cssContent:"/*\n * Copyright 2015 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n:host {\n overflow: hidden;\n align-items: stretch;\n flex: auto;\n background-color: var(--sys-color-cdt-base-container);\n}\n\n.device-mode-toolbar {\n flex: none;\n background-color: var(--sys-color-cdt-base);\n border-bottom: 1px solid var(--sys-color-divider);\n display: flex;\n flex-direction: row;\n align-items: stretch;\n}\n\n.device-mode-toolbar .toolbar {\n overflow: hidden;\n flex: 0 100000 auto;\n padding: 0 5px;\n}\n\n.device-mode-toolbar .toolbar.device-mode-toolbar-fixed-size {\n flex: 0 1 auto;\n}\n\n.device-mode-toolbar-options.toolbar {\n position: sticky;\n right: 0;\n flex: none;\n}\n\n.device-mode-toolbar-spacer {\n flex: 1 1 0;\n display: flex;\n flex-direction: row;\n overflow: hidden;\n}\n\n.device-mode-content-clip {\n overflow: hidden;\n flex: auto;\n}\n\n.device-mode-media-container {\n flex: none;\n overflow: hidden;\n box-shadow: inset 0 -1px var(--sys-color-divider);\n}\n\n.device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-media-container {\n margin-bottom: 20px;\n}\n\n.device-mode-presets-container {\n flex: 0 0 20px;\n display: flex;\n}\n\n.device-mode-presets-container-inner {\n flex: auto;\n justify-content: center;\n position: relative;\n background-color: var(--sys-color-surface1);\n /* border: 2px solid var(--color-background-elevation-0); */\n border-bottom: 1px solid var(--sys-color-divider);\n}\n\n.device-mode-presets-container:hover {\n transition: opacity 0.1s;\n transition-delay: 50ms;\n opacity: 100%;\n}\n\n.device-mode-preset-bar-outer {\n pointer-events: none;\n display: flex;\n justify-content: center;\n}\n\n.device-mode-preset-bar {\n border-left: 2px solid var(--sys-color-on-base-divider);\n border-right: 2px solid var(--sys-color-on-base-divider);\n pointer-events: auto;\n text-align: center;\n flex: none;\n color: var(--color-text-primary);\n display: flex;\n align-items: center;\n justify-content: center;\n white-space: nowrap;\n margin-bottom: 1px;\n}\n\n.device-mode-preset-bar:hover {\n transition: background-color 0.1s;\n transition-delay: 50ms;\n background-color: var(--sys-color-state-hover-on-subtle);\n}\n\n.device-mode-preset-bar > span {\n visibility: hidden;\n}\n\n.device-mode-preset-bar:hover > span {\n transition: visibility 0.1s;\n transition-delay: 50ms;\n visibility: visible;\n}\n\n.device-mode-content-area {\n flex: auto;\n position: relative;\n margin: 0;\n}\n\n.device-mode-screen-area {\n position: absolute;\n left: 0;\n right: 0;\n width: 0;\n height: 0;\n background-color: var(--color-background-inverted);\n}\n\n.device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area {\n --override-screen-area-box-shadow: hsl(240deg 3% 84%) 0 0 0 0.5px, hsl(0deg 0% 80% / 40%) 0 0 20px;\n\n box-shadow: var(--override-screen-area-box-shadow);\n}\n\n.-theme-with-dark-background .device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area,\n:host-context(.-theme-with-dark-background) .device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area {\n --override-screen-area-box-shadow: rgb(40 40 42) 0 0 0 0.5px, rgb(51 51 51 / 40%) 0 0 20px;\n}\n\n.device-mode-screen-image {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n}\n\n.device-mode-resizer {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n transition: background-color 0.1s ease, opacity 0.1s ease;\n}\n\n.device-mode-resizer:hover {\n background-color: var(--sys-color-state-hover-on-subtle);\n opacity: 100%;\n}\n\n.device-mode-resizer > div {\n pointer-events: none;\n}\n\n.device-mode-right-resizer {\n top: 0;\n bottom: -1px;\n right: -20px;\n width: 20px;\n}\n\n.device-mode-left-resizer {\n top: 0;\n bottom: -1px;\n left: -20px;\n width: 20px;\n opacity: 0%;\n}\n\n.device-mode-bottom-resizer {\n left: 0;\n right: -1px;\n bottom: -20px;\n height: 20px;\n}\n\n.device-mode-bottom-right-resizer {\n left: 0;\n top: 0;\n right: -20px;\n bottom: -20px;\n background-color: var(--sys-color-surface1);\n}\n\n.device-mode-bottom-left-resizer {\n left: -20px;\n top: 0;\n right: 0;\n bottom: -20px;\n opacity: 0%;\n}\n\n.device-mode-right-resizer > div {\n content: var(--image-file-resizeHorizontal);\n width: 6px;\n height: 26px;\n}\n\n.device-mode-left-resizer > div {\n content: var(--image-file-resizeHorizontal);\n width: 6px;\n height: 26px;\n}\n\n.device-mode-bottom-resizer > div {\n content: var(--image-file-resizeVertical);\n margin-bottom: -2px;\n width: 26px;\n height: 6px;\n}\n\n.device-mode-bottom-right-resizer > div {\n position: absolute;\n bottom: 3px;\n right: 3px;\n width: 13px;\n height: 13px;\n content: var(--image-file-resizeDiagonal);\n}\n\n.device-mode-bottom-left-resizer > div {\n position: absolute;\n bottom: 3px;\n left: 3px;\n width: 13px;\n height: 13px;\n content: var(--image-file-resizeDiagonal);\n transform: rotate(90deg);\n}\n\n.device-mode-page-area {\n position: absolute;\n left: 0;\n right: 0;\n width: 0;\n height: 0;\n display: flex;\n background-color: var(--sys-color-cdt-base-container);\n}\n\n.device-mode-ruler {\n position: absolute;\n overflow: visible;\n}\n\n.device-mode-ruler-top {\n height: 20px;\n right: 0;\n}\n\n.device-mode-ruler-left {\n width: 20px;\n bottom: 0;\n}\n\n.device-mode-ruler-content {\n pointer-events: none;\n position: absolute;\n left: -20px;\n top: -20px;\n\n --override-device-ruler-border-color: hsl(0deg 0% 50%);\n}\n\n.device-mode-ruler-top .device-mode-ruler-content {\n border-top: 1px solid transparent;\n right: 0;\n bottom: 20px;\n background-color: var(--color-background-opacity-80);\n}\n\n.device-mode-ruler-left .device-mode-ruler-content {\n border-left: 1px solid transparent;\n border-top: 1px solid transparent;\n right: 20px;\n bottom: 0;\n}\n\n.-theme-with-dark-background .device-mode-ruler-content,\n:host-context(.-theme-with-dark-background) .device-mode-ruler-content {\n --override-device-ruler-border-color: rgb(127 127 127);\n}\n\n.device-mode-content-clip.device-mode-outline-visible .device-mode-ruler-top .device-mode-ruler-content {\n border-top: 1px solid var(--override-device-ruler-border-color);\n}\n\n.device-mode-content-clip.device-mode-outline-visible .device-mode-ruler-left .device-mode-ruler-content {\n border-left: 1px solid var(--override-device-ruler-border-color);\n border-top: 1px solid var(--override-device-ruler-border-color);\n}\n\n.device-mode-ruler-inner {\n position: absolute;\n}\n\n.device-mode-ruler-top .device-mode-ruler-inner {\n top: 0;\n bottom: 0;\n left: 20px;\n right: 0;\n border-bottom: 1px solid var(--override-device-ruler-border-color);\n}\n\n.device-mode-ruler-left .device-mode-ruler-inner {\n left: 0;\n right: 0;\n top: 19px;\n bottom: 0;\n border-right: 1px solid var(--override-device-ruler-border-color);\n background-color: var(--color-background-opacity-80);\n}\n\n.device-mode-ruler-marker {\n position: absolute;\n}\n\n.device-mode-ruler-top .device-mode-ruler-marker {\n width: 0;\n height: 5px;\n bottom: 0;\n border-right: 1px solid var(--override-device-ruler-border-color);\n margin-right: -1px;\n}\n\n.device-mode-ruler-top .device-mode-ruler-marker.device-mode-ruler-marker-medium {\n height: 10px;\n}\n\n.device-mode-ruler-top .device-mode-ruler-marker.device-mode-ruler-marker-large {\n height: 15px;\n}\n\n.device-mode-ruler-left .device-mode-ruler-marker {\n height: 0;\n width: 5px;\n right: 0;\n border-bottom: 1px solid var(--override-device-ruler-border-color);\n margin-bottom: -1px;\n}\n\n.device-mode-ruler-left .device-mode-ruler-marker.device-mode-ruler-marker-medium {\n width: 10px;\n}\n\n.device-mode-ruler-left .device-mode-ruler-marker.device-mode-ruler-marker-large {\n width: 15px;\n}\n\n.device-mode-ruler-text {\n color: var(--color-text-secondary);\n position: relative;\n pointer-events: auto;\n}\n\n.device-mode-ruler-text:hover {\n color: var(--color-text-primary);\n}\n\n.device-mode-ruler-top .device-mode-ruler-text {\n left: 2px;\n top: -2px;\n}\n\n.device-mode-ruler-left .device-mode-ruler-text {\n left: -4px;\n top: -15px;\n transform: rotate(270deg);\n}\n"};