chrome-devtools-frontend 1.0.934857 → 1.0.936663

package/front_end/panels/sources/WatchExpressionsSidebarPane.ts

@@ -303,6 +303,7 @@ export class WatchExpression extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   private textPrompt?: ObjectUI.ObjectPropertiesSection.ObjectPropertyPrompt;
   private result?: SDK.RemoteObject.RemoteObject|null;
   private preventClickTimeout?: number;
+  private resizeObserver?: ResizeObserver;
   constructor(
       expression: string|null,
       expandController: ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController,
@@ -412,6 +413,7 @@ export class WatchExpression extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     if (this.expressionInternal) {
       this.expandController.stopWatchSectionsWithId(this.expressionInternal);
     }
+    this.resizeObserver?.disconnect();
     this.expressionInternal = newExpression;
     this.update();
     this.dispatchEventToListeners(Events.ExpressionUpdated, this);
@@ -442,6 +444,19 @@ export class WatchExpression extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       expressionValue?: SDK.RemoteObject.RemoteObject, exceptionDetails?: Protocol.Runtime.ExceptionDetails): Element {
     const headerElement = this.element.createChild('div', 'watch-expression-header');
     const deleteButton = UI.Icon.Icon.create('smallicon-cross', 'watch-expression-delete-button');
+    this.resizeObserver = new ResizeObserver(entries => {
+      entries.forEach(entry => {
+        // 55 serves as a width threshold here (in px)
+        if (entry.contentRect.width < 55) {
+          deleteButton.classList.remove('right-aligned');
+          deleteButton.classList.add('left-aligned');
+        } else {
+          deleteButton.classList.remove('left-aligned');
+          deleteButton.classList.add('right-aligned');
+        }
+      });
+    });
+    this.resizeObserver.observe(headerElement);
     UI.Tooltip.Tooltip.install(deleteButton, i18nString(UIStrings.deleteWatchExpression));
     deleteButton.addEventListener('click', this.deleteWatchExpression.bind(this), false);
 

package/front_end/panels/sources/module.json

@@ -1,12 +1,7 @@
 {
   "dependencies": [
     "ui/legacy",
-    "panels/search",
     "ui/legacy/components/source_frame",
-    "ui/legacy/components/inline_editor",
-    "ui/legacy/components/color_picker",
-    "panels/event_listeners",
-    "ui/legacy/components/object_ui",
     "panels/coverage"
   ]
 }

package/front_end/panels/sources/watchExpressionsSidebarPane.css

@@ -7,12 +7,19 @@
 .watch-expression-delete-button {
   position: absolute;
   top: 5px;
-  right: 16px;
   cursor: pointer;
   opacity: 0%;
 }
 
-.watch-expression-header:hover .watch-expression-delete-button {
+.right-aligned {
+  right: 16px;
+}
+
+.left-aligned {
+  left: -11px;
+}
+
+.watch-expression-title:hover .watch-expression-delete-button {
   opacity: 100%;
 }
 
@@ -108,7 +115,7 @@ li.watch-expression-editing::before {
 }
 
 @media (forced-colors: active) {
-  .watch-expression-header:hover .watch-expression-delete-button,
+  .watch-expression-title:hover .watch-expression-delete-button,
   .watch-expressions .dimmed {
     opacity: 100%;
   }

package/front_end/panels/timeline/module.json

@@ -4,8 +4,6 @@
     "panels/coverage",
     "panels/layer_viewer",
     "ui/legacy/components/perf_ui",
-    "ui/legacy/components/data_grid",
-    "panels/profiler",
-    "panels/mobile_throttling"
+    "panels/profiler"
   ]
 }

package/front_end/panels/web_audio/web_audio-meta.ts

@@ -3,7 +3,6 @@
 // found in the LICENSE file.
 
 import * as i18n from '../../core/i18n/i18n.js';
-import * as Root from '../../core/root/root.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 // eslint-disable-next-line rulesdir/es_modules_import
@@ -30,8 +29,6 @@ let loadedWebAudioModule: (typeof WebAudio|undefined);
 
 async function loadWebAudioModule(): Promise<typeof WebAudio> {
   if (!loadedWebAudioModule) {
-    // Side-effect import resources in module.json
-    await Root.Runtime.Runtime.instance().loadModulePromise('panels/web_audio');
     loadedWebAudioModule = await import('./web_audio.js');
   }
   return loadedWebAudioModule;

package/front_end/panels/webauthn/webauthn-meta.ts

@@ -26,8 +26,6 @@ let loadedWebauthnModule: (typeof Webauthn|undefined);
 
 async function loadWebauthnModule(): Promise<typeof Webauthn> {
   if (!loadedWebauthnModule) {
-    // Side-effect import resources in module.json
-    await Root.Runtime.Runtime.instance().loadModulePromise('panels/webauthn');
     loadedWebauthnModule = await import('./webauthn.js');
   }
   return loadedWebauthnModule;

package/front_end/ui/components/buttons/button.css

@@ -32,6 +32,7 @@ button {
   display: inline-flex;
   font-family: inherit;
   font-size: 12px;
+  font-weight: 500;
   height: 24px;
   line-height: 14px;
   padding: 5px 12px;

package/front_end/ui/components/docs/create_breadcrumbs.ts

@@ -6,6 +6,7 @@ import * as LitHtml from '../../lit-html/lit-html.js';
 export function init(): void {
   const container = document.createElement('ul');
   // clang-format off
+  // eslint-disable-next-line rulesdir/ban_a_tags_in_lit_html
   LitHtml.render(LitHtml.html`
 
   <style>

package/front_end/ui/components/helpers/get-stylesheet.ts

@@ -48,7 +48,6 @@ export const CSS_RESOURCES_TO_LOAD_INTO_RUNTIME = [
   'ui/legacy/progressIndicator.css',
   'panels/application/serviceWorkerUpdateCycleView.css',
   'ui/legacy/tabbedPane.css',
-  'ui/legacy/components/inline_editor/colorSwatch.css',
   'ui/legacy/glassPane.css',
   'ui/legacy/suggestBox.css',
   'ui/legacy/treeoutline.css',

package/front_end/ui/components/linkifier/LinkifierImpl.ts

@@ -66,6 +66,7 @@ export class Linkifier extends HTMLElement {
     // Disabled until https://crbug.com/1079231 is fixed.
     await coordinator.write(() => {
       // clang-format off
+      // eslint-disable-next-line rulesdir/ban_a_tags_in_lit_html
       LitHtml.render(LitHtml.html`<a class="link" href=${this.#url} @click=${this.onLinkActivation}><slot>${LinkifierUtils.linkText(this.#url, this.#lineNumber)}</slot></a>`, this.#shadow, { host: this});
       // clang-format on
     });

package/front_end/ui/components/text_editor/config.ts

@@ -57,7 +57,9 @@ export const tabMovesFocus = DynamicSetting.bool('textEditorTabMovesFocus', CM.k
   shift: (view: CM.EditorView): boolean => view.state.doc.length ? CM.indentLess(view) : false,
 }]));
 
-export const autocompletion = DynamicSetting.bool('textEditorAutocompletion', CM.autocompletion({icons: false}));
+export const autocompletion = CM.autocompletion({icons: false});
+
+export const sourcesAutocompletion = DynamicSetting.bool('textEditorAutocompletion', autocompletion);
 
 export const bracketMatching = DynamicSetting.bool('textEditorBracketMatching', CM.bracketMatching());
 

package/front_end/ui/components/text_editor/theme.ts

@@ -57,6 +57,11 @@ export const editorTheme = CM.EditorView.theme({
     padding: '0 3px 0 9px',
   },
 
+  '.cm-matchingBracket, .cm-nonmatchingBracket': {
+    background: 'transparent',
+    borderBottom: 'none',
+  },
+
   '&:focus-within .cm-matchingBracket': {
     color: 'inherit',
     backgroundColor: 'var(--color-matching-bracket-background)',

package/front_end/ui/legacy/TabbedPane.ts

@@ -251,6 +251,10 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
   }
 
   closeTabs(ids: string[], userGesture?: boolean): void {
+    if (ids.length === 0) {
+      return;
+    }
+
     const focused = this.hasFocus();
     for (let i = 0; i < ids.length; ++i) {
       this.innerCloseTab(ids[i], userGesture);

package/front_end/ui/legacy/UIUtils.ts

@@ -450,7 +450,7 @@ function modifiedHexValue(hexString: string, event: Event): string|null {
   return resultString;
 }
 
-function modifiedFloatNumber(number: number, event: Event, modifierMultiplier?: number): number|null {
+export function modifiedFloatNumber(number: number, event: Event, modifierMultiplier?: number): number|null {
   const direction = getValueModificationDirection(event);
   if (!direction) {
     return null;

package/front_end/ui/legacy/components/color_picker/Spectrum.ts

@@ -42,6 +42,7 @@ import {ContrastDetails, Events as ContrastDetailsEvents} from './ContrastDetail
 
 import type {ContrastInfo} from './ContrastInfo.js';
 import {ContrastOverlay} from './ContrastOverlay.js';
+import spectrumStyles from './spectrum.css.js';
 
 const UIStrings = {
   /**
@@ -183,7 +184,6 @@ export class Spectrum extends Common.ObjectWrapper.eventMixin<EventTypes, typeof
   private colorFormat?: string;
   constructor(contrastInfo?: ContrastInfo|null) {
     super(true);
-    this.registerRequiredCSS('ui/legacy/components/color_picker/spectrum.css');
 
     this.contentElement.tabIndex = 0;
     this.colorElement = this.contentElement.createChild('div', 'spectrum-color');
@@ -1140,6 +1140,7 @@ export class Spectrum extends Common.ObjectWrapper.eventMixin<EventTypes, typeof
   }
 
   wasShown(): void {
+    this.registerCSSFiles([spectrumStyles]);
     this.hueAlphaWidth = this.hueElement.offsetWidth;
     this.slideHelperWidth = this.hueSlider.offsetWidth / 2;
     this.dragWidth = this.colorElement.offsetWidth;

package/front_end/ui/legacy/components/cookie_table/CookiesTable.ts

@@ -43,6 +43,8 @@ import * as NetworkForward from '../../../../panels/network/forward/forward.js';
 import * as UI from '../../legacy.js';
 import * as DataGrid from '../data_grid/data_grid.js';
 
+import cookiesTableStyles from './cookiesTable.css.js';
+
 const UIStrings = {
   /**
   *@description Cookie table cookies table expires session value in Cookies Table of the Cookies table in the Application panel
@@ -124,7 +126,6 @@ export class CookiesTable extends UI.Widget.VBox {
       deleteCallback?: ((arg0: SDK.Cookie.Cookie, arg1: () => void) => void)) {
     super();
 
-    this.registerRequiredCSS('ui/legacy/components/cookie_table/cookiesTable.css');
     this.element.classList.add('cookies-table');
 
     this.saveCallback = saveCallback;
@@ -286,6 +287,10 @@ export class CookiesTable extends UI.Widget.VBox {
     this.cookieToBlockedReasons = null;
   }
 
+  wasShown(): void {
+    this.registerCSSFiles([cookiesTableStyles]);
+  }
+
   setCookies(
       cookies: SDK.Cookie.Cookie[],
       cookieToBlockedReasons?: ReadonlyMap<SDK.Cookie.Cookie, SDK.CookieModel.BlockedReason[]>): void {

package/front_end/ui/legacy/components/data_grid/DataGrid.ts

@@ -31,6 +31,8 @@ import * as i18n from '../../../../core/i18n/i18n.js';
 import * as Platform from '../../../../core/platform/platform.js';
 import * as UI from '../../legacy.js';
 
+import dataGridStyles from './dataGrid.css.js';
+
 const UIStrings = {
   /**
   *@description Accessible text label for expandible nodes in datagrids
@@ -169,7 +171,6 @@ export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     const {displayName, columns: columnsArray, editCallback, deleteCallback, refreshCallback} = dataGridParameters;
     this.element = document.createElement('div');
     this.element.classList.add('data-grid');
-    UI.Utils.appendStyle(this.element, 'ui/legacy/components/data_grid/dataGrid.css');
     this.element.tabIndex = 0;
     this.element.addEventListener('keydown', this.keyDown.bind(this), false);
     this.element.addEventListener('contextmenu', this.contextMenu.bind(this), true);
@@ -2351,6 +2352,7 @@ export class DataGridWidget<T> extends UI.Widget.VBox {
   }
 
   wasShown(): void {
+    this.registerCSSFiles([dataGridStyles]);
     this.dataGrid.wasShown();
   }
 

package/front_end/ui/legacy/components/data_grid/dataGrid.css

@@ -154,6 +154,7 @@
 }
 
 .data-grid th .sort-order-icon-container {
+  background-color: var(--color-background-elevation-1);
   position: absolute;
   top: 1px;
   right: 0;
@@ -162,6 +163,10 @@
   align-items: center;
 }
 
+.data-grid th:hover .sort-order-icon-container {
+  background-color: var(--color-background-highlight);
+}
+
 .data-grid th .sort-order-icon {
   margin-right: 4px;
   margin-bottom: -2px;

package/front_end/ui/legacy/components/inline_editor/BezierEditor.ts

@@ -6,6 +6,7 @@ import * as Common from '../../../../core/common/common.js';
 import * as Platform from '../../../../core/platform/platform.js';
 import * as UI from '../../legacy.js';
 
+import bezierEditorStyles from './bezierEditor.css.js';
 import {BezierUI} from './BezierUI.js';
 
 export class BezierEditor extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.VBox>(UI.Widget.VBox) {
@@ -29,7 +30,6 @@ export class BezierEditor extends Common.ObjectWrapper.eventMixin<EventTypes, ty
   constructor(bezier: UI.Geometry.CubicBezier) {
     super(true);
     this.bezierInternal = bezier;
-    this.registerRequiredCSS('ui/legacy/components/inline_editor/bezierEditor.css');
     this.contentElement.tabIndex = 0;
     this.setDefaultFocusedElement(this.contentElement);
 
@@ -79,6 +79,7 @@ export class BezierEditor extends Common.ObjectWrapper.eventMixin<EventTypes, ty
   }
 
   wasShown(): void {
+    this.registerCSSFiles([bezierEditorStyles]);
     this.unselectPresets();
     // Check if bezier matches a preset
     for (const category of this.presetCategories) {

package/front_end/ui/legacy/components/inline_editor/CSSLength.ts

@@ -77,6 +77,10 @@ export class CSSLength extends HTMLElement {
   }
 
   private onValueMousedown(event: MouseEvent): void {
+    if (event.button !== 0) {
+      return;
+    }
+
     this.currentMouseClientX = event.clientX;
     const targetDocument = event.target instanceof Node && event.target.ownerDocument;
     if (targetDocument) {
@@ -136,9 +140,12 @@ export class CSSLength extends HTMLElement {
         <span class="value"
           @mousedown=${this.onValueMousedown}
           @mouseup=${this.onValueMouseup}
-        >${this.length.value}</span><select class="unit ${this.length.unit}" @mouseup=${this.onUnitMouseup} @change=${this.onUnitChange}>
-          ${options}
-        </select>
+        >${this.length.value}</span><span class="unit">${this.length.unit}</span><div class="unit-dropdown">
+          <span class="icon"></span>
+          <select @mouseup=${this.onUnitMouseup} @change=${this.onUnitChange}>
+            ${options}
+          </select>
+        </div>
       `;
     // clang-format on
   }

package/front_end/ui/legacy/components/inline_editor/CSSShadowEditor.ts

@@ -9,6 +9,7 @@ import * as UI from '../../legacy.js';
 
 import type {CSSShadowModel} from './CSSShadowModel.js';
 import {CSSLength} from './CSSShadowModel.js';
+import cssShadowEditorStyles from './cssShadowEditor.css.js';
 
 const UIStrings = {
   /**
@@ -61,7 +62,6 @@ export class CSSShadowEditor extends Common.ObjectWrapper.eventMixin<EventTypes,
   private changedElement?: HTMLInputElement|null;
   constructor() {
     super(true);
-    this.registerRequiredCSS('ui/legacy/components/inline_editor/cssShadowEditor.css');
     this.contentElement.tabIndex = 0;
     this.setDefaultFocusedElement(this.contentElement);
 
@@ -106,7 +106,7 @@ export class CSSShadowEditor extends Common.ObjectWrapper.eventMixin<EventTypes,
     field.appendChild(textInput);
     textInput.id = propertyName;
     textInput.addEventListener('keydown', this.handleValueModification.bind(this), false);
-    textInput.addEventListener('mousewheel', this.handleValueModification.bind(this), false);
+    textInput.addEventListener('wheel', this.handleValueModification.bind(this), false);
     textInput.addEventListener('input', this.onTextInput.bind(this), false);
     textInput.addEventListener('blur', this.onTextBlur.bind(this), false);
     return textInput;
@@ -120,6 +120,7 @@ export class CSSShadowEditor extends Common.ObjectWrapper.eventMixin<EventTypes,
   }
 
   wasShown(): void {
+    this.registerCSSFiles([cssShadowEditorStyles]);
     this.updateUI();
   }
 

package/front_end/ui/legacy/components/inline_editor/FontEditor.ts

@@ -8,6 +8,7 @@ import * as SDK from '../../../../core/sdk/sdk.js';
 import * as IconButton from '../../../components/icon_button/icon_button.js';
 import * as UI from '../../legacy.js';
 
+import fontEditorStyles from './fontEditor.css.js';
 import * as FontEditorUnitConverter from './FontEditorUnitConverter.js';
 import * as FontEditorUtils from './FontEditorUtils.js';
 
@@ -123,7 +124,6 @@ export class FontEditor extends Common.ObjectWrapper.eventMixin<EventTypes, type
 
   constructor(propertyMap: Map<string, string>) {
     super(true);
-    this.registerRequiredCSS('ui/legacy/components/inline_editor/fontEditor.css');
     this.selectedNode = UI.Context.Context.instance().flavor(SDK.DOMModel.DOMNode);
 
     this.propertyMap = propertyMap;
@@ -174,6 +174,10 @@ export class FontEditor extends Common.ObjectWrapper.eventMixin<EventTypes, type
         /** hasUnits= */ true);
   }
 
+  wasShown(): void {
+    this.registerCSSFiles([fontEditorStyles]);
+  }
+
   private async createFontSelectorSection(propertyValue?: string): Promise<void> {
     if (propertyValue) {
       // FIXME(crbug.com/1148434): propertyValue will not be split correctly for font family names that contain commas.

package/front_end/ui/legacy/components/inline_editor/SwatchPopoverHelper.ts

@@ -7,6 +7,7 @@ import * as Platform from '../../../../core/platform/platform.js';
 import * as UI from '../../legacy.js';
 
 import {ColorSwatch} from './ColorSwatch.js';
+import swatchPopoverStyles from './swatchPopover.css.js';
 
 export class SwatchPopoverHelper extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   private readonly popover: UI.GlassPane.GlassPane;
@@ -22,7 +23,6 @@ export class SwatchPopoverHelper extends Common.ObjectWrapper.ObjectWrapper<Even
   constructor() {
     super();
     this.popover = new UI.GlassPane.GlassPane();
-    this.popover.registerRequiredCSS('ui/legacy/components/inline_editor/swatchPopover.css');
     this.popover.setSizeBehavior(UI.GlassPane.SizeBehavior.MeasureContent);
     this.popover.setMarginBehavior(UI.GlassPane.MarginBehavior.Arrow);
     this.popover.element.addEventListener('mousedown', e => e.consume(), false);
@@ -60,6 +60,7 @@ export class SwatchPopoverHelper extends Common.ObjectWrapper.ObjectWrapper<Even
       this.hide(true);
     }
 
+    this.popover.registerCSSFiles([swatchPopoverStyles]);
     this.dispatchEventToListeners(Events.WillShowPopover);
 
     this.isHidden = false;

package/front_end/ui/legacy/components/inline_editor/Swatches.ts

@@ -8,6 +8,8 @@ import * as UI from '../../legacy.js';
 
 import {ColorSwatch, FormatChangedEvent} from './ColorSwatch.js';
 import type {CSSShadowModel} from './CSSShadowModel.js';
+import bezierSwatchStyles from './bezierSwatch.css.js';
+import cssShadowSwatchStyles from './cssShadowSwatch.css.js';
 
 export class BezierSwatch extends HTMLSpanElement {
   private readonly iconElementInternal: UI.Icon.Icon;
@@ -16,7 +18,7 @@ export class BezierSwatch extends HTMLSpanElement {
   constructor() {
     super();
     const root = UI.Utils.createShadowRootWithCoreStyles(this, {
-      cssFile: 'ui/legacy/components/inline_editor/bezierSwatch.css',
+      cssFile: [bezierSwatchStyles],
       delegatesFocus: undefined,
     });
     this.iconElementInternal = UI.Icon.Icon.create('smallicon-bezier', 'bezier-swatch-icon');
@@ -63,7 +65,7 @@ export class CSSShadowSwatch extends HTMLSpanElement {
   constructor() {
     super();
     const root = UI.Utils.createShadowRootWithCoreStyles(this, {
-      cssFile: 'ui/legacy/components/inline_editor/cssShadowSwatch.css',
+      cssFile: [cssShadowSwatchStyles],
       delegatesFocus: undefined,
     });
     this.iconElementInternal = UI.Icon.Icon.create('smallicon-shadow', 'shadow-swatch-icon');

package/front_end/ui/legacy/components/inline_editor/cssLength.css

@@ -14,21 +14,42 @@
   cursor: ew-resize;
 }
 
-select.unit {
+.unit-dropdown {
+  display: none;
+}
+
+.unit-dropdown select {
   all: unset;
   cursor: pointer;
-  width: 2ch;
+  opacity: 0%;
+  width: 0.8em;
+}
+
+.icon {
+  position: absolute;
+  display: inline-block;
+  -webkit-mask-image: var(--image-file-chevrons);
+  -webkit-mask-position: -12px 4px;
+  -webkit-mask-size: 19px 6px;
+  -webkit-mask-repeat: no-repeat;
+  background-color: var(--color-text-primary);
+  content: '';
+  height: 1em;
+  width: 1em;
+}
+
+:host(:not(:last-child)) {
+  margin-right: 0.1em;
 }
 
-select.unit:hover {
-  text-decoration: underline;
+:host(:not(:last-child)) .unit-dropdown {
+  position: absolute;
 }
 
-select.unit.rem {
-  width: 3ch;
+.css-length:hover .unit-dropdown {
+  display: inline-block;
 }
 
-select.unit.vmin,
-select.unit.vmax {
-  width: 4ch;
+:host(:last-child) .unit-dropdown select {
+  width: 0.6em;
 }

package/front_end/ui/legacy/components/source_frame/module.json

@@ -1,8 +1,7 @@
 {
   "dependencies": [
     "ui/legacy/components/text_editor",
-    "ui/legacy",
-    "ui/legacy/components/object_ui"
+    "ui/legacy"
   ],
     "resources": [
     "fontView.css",

package/front_end/ui/legacy/inspectorCommon.css

@@ -390,7 +390,7 @@ input::placeholder {
 .chrome-select:enabled:active,
 .chrome-select:enabled:focus,
 .chrome-select:enabled:hover {
-  --override-select-box-shadow: 0 1px 2px rgb(0 0 0 / 10%);
+  --override-select-box-shadow: 0 0 0 2px var(--color-button-outline-focus);
 
   background-color: var(--color-background-elevation-1);
   box-shadow: var(--override-select-box-shadow);
@@ -401,10 +401,7 @@ input::placeholder {
 }
 
 .chrome-select:enabled:focus {
-  --override-extra-box-shadow-focus: 0 0 0 2px rgb(66 133 244 / 40%);
-
   border-color: transparent;
-  box-shadow: var(--override-select-box-shadow), var(--override-extra-box-shadow-focus);
 }
 
 .-theme-with-dark-background .chrome-select:enabled:active,
@@ -413,14 +410,7 @@ input::placeholder {
 :host-context(.-theme-with-dark-background) .chrome-select:enabled:active,
 :host-context(.-theme-with-dark-background) .chrome-select:enabled:focus,
 :host-context(.-theme-with-dark-background) .chrome-select:enabled:hover {
-  --override-select-box-shadow: 0 1px 2px rgb(230 230 230 / 10%);
-}
-
-/* Disabled so we can keep all the selectors above in one block */
-/* stylelint-disable-next-line no-descending-specificity */
-.-theme-with-dark-background .chrome-select:enabled:focus,
-:host-context(.-theme-with-dark-background) .chrome-select:enabled:focus {
-  --override-extra-box-shadow-focus: 0 0 0 2px rgb(11 78 189 / 40%);
+  --override-select-box-shadow: 0 0 0 2px var(--color-button-outline-focus);
 }
 
 .chrome-select-label {

package/front_end/ui/legacy/softDropDownButton.css

@@ -23,17 +23,6 @@ button.soft-dropdown > .title {
   text-overflow: ellipsis;
 }
 
-button.soft-dropdown:focus-visible::before {
-  content: "";
-  position: absolute;
-  top: 2px;
-  left: 2px;
-  right: 2px;
-  bottom: 2px;
-  border-radius: 2px;
-  background: var(--divider-line);
-}
-
 @media (forced-colors: active) {
   button.soft-dropdown {
     border: 1px solid ButtonText;

package/front_end/ui/legacy/themeColors.css

@@ -240,7 +240,7 @@
   --color-input-outline-disabled: rgba(189 193 198 / 20%);
   --color-input-text-disabled: rgba(128 134 139 / 70%);
   /* Colors for styling buttons */
-  --color-button-outline-focus: rgb(138 180 248 / 80%);
+  --color-button-outline-focus: rgb(138 180 248 / 75%);
   --color-button-primary-background-hovering: rgb(174 203 250 / 100%);
   --color-button-primary-background-pressed: rgb(210 227 252 / 100%);
   --color-button-primary-text: rgb(0 0 0);
@@ -265,10 +265,10 @@
   --color-token-builtin: rgb(159 180 214);
   --color-token-variable-special: rgb(0 85 170);
   --color-token-keyword: rgb(154 127 213);
-  --color-token-number: var(--color-token-number);
   --color-token-string: rgb(242 139 84);
   --color-token-string-special: var(--color-token-string);
   --color-token-atom: rgb(161 247 181);
+  --color-token-number: var(--color-token-atom);
   --color-token-comment: rgb(137 137 137);
   --color-token-tag: rgb(93 176 215);
   --color-token-attribute: rgb(155 187 220);

package/package.json

@@ -55,5 +55,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.934857"
+  "version": "1.0.936663"
 }

package/scripts/build/rollup.config.js

@@ -75,6 +75,9 @@ export default commandLineArgs => ({
       options: {
         strategy: minifyHTMLStrategy,
         minifyOptions: {
+          collapseInlineTagWhitespace: false,
+          collapseWhitespace: true,
+          conservativeCollapse: true,
           minifyCSS: false,
           removeOptionalTags: true,
         },