2 * Copyright (C) 2006, 2007, 2008 Apple Inc. All rights reserved.
3 * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
5 * Redistribution and use in source and binary forms, with or without
6 * modification, are permitted provided that the following conditions
9 * 1. Redistributions of source code must retain the above copyright
10 * notice, this list of conditions and the following disclaimer.
11 * 2. Redistributions in binary form must reproduce the above copyright
12 * notice, this list of conditions and the following disclaimer in the
13 * documentation and/or other materials provided with the distribution.
14 * 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of
15 * its contributors may be used to endorse or promote products derived
16 * from this software without specific prior written permission.
18 * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY
19 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
20 * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
21 * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY
22 * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
23 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
24 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
25 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
26 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
27 * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
30 input[type="search"]:focus,
31 input[type="text"]:focus {
32 outline: auto 5px -webkit-focus-ring-color;
35 input[type="checkbox"] {
47 box-shadow: 0 0 3px highlight;
50 fieldset[disabled] label:hover input {
69 flex-direction: row !important;
75 flex-direction: column !important;
84 display: inline-block;
88 display: none !important;
92 background-color: white;
103 white-space: nowrap !important;
106 .toolbar-background {
107 background-image: linear-gradient(to bottom, rgb(191, 191, 191), rgb(151, 151, 151));
109 border-bottom: 1px solid rgb(64%, 64%, 64%);
110 background-origin: padding-box;
111 background-clip: padding-box;
121 .toolbar .tabbed-pane-header {
125 .toolbar .tabbed-pane-header-contents {
129 .toolbar .tabbed-pane-header-tab {
130 border-width: 0 2px 0 2px;
135 .toolbar .tabbed-pane-header-tab.selected {
136 border-width: 0 2px 0 2px;
137 -webkit-border-image: url(Images/toolbarItemSelected.png) 0 2 0 2;
140 .toolbar button.status-bar-item {
148 font-family: inherit;
152 body.inactive .toolbar-background {
153 background-image: linear-gradient(to bottom, rgb(233, 233, 233), rgb(207, 207, 207));
156 body.dock-to-bottom .toolbar-background {
160 body.dock-to-bottom .toolbar-background .tabbed-pane-header {
164 body.dock-to-bottom .toolbar-background .tabbed-pane-header .tabbed-pane-header-tabs {
168 body.platform-windows .toolbar-background,
169 body.platform-windows.inactive .toolbar-background {
170 background-image: none;
173 body.undocked.platform-mac-leopard .toolbar-background {
174 background-image: linear-gradient(to bottom, rgb(175, 175, 175), rgb(151, 151, 151)) !important;
175 color: #333 !important;
178 body.undocked.platform-mac-leopard.inactive .toolbar-background {
179 background-image: linear-gradient(to bottom, rgb(221, 221, 221), rgb(207, 207, 207)) !important;
180 color: #555 !important;
183 body.undocked.platform-mac-snowleopard .toolbar-background {
184 background-image: linear-gradient(to bottom, rgb(189, 189, 189), rgb(167, 167, 167)) !important;
185 color: #333 !important;
188 body.undocked.platform-mac-snowleopard.inactive .toolbar-background {
189 background-image: linear-gradient(to bottom, rgb(228, 228, 228), rgb(216, 216, 216)) !important;
190 color: #555 !important;
193 body.undocked.platform-mac .toolbar-background {
194 background-image: linear-gradient(to bottom, rgb(208, 208, 208), rgb(200, 200, 200)) !important;
195 color: #333 !important;
198 body.undocked.platform-mac.inactive .toolbar-background {
199 background-image: linear-gradient(to bottom, rgb(238, 238, 238), rgb(224, 224, 224)) !important;
200 color: #555 !important;
203 .toolbar > .tabbed-pane-header {
207 .toolbar-controls-left {
213 .toolbar-controls-right {
219 .toolbar-controls-right #remote-device-count,
220 .toolbar-controls-right #error-warning-count,
221 .toolbar-controls-right .console-status-bar-item,
222 .toolbar-controls-right .settings-status-bar-item,
223 .toolbar-controls-right .dock-status-bar-item
228 .scrollable-content {
237 .scrollable-content::-webkit-scrollbar {
241 .scrollable-content::-webkit-scrollbar-corner,
242 .scrollable-content::-webkit-resizer {
246 .scrollable-content::-webkit-scrollbar-thumb:vertical {
247 background: linear-gradient(to right, rgb(192, 192, 192), rgb(214, 214, 214) 40%, rgb(192, 192, 192));
252 .scrollable-content::-webkit-scrollbar-thumb:vertical:hover,
253 .scrollable-content::-webkit-scrollbar-thumb:vertical:active {
254 background: linear-gradient(to right, rgb(230, 230, 230), rgb(252, 252, 252) 40%, rgb(230, 230, 230));
257 .scrollable-content::-webkit-scrollbar-track:vertical {
258 background: linear-gradient(to right, rgb(128, 128, 128), rgb(164, 164, 164) 25%, rgb(164, 164, 164));
263 -webkit-appearance: none;
270 .search-replace:focus {
274 #search-input-field {
286 .toolbar-search td > span {
290 .toolbar-search-navigation-controls {
292 background-image: linear-gradient(rgb(228, 228, 228), rgb(206, 206, 206));
295 .toolbar-search-navigation {
296 display: inline-block;
299 background-repeat: no-repeat;
300 background-position: 4px 7px;
301 border-left: 1px solid rgb(170, 170, 170);
305 .toolbar-search-navigation.enabled {
309 .toolbar-search label {
313 .toolbar-search button {
314 border: 1px solid rgb(163, 163, 163);
317 background-image: linear-gradient(rgb(241, 241, 241), rgb(220, 220, 220));
322 .toolbar-search button:active {
323 background-image: linear-gradient(rgb(185, 185, 185), rgb(156, 156, 156));
326 .toolbar-search-control {
327 display: -webkit-flex;
330 background-color: white;
331 border: 1px solid rgb(163, 163, 163);
337 .toolbar-replace-control {
338 border: 1px solid rgb(163, 163, 163);
345 .toolbar-search-navigation.enabled:active {
346 background-position: 4px 7px, 0 0;
349 .toolbar-search-navigation.toolbar-search-navigation-prev {
350 background-image: url(Images/searchPrev.png);
351 border-left: 1px solid rgb(163, 163, 163);
354 .toolbar-search-navigation.toolbar-search-navigation-prev.enabled:active {
355 background-image: url(Images/searchPrev.png), linear-gradient(rgb(168, 168, 168), rgb(116, 116, 116));
358 .toolbar-search-navigation.toolbar-search-navigation-next {
359 background-image: url(Images/searchNext.png);
360 border-left: 1px solid rgb(230, 230, 230);
363 .toolbar-search-navigation.toolbar-search-navigation-next.enabled:active {
364 background-image: url(Images/searchNext.png), linear-gradient(rgb(168, 168, 168), rgb(116, 116, 116));
367 .search-results-matches {
368 display: inline-block;
373 color: rgb(165, 165, 165);
378 background-image: url(Images/statusbarButtonGlyphs.png);
379 background-size: 320px 144px;
380 display: inline-block;
386 background-position: -128px -96px;
392 background-position: -175px -96px;
395 @media (-webkit-min-device-pixel-ratio: 1.5) {
398 background-image: url(Images/statusbarButtonGlyphs_2x.png);
402 .close-button:hover {
403 background-position: -96px -96px;
406 .close-button:active {
407 background-position: -111px -96px;
410 .close-button-gray:hover {
411 background-position: -143px -96px;
414 .close-button-gray:active {
415 background-position: -160px -96px;
418 body.undocked .toolbar-item .close-button {
422 body.remote .toolbar-item .close-button {
429 background-color: white;
434 .panel-status-bar > div {
438 .panel-status-bar label {
453 border-top: 1px solid rgb(202, 202, 202);
454 display: -webkit-flex;
458 display: inline-flex;
463 display: inline-block;
469 border: 0 transparent none;
470 background-color: transparent;
483 #drawer-view-anchor {
484 display: inline-block;
487 .status-bar-item:active {
498 background-color: rgba(0, 0, 0, 0.75);
505 background-color: white;
510 background-color: rgba(0, 0, 0, 0.75);
511 -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
512 -webkit-mask-position: -288px -48px;
513 -webkit-mask-size: 320px 144px;
517 @media (-webkit-min-device-pixel-ratio: 1.5) {
519 -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
523 .long-click-glyph.shadow {
525 background-color: white !important;
529 button.status-bar-item {
534 .status-bar button.status-bar-item .glyph {
538 button.status-bar-item .glyph.shadow {
539 background-color: rgba(255, 255, 255, 0.33);
542 button.status-bar-item.toggled-on .glyph:not(.shadow) {
543 background-color: rgb(66, 129, 235) !important;
546 button.status-bar-item:hover .glyph {
550 button.status-bar-item:active .glyph {
554 button.status-bar-item:disabled {
555 background-position: 0 0 !important;
558 button.status-bar-item:disabled .glyph {
559 opacity: 0.5 !important;
562 button.status-bar-item.extension {
563 background-image: none;
566 .status-bar-select-container {
567 display: inline-flex;
571 .status-bar-select-arrow {
572 background-image: url(Images/statusbarButtonGlyphs.png);
573 background-size: 320px 144px;
577 background-position: -18px -96px;
578 display: inline-block;
579 pointer-events: none;
583 @media (-webkit-min-device-pixel-ratio: 1.5) {
584 .status-bar-select-arrow {
585 background-image: url(Images/statusbarButtonGlyphs_2x.png);
589 input.status-bar-item {
594 background-color: white;
595 border: solid 1px rgb(236, 236, 236);
598 input.status-bar-item:focus,
599 input.status-bar-item:hover {
600 border: solid 1px rgb(202, 202, 202);
603 select.status-bar-item {
605 color: rgb(48, 48, 48);
606 text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
607 -webkit-appearance: none;
610 padding: 0 15px 0 5px;
616 .status-bar-item.checkbox {
617 margin: auto 6px auto 0;
622 .status-bar-item > .glyph {
623 -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
624 -webkit-mask-size: 320px 144px;
628 .console-filter > .glyph {
629 -webkit-mask-position: -32px -48px;
632 @media (-webkit-min-device-pixel-ratio: 1.5) {
633 .status-bar-item > .glyph {
634 -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
638 button.status-bar-item.dock-status-bar-item.toggled-undocked .glyph {
639 -webkit-mask-position: 0 -48px;
642 button.status-bar-item.dock-status-bar-item.toggled-bottom .glyph {
643 -webkit-mask-position: -32px -24px;
646 button.status-bar-item.dock-status-bar-item.toggled-right .glyph {
647 -webkit-mask-position: -256px -48px;
650 button.status-bar-item.dock-status-bar-item.toggled-left .glyph {
651 -webkit-mask-position: -32px -120px;
654 body.undocked .alternate-status-bar-buttons-bar {
658 .alternate-status-bar-buttons-bar {
665 .alternate-status-bar-buttons-bar .status-bar-item {
668 border: 1px solid rgb(202, 202, 202);
671 .alternate-status-bar-buttons-bar .status-bar-item.emulate-active {
672 background-color: rgb(163,163,163);
673 border: 1px solid rgb(120, 120, 120);
676 button.status-bar-item.settings-status-bar-item,
677 button.status-bar-item.settings-status-bar-item:active {
678 border-right: 0 transparent none;
687 background-image: url(Images/statusbarResizerHorizontal.png);
688 background-repeat: no-repeat;
689 background-position: center;
701 .settings-status-bar-item .glyph {
702 -webkit-mask-position: -160px -24px;
705 body.remote .dock-status-bar-item {
709 .console-status-bar-item .glyph {
710 -webkit-mask-position: -64px -24px;
713 .screencast-status-bar-item.toggled-left .glyph {
714 -webkit-mask-position: -256px -96px;
717 .screencast-status-bar-item.toggled-top .glyph {
718 -webkit-mask-position: -288px -96px;
721 .screencast-status-bar-item.toggled-disabled .glyph {
722 -webkit-mask-position: 0px -120px;
725 .clear-status-bar-item .glyph {
726 -webkit-mask-position: -64px 0;
735 background-image: url(Images/statusbarButtonGlyphs.png);
736 background-size: 320px 144px;
739 display: inline-block;
742 @media (-webkit-min-device-pixel-ratio: 1.5) {
749 background-image: url(Images/statusbarButtonGlyphs_2x.png);
754 background-position: -213px -96px;
757 .warning-icon-small {
758 background-position: -202px -107px;
762 background-position: -224px -107px;
766 background-position: -224px -96px;
770 background-position: -235px -96px;
774 background-position: -246px -96px;
777 #error-warning-count, #remote-device-count {
778 display: inline-block;
779 padding: 4px 6px 6px 0;
786 #error-warning-count:hover, #remote-device-count:hover {
787 border-bottom: 1px solid rgb(96, 96, 96);
790 #error-warning-count .error-icon-small,
791 #error-warning-count .warning-icon-small,
792 #remote-device-count .device-icon-small{
793 vertical-align: -1px;
797 #error-warning-count .warning-icon-small {
801 #drawer-tabbed-pane > .tabbed-pane-header {
802 background-color: rgb(236, 236, 236);
805 #drawer-contents .tabbed-pane-header .tabbed-pane-header-tab {
809 body.platform-mac .monospace,
810 body.platform-mac .source-code {
811 font-size: 11px !important;
812 font-family: Menlo, monospace;
815 body.platform-mac.platform-mac-tiger .monospace,
816 body.platform-mac.platform-mac-tiger .source-code {
817 font-size: 10px !important;
818 font-family: Monaco, monospace;
821 body.platform-windows .monospace,
822 body.platform-windows .source-code {
823 font-size: 12px !important;
824 font-family: Consolas, Lucida Console, monospace;
827 body.platform-linux .monospace,
828 body.platform-linux .source-code {
829 font-size: 11px !important;
830 font-family: dejavu sans mono, monospace;
834 background-color: white;
838 .console-view-wrapper {
839 background-color: rgb(236, 236, 236);
843 .console-filters-header {
848 .console-status-bar {
856 word-wrap: break-word;
857 -webkit-user-select: text;
858 border-top: 1px solid rgb(230, 230, 230);
859 -webkit-transform: translateZ(0);
865 padding: 1px 22px 1px 0;
868 white-space: pre-wrap;
869 -webkit-user-modify: read-write-plaintext-only;
872 #console-prompt::before {
873 background-position: -192px -96px;
876 .console-user-command-result.console-log-level::before {
877 background-position: -202px -96px;
881 .console-user-command {
884 border-bottom: 1px solid rgb(240, 240, 240);
885 padding: 1px 22px 1px 0;
890 .console-mesage:first-child {
894 .console-adjacent-user-command-result {
898 .console-adjacent-user-command-result + .console-user-command-result.console-log-level::before {
899 background-image: none;
905 -webkit-user-select: none;
908 .console-message::before,
909 .console-user-command::before,
910 #console-prompt::before,
911 .console-group-title::before {
920 -webkit-user-select: none;
921 background-image: url(Images/statusbarButtonGlyphs.png);
922 background-size: 320px 144px;
925 @media (-webkit-min-device-pixel-ratio: 1.5) {
926 .console-message::before,
927 .console-user-command::before,
928 #console-prompt::before,
929 .console-group-title::before {
930 background-image: url(Images/statusbarButtonGlyphs_2x.png);
934 .console-message > .outline-disclosure li.parent::before {
938 .console-message .outline-disclosure .stacktrace-entry:hover {
939 background-color: rgba(0, 0, 0, 0.05);
942 .console-message .bubble {
943 display: inline-block;
945 background-color: rgb(128, 151, 189);
946 vertical-align: middle;
961 .console-message-text {
962 white-space: pre-wrap;
965 .repeated-message.console-error-level::before,
966 .repeated-message.console-warning-level:before,
967 .repeated-message.console-debug-level:before,
968 .repeated-message.console-info-level:before {
972 .repeated-message .outline-disclosure,
973 .repeated-message > .console-message-text {
978 color: rgb(128, 128, 128);
982 .console-group .console-group > .console-group-messages {
986 .console-group-title {
990 .console-group-title::before {
991 -webkit-user-select: none;
992 -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
993 -webkit-mask-size: 320px 144px;
1003 @media (-webkit-min-device-pixel-ratio: 1.5) {
1004 .console-group-title::before {
1005 -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
1009 .console-group .console-group-title::before {
1010 -webkit-mask-position: -20px -96px;
1011 background-color: rgb(110, 110, 110);
1014 .console-message-wrapper.collapsed .console-group-title::before {
1015 -webkit-mask-position: -4px -96px;
1022 .console-message-wrapper {
1026 .console-message-wrapper .nesting-level-marker {
1029 border-right: 1px solid #A3A3A3;
1033 .console-message-wrapper:last-child .nesting-level-marker,
1034 .console-message-wrapper .nesting-level-marker.group-closed {
1038 .console-message-wrapper:last-child .nesting-level-marker::before,
1039 .console-message-wrapper .nesting-level-marker.group-closed::before
1044 .console-message-wrapper .nesting-level-marker::before {
1045 border-bottom: 1px solid #A3A3A3;
1058 .console-error-level .console-message-text,
1059 .console-error-level .section > .header .title {
1060 color: red !important;
1063 .console-debug-level .console-message-text {
1067 .console-error-level::before,
1068 .console-warning-level::before,
1069 .console-debug-level::before,
1070 .console-info-level::before {
1071 background-image: url(Images/statusbarButtonGlyphs.png);
1072 background-size: 320px 144px;
1077 @media (-webkit-min-device-pixel-ratio: 1.5) {
1078 .console-error-level::before,
1079 .console-warning-level::before,
1080 .console-debug-level::before,
1081 .console-info-level::before {
1082 background-image: url(Images/statusbarButtonGlyphs_2x.png);
1086 .console-warning-level::before {
1087 background-position: -202px -107px;
1090 .console-error-level::before {
1091 background-position: -213px -96px;
1094 .console-info-level::before {
1095 background-position: -213px -107px;
1098 .console-user-command .console-message {
1101 border-bottom: none;
1104 .console-user-command::before {
1105 background-position: -192px -107px;
1108 .console-user-command > .console-message-text {
1109 color: rgb(0, 128, 255);
1112 #console-messages .link {
1113 text-decoration: underline;
1116 #console-messages .link,
1117 #console-messages a {
1118 color: rgb(33%, 33%, 33%);
1122 #console-messages .link:hover,
1123 #console-messages a:hover {
1124 color: rgb(15%, 15%, 15%);
1127 ol.watch-expressions > li.hovered {
1128 background-color: #F0F0F0;
1131 .console-message-url {
1138 .console-group-messages .section {
1139 margin: 0 0 0 12px !important;
1142 .console-group-messages .section > .header {
1144 background-image: none;
1149 .console-group-messages .section > .header::before {
1153 .console-group-messages .section > .header .title {
1155 font-weight: normal;
1159 .console-group-messages .section .properties li .info {
1162 color: rgb(60%, 60%, 60%);
1165 .console-group-messages .outline-disclosure {
1169 .console-group-messages .outline-disclosure > ol {
1170 padding: 0 0 0 12px !important;
1173 .console-group-messages .outline-disclosure,
1174 .console-group-messages .outline-disclosure ol {
1179 .console-group-messages .outline-disclosure.single-node li {
1183 .console-group-messages .outline-disclosure li .selection {
1188 .console-group-messages .add-attribute {
1192 .console-formatted-object,
1193 .console-formatted-node,
1194 .console-formatted-array {
1196 display: inline-block;
1197 vertical-align: top;
1201 .console-formatted-node:hover {
1202 background-color: rgba(56, 121, 217, 0.1);
1205 .console-formatted-object .section,
1206 .console-formatted-node .section,
1207 .console-formatted-array .section {
1211 .console-formatted-object .section > .header::before {
1215 .console-formatted-object .properties,
1216 .console-formatted-node .properties {
1217 padding-left: 0 !important;
1220 .console-formatted-number,
1221 .console-formatted-boolean {
1222 color: rgb(28, 0, 207);
1225 .console-formatted-string,
1226 .console-formatted-regexp,
1227 .console-formatted-symbol {
1228 color: rgb(196, 26, 22);
1230 unicode-bidi: -webkit-isolate;
1233 .console-formatted-null,
1234 .console-formatted-undefined {
1235 color: rgb(128, 128, 128);
1238 .console-formatted-preview-node,
1239 .section .console-formatted-node {
1240 color: rgb(136, 18, 128);
1243 .console-object-preview {
1247 .object-info-state-note {
1248 display: inline-block;
1251 background-color: rgb(179, 203, 247);
1260 .object-info-state-note::before {
1264 .section:not(.expanded) .object-info-state-note {
1273 background-color: rgb(220, 130, 130);
1276 .auto-complete-text,
1277 .editing .auto-complete-text {
1278 color: rgb(128, 128, 128) !important;
1279 -webkit-user-select: none;
1280 -webkit-user-modify: read-only;
1298 .panel.extension-panel.visible {
1299 display: flex !important;
1300 flex-direction: column;
1312 iframe.panel.extension {
1317 .webkit-line-gutter-backdrop {
1318 /* Keep this in sync with view-source.css (.webkit-line-gutter-backdrop) */
1320 background-color: rgb(240, 240, 240);
1321 border-right: 1px solid rgb(187, 187, 187);
1329 .outline-disclosure li.hovered:not(.selected) .selection {
1333 background-color: rgba(56, 121, 217, 0.1);
1337 .outline-disclosure li .selection {
1346 .outline-disclosure li.selected .selection {
1348 background-color: rgb(212, 212, 212);
1351 .outline-disclosure li.elements-drag-over .selection {
1354 border-top: 2px solid rgb(56, 121, 217);
1357 .outline-disclosure ol:focus li.selected .selection {
1358 background-color: rgb(56, 121, 217);
1361 .outline-disclosure ol:focus li.parent.selected::before {
1362 background-color: white;
1365 .outline-disclosure > ol {
1367 padding: 2px 6px !important;
1373 .outline-disclosure,
1374 .outline-disclosure ol {
1375 list-style-type: none;
1376 -webkit-padding-start: 12px;
1381 font-family: monospace;
1382 font-size: 11px !important;
1383 white-space: pre-wrap;
1386 .outline-disclosure li {
1387 padding: 0 0 0 14px;
1390 word-wrap: break-word;
1393 .outline-disclosure ol:focus li.selected {
1397 .outline-disclosure ol:focus li.selected * {
1401 .outline-disclosure li.parent {
1405 .outline-disclosure li .webkit-html-tag.close {
1409 .outline-disclosure li.parent::before {
1415 .outline-disclosure li.parent::before {
1416 -webkit-user-select: none;
1417 -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
1418 -webkit-mask-size: 320px 144px;
1428 @media (-webkit-min-device-pixel-ratio: 1.5) {
1429 .outline-disclosure li.parent::before {
1430 -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
1434 .outline-disclosure li.parent::before {
1435 -webkit-mask-position: -4px -96px;
1436 background-color: rgb(110, 110, 110);
1439 .outline-disclosure li.parent.expanded::before {
1440 -webkit-mask-position: -20px -96px;
1443 .outline-disclosure ol.children {
1447 .outline-disclosure ol.children.expanded {
1453 border-top: 1px solid transparent;
1454 padding: 3px 8px 4px 18px;
1456 white-space: nowrap;
1459 .placard:nth-of-type(2n) {
1460 background-color: rgb(234, 243, 255);
1464 border-top: 1px solid rgb(172, 172, 172);
1465 background-image: linear-gradient(to bottom, rgb(182, 182, 182), rgb(162, 162, 162));
1466 background-origin: padding-box;
1467 background-clip: padding-box;
1470 :focus .placard.selected {
1471 border-top: 1px solid rgb(70, 103, 215);
1472 background-image: linear-gradient(to bottom, rgb(92, 147, 213), rgb(56, 121, 217));
1476 font-weight: normal;
1477 word-wrap: break-word;
1478 white-space: normal;
1481 .placard.selected .title {
1486 .placard .subtitle {
1490 color: rgba(0, 0, 0, 0.7);
1491 text-overflow: ellipsis;
1495 .placard.selected .subtitle {
1496 color: rgba(255, 255, 255, 0.7);
1499 .placard .subtitle a {
1507 .placard-label .title,
1508 .placard-label .subtitle {
1519 .events-pane .section {
1522 .events-pane .section:not(:nth-of-type(1)) {
1523 border-top: 1px solid rgb(231, 231, 231);
1526 .section > .header {
1527 padding: 0px 8px 0 5px;
1529 white-space: nowrap;
1530 background-origin: padding-box;
1531 background-clip: padding-box;
1534 .section > .header::before {
1535 -webkit-user-select: none;
1536 background-image: url(Images/statusbarButtonGlyphs.png);
1537 background-size: 320px 144px;
1548 @media (-webkit-min-device-pixel-ratio: 1.5) {
1549 .section > .header::before {
1550 background-image: url(Images/statusbarButtonGlyphs_2x.png);
1554 .section > .header::before {
1555 background-position: -4px -96px;
1558 .section.expanded > .header::before {
1559 background-position: -20px -96px;
1562 .section > .header .title,
1563 .event-bar .header .title {
1564 font-weight: normal;
1565 word-wrap: break-word;
1566 white-space: normal;
1570 .section > .header .title.blank-title {
1574 .section > .header label,
1575 .event-bar .header label {
1579 .section.expanded .header label,
1580 .event-bar.expanded .header label {
1584 .section > .header .subtitle,
1585 .event-bar .header .subtitle {
1589 text-overflow: ellipsis;
1593 .section > .header .subtitle a {
1597 .section .properties,
1598 .event-bar .event-properties {
1602 .section.expanded .properties,
1603 .event-bar.expanded .event-properties {
1607 .event-bar .event-properties {
1611 .section.no-affect .properties li {
1615 .section.no-affect .properties li.editing {
1626 .properties-tree li {
1628 white-space: nowrap;
1629 text-overflow: ellipsis;
1631 -webkit-user-select: text;
1637 .properties-tree li.parent {
1642 .properties-tree li.parent::before {
1643 -webkit-user-select: none;
1644 background-image: url(Images/statusbarButtonGlyphs.png);
1645 background-size: 320px 144px;
1655 .properties-calculate-value-button:hover {
1656 text-decoration: underline;
1659 .properties-accessor-property-name {
1663 @media (-webkit-min-device-pixel-ratio: 1.5) {
1664 .properties-tree li.parent::before {
1665 background-image: url(Images/statusbarButtonGlyphs_2x.png);
1669 .properties-tree li.parent::before {
1670 background-position: -4px -96px;
1673 .properties-tree li.parent.expanded::before {
1674 background-position: -20px -96px;
1677 .properties-tree li .info {
1679 padding-bottom: 3px;
1682 .properties-tree ol {
1685 -webkit-padding-start: 12px;
1689 .properties-tree ol.expanded {
1694 -webkit-user-select: text;
1695 box-shadow: rgba(0, 0, 0, .5) 3px 3px 4px;
1696 outline: 1px solid rgb(66%, 66%, 66%) !important;
1697 background-color: white;
1698 -webkit-user-modify: read-write-plaintext-only;
1699 text-overflow: clip !important;
1704 margin-bottom: -1px;
1705 padding-bottom: 1px;
1706 opacity: 1.0 !important;
1711 color: #222 !important;
1712 text-decoration: none !important;
1716 color: #222 !important;
1717 text-decoration: none !important;
1718 overflow: visible !important;
1725 .section .properties li.editing {
1727 text-overflow: clip;
1730 li.editing .swatch, li.editing .enabled-button,
1731 li.editing-sub-part .delete-button {
1732 display: none !important;
1735 .sidebar-tabbed-pane .watch-expressions {
1739 .properties-tree.watch-expressions {
1740 padding-left: 0 !important;
1743 .properties-tree.watch-expressions > li {
1747 .properties-tree.watch-expressions > li > .value {
1752 .properties-tree.watch-expressions > li:not(.parent) {
1757 .properties-tree.watch-expressions > li.hovered {
1758 padding-right: 14px;
1761 .watch-expressions > li.editing-sub-part .text-prompt {
1767 .watch-expressions > li.editing-sub-part .value,
1768 .watch-expressions > li.editing-sub-part .separator {
1772 .section .properties li.editing-sub-part {
1773 padding: 3px 6px 8px 18px;
1774 margin: -3px -6px -8px -6px;
1775 text-overflow: clip;
1778 .section .properties .delete-button {
1781 background-image: url(Images/deleteIcon.png);
1782 background-position: 0 0;
1783 background-color: transparent;
1784 background-repeat: no-repeat;
1785 border: 0 none transparent;
1791 .section .properties li.hovered .delete-button {
1795 .section .properties .name,
1796 .event-properties .name,
1797 .console-formatted-object .name {
1798 color: rgb(136, 19, 145);
1801 .section .properties .dimmed {
1805 .section .properties .value.error {
1809 .section .properties .number,
1810 .event-properties .number {
1814 .section .properties .keyword,
1815 .event-properties .keyword {
1816 color: rgb(136, 19, 79);
1819 .section .properties .color,
1820 .event-properties .color {
1821 color: rgb(118, 15, 21);
1831 display: inline-block;
1832 background-image: url(Images/checker.png);
1833 -webkit-user-select: none;
1839 display: inline-block;
1840 border: 1px solid rgba(128, 128, 128, 0.6);
1843 .swatch-inner:hover {
1844 border: 1px solid rgba(64, 64, 64, 0.8);
1849 background-color: rgb(232, 232, 232);
1852 .pane-title-button {
1853 color: rgb(6, 6, 6);
1854 background-color: transparent;
1855 border: 1px solid rgb(165, 165, 165);
1856 background-color: rgb(237, 237, 237);
1857 background-image: linear-gradient(to bottom, rgb(252, 252, 252), rgb(223, 223, 223));
1858 border-radius: 12px;
1859 -webkit-appearance: none;
1862 .pane-title-button:active {
1863 background-color: rgb(215, 215, 215);
1864 background-image: linear-gradient(to bottom, rgb(194, 194, 194), rgb(239, 239, 239));
1867 button.show-all-nodes {
1872 color: rgb(6, 6, 6);
1873 background-color: transparent;
1874 border: 1px solid rgb(165, 165, 165);
1875 background-color: rgb(237, 237, 237);
1876 background-image: linear-gradient(to bottom, rgb(252, 252, 252), rgb(223, 223, 223));
1877 border-radius: 12px;
1878 -webkit-appearance: none;
1881 body.inactive button.show-all-nodes {
1882 color: rgb(130, 130, 130);
1883 border-color: rgb(212, 212, 212);
1884 background-color: rgb(239, 239, 239);
1885 background-image: linear-gradient(to bottom, rgb(250, 250, 250), rgb(235, 235, 235));
1888 button.show-all-nodes:active {
1889 background-color: rgb(215, 215, 215);
1890 background-image: linear-gradient(to bottom, rgb(194, 194, 194), rgb(239, 239, 239));
1893 #console-messages.console-filter-top {
1899 padding-right: 10px;
1904 display: inline-block;
1908 background: transparent;
1909 text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
1911 vertical-align: middle;
1914 .scope-bar-divider {
1915 background-color: rgba(0, 0, 0, 0.4);
1918 vertical-align: middle;
1919 display: inline-block;
1922 .scope-bar li.selected,
1923 .scope-bar li:hover,
1924 .scope-bar li:active {
1926 text-shadow: rgba(0, 0, 0, 0.4) 0 1px 0;
1933 .scope-bar li:hover {
1934 background: rgba(0, 0, 0, 0.2);
1937 .scope-bar li.selected {
1938 background: rgba(0, 0, 0, 0.3);
1941 .scope-bar li:active {
1942 background: rgba(0, 0, 0, 0.5);
1946 .console-warning-level.repeated-message,
1947 .console-error-level.repeated-message,
1948 .console-log-level.repeated-message,
1949 .console-debug-level.repeated-message,
1950 .console-info-level.repeated-message {
1951 display: -webkit-flex;
1954 .console-user-command-result {
1958 .source-view-frame {
1963 .sidebar-resizer-vertical {
1972 .sidebar-tree .children {
1979 .sidebar-tree-section {
1982 padding: 1px 10px 6px 10px;
1983 white-space: nowrap;
1985 color: rgb(92, 110, 129);
1986 text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
1989 .sidebar-tree-item {
1992 padding: 0 5px 0 5px;
1993 white-space: nowrap;
1998 border-top: 1px solid transparent;
2001 .sidebar-tree .children {
2005 .sidebar-tree .children.expanded {
2009 .sidebar-tree-section + .children > .sidebar-tree-item {
2010 padding-left: 10px !important;
2013 .sidebar-tree-section + .children.small > .sidebar-tree-item {
2014 padding-left: 17px !important;
2017 .sidebar-tree > .children > .sidebar-tree-item {
2021 .sidebar-tree > .children > .children > .sidebar-tree-item {
2025 .sidebar-tree.hide-disclosure-buttons > .children {
2029 .sidebar-tree > .children.hide-disclosure-buttons > .children {
2033 .sidebar-tree.some-expandable:not(.hide-disclosure-buttons) > .sidebar-tree-item:not(.parent) .icon {
2037 .sidebar-tree-item .disclosure-button {
2042 -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
2043 -webkit-mask-size: 320px 144px;
2044 -webkit-appearance: none;
2045 background-color: rgba(0, 0, 0, 0.75);
2050 @media (-webkit-min-device-pixel-ratio: 1.5) {
2051 .sidebar-tree-item .disclosure-button {
2052 -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
2056 .sidebar-tree.hide-disclosure-buttons .sidebar-tree-item .disclosure-button {
2060 .sidebar-tree-item .disclosure-button {
2061 -webkit-mask-position: -4px -96px;
2064 .sidebar-tree-item.selected .disclosure-button {
2065 background-color: white;
2066 -webkit-mask-position: -4px -96px;
2069 .sidebar-tree-item.expanded .disclosure-button {
2070 -webkit-mask-position: -20px -96px;
2073 .sidebar-tree-item.selected.expanded .disclosure-button {
2074 background-color: white;
2075 -webkit-mask-position: -20px -96px;
2078 .sidebar-tree-item .icon {
2086 .sidebar-tree-item.wait .icon {
2090 .spinner-icon::before,
2091 .sidebar-tree-item.wait .icon::before {
2096 border: 3px solid grey;
2097 border-radius: 12px;
2098 clip: rect(0px, 15px, 15px, 0px);
2101 -webkit-animation: spinner-animation 1s linear infinite;
2104 .spinner-icon.small::before,
2105 .sidebar-tree-item.wait.small .icon::before {
2109 clip: rect(0px, 9px, 9px, 0px);
2113 .sidebar-tree-item.wait.selected .icon::before {
2114 border-color: white;
2117 @-webkit-keyframes spinner-animation {
2118 from { -webkit-transform: rotate(0); }
2119 to { -webkit-transform: rotate(360deg); }
2134 li .status .bubble {
2135 display: inline-block;
2139 background-color: rgb(128, 151, 189);
2140 vertical-align: middle;
2141 white-space: nowrap;
2145 line-height: normal;
2152 li .status .bubble:empty {
2156 li.selected .status .bubble {
2157 background-color: white !important;
2158 color: rgb(132, 154, 190) !important;
2161 :focus li.selected .status .bubble {
2162 color: rgb(36, 98, 172) !important;
2165 body.inactive li.selected .status .bubble {
2166 color: rgb(159, 159, 159) !important;
2169 .sidebar-tree.small .sidebar-tree-item,
2170 .sidebar-tree .children.small .sidebar-tree-item,
2171 .sidebar-tree-item.small,
2172 .small .resources-graph-side {
2176 .sidebar-tree.small .sidebar-tree-item .icon,
2177 .sidebar-tree .children.small .sidebar-tree-item .icon,
2178 .sidebar-tree-item.small .icon {
2183 .sidebar-tree.small .sidebar-tree-item .status,
2184 .sidebar-tree .children.small .sidebar-tree-item .status,
2185 .sidebar-tree-item.small .status {
2189 .sidebar-tree-item.selected {
2191 text-shadow: rgba(0, 0, 0, 0.33) 1px 1px 0;
2192 background-origin: padding-box;
2193 background-clip: padding-box;
2194 background-color: rgb(56, 121, 217);
2197 :focus .sidebar-tree-item.selected {
2198 background-color: rgb(56, 121, 217);
2201 body.inactive .sidebar-tree-item.selected {
2202 background-color: rgb(180,180,180);
2205 .sidebar-tree-item .titles {
2207 flex-direction: column;
2211 padding-bottom: 1px;
2212 text-overflow: ellipsis;
2214 white-space: nowrap;
2217 .titles > .title-container {
2221 .sidebar-tree-item .titles.no-subtitle {
2225 .sidebar-tree.small .sidebar-tree-item .titles,
2226 .sidebar-tree .children.small .sidebar-tree-item .titles,
2227 .sidebar-tree-item.small .titles {
2229 line-height: normal;
2232 .sidebar-tree:not(.small) .sidebar-tree-item:not(.small) .title::after,
2233 .sidebar-tree .children:not(.small) .sidebar-tree-item .title::after {
2238 .sidebar-tree-item .subtitle {
2242 .sidebar-tree.small .sidebar-tree-item .subtitle,
2243 .sidebar-tree .children.small .sidebar-tree-item .subtitle,
2244 .sidebar-tree-item.small .subtitle {
2248 .sidebar-tree-item.selected .subtitle {
2253 .console-debug-level .bubble {
2254 background-color: rgb(0, 0, 255) !important;
2258 .console-warning-level .bubble {
2259 background-color: rgb(232, 164, 0) !important;
2263 .console-error-level .bubble {
2264 background-color: rgb(216, 35, 35) !important;
2267 .storage-application-cache-status-icon,
2268 .storage-application-cache-connectivity-icon {
2270 vertical-align: middle;
2273 .status-bar-divider {
2275 border-right: 1px solid #CCC;
2278 .storage-application-cache-status,
2279 .storage-application-cache-connectivity {
2290 border-left: 1px solid rgb(184, 184, 184);
2294 .node-search-status-bar-item .glyph {
2295 -webkit-mask-position: -224px -24px;
2298 .emulation-status-bar-item .glyph {
2299 -webkit-mask-position: -164px 0px;
2302 .delete-storage-status-bar-item .glyph {
2303 -webkit-mask-position: -128px 0;
2306 .clear-storage-status-bar-item .glyph {
2307 -webkit-mask-position: -64px 0;
2310 .refresh-storage-status-bar-item .glyph {
2311 -webkit-mask-position: 0 0;
2314 .webkit-html-js-node,
2315 .webkit-html-css-node {
2319 .source-frame-breakpoint-condition {
2322 background-color: rgb(203, 226, 255);
2324 border: 2px solid rgb(169, 172, 203);
2326 pointer-events: auto;
2329 .source-frame-breakpoint-message {
2330 background-color: transparent;
2331 font-weight: normal;
2335 color: rgb(85, 85, 85);
2340 #source-frame-breakpoint-condition {
2342 border: 1px inset rgb(190, 190, 190) !important;
2344 box-shadow: none !important;
2345 outline: none !important;
2346 -webkit-user-modify: read-write;
2349 .source-frame-popover-title {
2350 text-overflow: ellipsis;
2352 white-space: nowrap;
2357 .source-frame-popover-tree {
2358 border-top: 1px solid rgb(194, 194, 147);
2367 .source-frame-eval-expression {
2368 outline: 1px solid rgb(163, 41, 34);
2369 background-color: rgb(255, 255, 194);
2378 .resource-content-unavailable {
2379 color: rgb(50%, 50%, 50%);
2387 text-decoration: underline;
2403 border: 4px black solid;
2405 background-color: black;
2413 .resource-view.json {
2417 .resource-view.html iframe {
2423 .soft-context-menu-glass-pane {
2432 .soft-context-menu {
2434 border: 1px solid rgba(196, 196, 196, 0.9);
2435 border-top: 1px solid rgba(196, 196, 196, 0.5);
2436 border-bottom: 1px solid rgba(150, 150, 150, 0.9);
2437 padding: 4px 0 4px 0;
2439 background-color: white;
2440 box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25);
2443 .soft-context-menu-item {
2447 border-top: 1px solid transparent;
2448 border-bottom: 1px solid transparent;
2449 padding: 2px 7px 2px 6px;
2451 white-space: nowrap;
2454 .soft-context-menu-separator {
2459 .soft-context-menu-separator > .separator-line {
2462 border-bottom: 1px solid rgb(227, 227, 227);
2463 pointer-events: none;
2466 .soft-context-menu-item-mouse-over {
2467 border-top: 1px solid rgb(56, 121, 217);
2468 border-bottom: 1px solid rgb(56, 121, 217);
2469 background-color: rgb(56, 121, 217);
2473 body.platform-mac .soft-context-menu-item-mouse-over {
2474 border-top: 1px solid rgb(90, 131, 236);
2475 border-bottom: 1px solid rgb(18, 88, 233);
2476 background-image: linear-gradient(to bottom, rgb(100, 140, 243), rgb(36, 101, 243));
2479 .soft-context-menu-item-checkmark {
2480 color: rgb(108, 108, 108);
2481 pointer-events: none;
2484 .soft-context-menu-item-submenu-arrow {
2487 pointer-events: none;
2490 .soft-context-menu-item-mouse-over .soft-context-menu-item-checkmark {
2502 .search-drawer-header {
2508 .search-drawer-header input[type="text"].search-config-search {
2509 -webkit-appearance: none;
2512 border: 1px solid rgb(163, 163, 163);
2518 .search-drawer-header input[type="search"].search-config-search:focus {
2519 border: 1px solid rgb(190, 190, 190);
2523 body.platform-mac .search-drawer-header input[type="search"].search-config-search {
2527 .search-drawer-header label.search-config-label {
2534 #bottom-status-bar-container {
2535 -webkit-flex: 1 1 0;
2540 .search-status-bar-summary {
2541 background-color: rgb(236, 236, 236);
2542 border-top: 1px solid #ccc;
2547 .search-status-bar-summary .progress-bar-container {
2551 .progress-bar-stop-button-item {
2557 .progress-bar-stop-button .glyph {
2558 -webkit-mask-position: -96px -48px;
2559 background-color: rgb(216, 0, 0) !important;
2562 .search-view .search-results {
2567 #search-results-pane-file-based li {
2571 #search-results-pane-file-based ol {
2572 -webkit-padding-start: 0;
2576 #search-results-pane-file-based ol.children {
2580 #search-results-pane-file-based ol.children.expanded {
2584 #search-results-pane-file-based li.parent::before {
2585 -webkit-user-select: none;
2586 background-image: url(Images/statusbarButtonGlyphs.png);
2587 background-size: 320px 144px;
2594 display: inline-block;
2597 @media (-webkit-min-device-pixel-ratio: 1.5) {
2598 #search-results-pane-file-based li.parent::before {
2599 background-image: url(Images/statusbarButtonGlyphs_2x.png);
2603 #search-results-pane-file-based li.parent::before {
2604 background-position: -4px -96px;
2607 #search-results-pane-file-based li.parent.expanded::before {
2608 background-position: -20px -96px;
2611 #search-results-pane-file-based .search-result {
2613 padding: 2px 0 2px 10px;
2619 #search-results-pane-file-based .search-result:hover {
2620 background-color: rgba(121, 121, 121, 0.1);
2623 #search-results-pane-file-based .search-result .search-result-file-name {
2628 #search-results-pane-file-based .search-result .search-result-matches-count {
2633 #search-results-pane-file-based .show-more-matches {
2641 #search-results-pane-file-based .show-more-matches:hover {
2642 text-decoration: underline;
2645 #search-results-pane-file-based .search-match {
2650 #search-results-pane-file-based .search-match .search-match-line-number {
2651 color: rgb(128, 128, 128);
2653 vertical-align: top;
2658 border-right: 1px solid #BBB;
2661 #search-results-pane-file-based .search-match:not(:hover) .search-match-line-number {
2662 background-color: #F0F0F0;
2665 #search-results-pane-file-based .search-match:hover {
2666 background-color: rgba(56, 121, 217, 0.1);
2669 #search-results-pane-file-based .search-match .highlighted-match {
2670 background-color: #F1EA00;
2673 #search-results-pane-file-based a {
2674 text-decoration: none;
2678 #search-results-pane-file-based .search-match .search-match-content {
2682 .record-cpu-profile-status-bar-item .glyph,
2683 .record-profile-status-bar-item .glyph {
2684 -webkit-mask-position: -288px 0;
2687 button.record-cpu-profile-status-bar-item.toggled-on .glyph:not(.shadow),
2688 button.record-profile-status-bar-item.toggled-on .glyph:not(.shadow) {
2689 -webkit-mask-position: -288px -24px;
2690 background-color: rgb(216, 0, 0) !important;
2694 .storage-view .storage-table-error {
2701 color: rgb(75%, 75%, 75%);
2703 margin-bottom: auto;
2709 white-space: pre-wrap;
2712 /* Custom popup scrollers */
2714 .custom-popup-horizontal-scroll ::-webkit-scrollbar,
2715 .custom-popup-vertical-scroll ::-webkit-scrollbar {
2720 .custom-popup-horizontal-scroll ::-webkit-scrollbar-corner,
2721 .custom-popup-vertical-scroll ::-webkit-scrollbar-corner {
2725 .custom-popup-horizontal-scroll ::-webkit-resizer,
2726 .custom-popup-vertical-scroll ::-webkit-resizer {
2730 .custom-popup-horizontal-scroll ::-webkit-scrollbar-button,
2731 .custom-popup-vertical-scroll ::-webkit-scrollbar-button {
2735 /* Custom Horizontal Scrollbar Styles */
2737 .custom-popup-horizontal-scroll ::-webkit-scrollbar:horizontal:corner-present {
2738 border-right-width: 0;
2741 .custom-popup-horizontal-scroll ::-webkit-scrollbar-thumb:horizontal {
2742 -webkit-border-image: url(Images/thumbHoriz.png) 0 11 0 11;
2743 border-color: transparent;
2744 border-width: 0 11px;
2748 .custom-popup-horizontal-scroll ::-webkit-scrollbar-thumb:horizontal:hover {
2749 -webkit-border-image: url(Images/thumbHoverHoriz.png) 0 11 0 11;
2752 .custom-popup-horizontal-scroll ::-webkit-scrollbar-thumb:horizontal:active {
2753 -webkit-border-image: url(Images/thumbActiveHoriz.png) 0 11 0 11;
2756 .custom-popup-horizontal-scroll ::-webkit-scrollbar-track-piece:horizontal:start {
2760 .custom-popup-horizontal-scroll ::-webkit-scrollbar-track-piece:horizontal:end {
2764 .custom-popup-horizontal-scroll ::-webkit-scrollbar-track-piece:horizontal:end:corner-present {
2768 .custom-popup-horizontal-scroll ::-webkit-scrollbar-track-piece:horizontal:decrement {
2769 -webkit-border-image: url(Images/trackHoriz.png) 0 11 0 11;
2770 border-color: transparent;
2771 border-width: 0 0 0 11px;
2774 .custom-popup-horizontal-scroll ::-webkit-scrollbar-track-piece:horizontal:increment {
2775 -webkit-border-image: url(Images/trackHoriz.png) 0 11 0 11;
2776 border-color: transparent;
2777 border-width: 0 11px 0 0;
2780 /* Custom Vertical Scrollbar Styles */
2782 .custom-popup-vertical-scroll ::-webkit-scrollbar:vertical:corner-present {
2783 border-bottom-width: 0;
2786 .custom-popup-vertical-scroll ::-webkit-scrollbar-thumb:vertical {
2787 -webkit-border-image: url(Images/thumbVert.png) 11 0 11 0;
2788 border-color: transparent;
2789 border-width: 11px 0;
2793 .custom-popup-vertical-scroll ::-webkit-scrollbar-thumb:vertical:hover {
2794 -webkit-border-image: url(Images/thumbHoverVert.png) 11 0 11 0;
2797 .custom-popup-vertical-scroll ::-webkit-scrollbar-thumb:vertical:active {
2798 -webkit-border-image: url(Images/thumbActiveVert.png) 11 0 11 0;
2801 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:start {
2805 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:end {
2809 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:end:corner-present {
2813 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:decrement {
2814 -webkit-border-image: url(Images/trackVert.png) 11 0 11 0;
2815 border-color: transparent;
2816 border-width: 11px 0 0 0;
2819 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:increment {
2820 -webkit-border-image: url(Images/trackVert.png) 11 0 11 0;
2821 border-color: transparent;
2822 border-width: 0 0 11px 0;
2831 position: absolute !important;
2838 background-color: rgb(236, 236, 236);
2841 .search-bar.replaceable {
2845 .progress-bar-container {
2846 display: inline-flex;
2851 .progress-bar-container span {
2855 .progress-bar-container progress {
2860 body.platform-mac .progress-bar-container progress {
2864 .progress-bar-container button.status-bar-item {
2869 .elements-tree-outline li.parent::before {
2873 .elements-tree-outline li.shadow-root + ol {
2876 border-left: 1px solid gray;
2879 #drawer-editor-view {
2883 .toolbar-close-button-item {
2884 display: inline-block;
2891 body.undocked .toolbar-close-button-item {
2895 .root-view > .split-view > .split-view-sidebar {
2899 select.drop-down-menu {
2901 -webkit-appearance: none;
2904 .viewport-control-gap-element {