@energycap/components 0.47.2-AppDarkMode.20261009-1655 → 0.47.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@energycap/components",
3
- "version": "0.47.2-AppDarkMode.20261009-1655",
3
+ "version": "0.47.2",
4
4
  "schematics": "./schematics/collection.json",
5
5
  "dependencies": {
6
6
  "tslib": "^2.0.0"
@@ -72,5 +72,6 @@
72
72
  "ItemPicker_RemoveItem_SC": "Remove item",
73
73
  "Tooltip_DismissButton_SC": "Dismiss",
74
74
  "PageView_CloseDialog_SC": "Close dialog",
75
- "JsonDisplay_CopyButton_SC": "Copy JSON"
75
+ "JsonDisplay_CopyButton_SC": "Copy JSON",
76
+ "WizardProgress_StepCompleted_SC": "Completed"
76
77
  }
@@ -156,10 +156,6 @@
156
156
  --ec-background-color-disabled: rgba(26,26,35, .1);
157
157
  --ec-background-color-hover: rgb(195, 212, 247);
158
158
  --ec-background-color-selected: rgb(225, 233, 249);
159
- // Subtle translucent overlay for hover states on plain surfaces (theme-aware).
160
- --ec-overlay-color-hover: rgba(26, 26, 35, .1);
161
- // Table/grid heading surface.
162
- --ec-background-color-heading: #EBEDEE;
163
159
 
164
160
  --ec-background-color-info: rgb(218, 229, 251);
165
161
  --ec-background-color-success: rgb(227, 251, 214);
@@ -169,21 +165,7 @@
169
165
  --ec-background-color-promo: linear-gradient(78deg, #4B0793 0%, #A572DC 100%);
170
166
  --ec-background-color-instructional: linear-gradient(78deg, var(--ec-color-gray-8) 0%, var(--ec-color-gray-5) 100%);
171
167
  --ec-background-color-control: var(--ec-background-color);
172
-
173
- // Tag backgrounds (per type). Light theme uses the lightest palette tint; the
174
- // dark theme swaps these for dark tinted variants (see _theme-dark.scss) so the
175
- // text remains legible.
176
- --ec-tag-background-color: var(--ec-color-gray-1);
177
- --ec-tag-background-color-info: var(--ec-color-cobalt-1);
178
- --ec-tag-background-color-success: var(--ec-color-green-1);
179
- --ec-tag-background-color-warning: var(--ec-color-yellow-1);
180
- --ec-tag-background-color-danger: var(--ec-color-red-1);
181
- --ec-tag-background-color-accent: var(--ec-color-purple-1);
182
- --ec-tag-background-color-chargeback: var(--ec-color-orange-1);
183
- --ec-tag-background-color-accrual: var(--ec-color-aqua-1);
184
- --ec-tag-background-color-system: var(--ec-color-gray-1);
185
- --ec-tag-background-color-interval: var(--ec-color-gray-1);
186
-
168
+
187
169
  // Shadows
188
170
  --ec-box-shadow: 0px .125rem 1rem var(--ec-color-shadow);
189
171
  --ec-box-shadow-overlay: 0px .0625rem .5rem var(--ec-color-shadow-overlay);
@@ -5,7 +5,6 @@
5
5
  * EnergyCAP Components - Base Styles
6
6
  */
7
7
  @import 'global-variables';
8
- @import 'theme-dark';
9
8
  @import 'core';
10
9
  @import 'base';
11
10
  @import 'bootstrap/grid';
@@ -10,7 +10,6 @@ $button-padding-x: 0.5rem;
10
10
  padding: $button-padding-y $button-padding-x;
11
11
  border: 0;
12
12
  border-radius: var(--ec-border-radius);
13
- color: inherit;
14
13
  display: flex;
15
14
  align-items: center;
16
15
  justify-content: center;
@@ -176,7 +176,6 @@ $checkbox-indicator-size: $form-control-icon-size;
176
176
  border-radius: var(--ec-border-radius);
177
177
  background-image: none;
178
178
  background-clip: padding-box;
179
- color: inherit;
180
179
  width: 100%;
181
180
  line-height: $form-control-line-height;
182
181
  padding: $form-control-padding-y $form-control-padding-x;
@@ -2,7 +2,7 @@
2
2
 
3
3
  $table-row-bg-selected: var(--ec-background-color-selected);
4
4
  $table-row-bg-hover: var(--ec-background-color-hover);
5
- $table-row-bg-heading: var(--ec-background-color-heading);
5
+ $table-row-bg-heading: #EBEDEE;
6
6
  $table-cell-padding-x: .5rem;
7
7
  $table-cell-padding-y: .5rem;
8
8
 
@@ -2,15 +2,15 @@
2
2
  @import '../mixins/text';
3
3
 
4
4
  $tag-colors: (
5
- info: (bg: var(--ec-tag-background-color-info), border: var(--ec-color-info)),
6
- success: (bg: var(--ec-tag-background-color-success), border: var(--ec-color-success)),
7
- warning: (bg: var(--ec-tag-background-color-warning), border: var(--ec-color-caution)),
8
- danger: (bg: var(--ec-tag-background-color-danger), border: var(--ec-color-danger)),
9
- accent: (bg: var(--ec-tag-background-color-accent), border: var(--ec-color-accent)),
10
- chargeback: (bg: var(--ec-tag-background-color-chargeback), border: var(--ec-color-orange-7)),
11
- accrual: (bg: var(--ec-tag-background-color-accrual), border: var(--ec-color-aqua-5)),
12
- system: (bg: var(--ec-tag-background-color-system), border: var(--ec-color-gray-4)),
13
- interval:(bg: var(--ec-tag-background-color-interval), border: var(--ec-color-brand-black)),
5
+ info: (bg: var(--ec-color-cobalt-1), border: var(--ec-color-info)),
6
+ success: (bg: var(--ec-color-green-1), border: var(--ec-color-success)),
7
+ warning: (bg: var(--ec-color-yellow-1), border: var(--ec-color-caution)),
8
+ danger: (bg: var(--ec-color-red-1), border: var(--ec-color-danger)),
9
+ accent: (bg: var(--ec-color-purple-1), border: var(--ec-color-accent)),
10
+ chargeback: (bg: var(--ec-color-orange-1), border: var(--ec-color-orange-7)),
11
+ accrual: (bg: var(--ec-color-aqua-1), border: var(--ec-color-aqua-5)),
12
+ system: (bg: var(--ec-color-gray-1), border: var(--ec-color-gray-4)),
13
+ interval:(bg: var(--ec-color-gray-1), border: var(--ec-color-brand-black)),
14
14
  );
15
15
 
16
16
  @mixin tag-type($type) {
@@ -41,7 +41,7 @@ $tag-colors: (
41
41
  @include text-caption-1;
42
42
  @include truncate;
43
43
 
44
- background-color: var(--ec-tag-background-color);
44
+ background-color: var(--ec-color-gray-1);
45
45
  border: 2px solid var(--ec-color-gray-4);
46
46
  display: inline-flex;
47
47
  align-items: center;
@@ -98,7 +98,7 @@ $tag-colors: (
98
98
  right: .125rem;
99
99
  top: .0625rem;
100
100
  bottom: .0625rem;
101
- background-color: var(--ec-overlay-color-hover);
101
+ background-color: rgba(26, 26, 35, .1);
102
102
  border-radius: .125rem;
103
103
  }
104
104
  outline: none;
@@ -1,21 +1,21 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import { AfterContentInit, AfterViewChecked, AfterViewInit, ApplicationRef, ComponentRef, ElementRef, EventEmitter, Injector, ModuleWithProviders, OnChanges, OnDestroy, OnInit, PipeTransform, Provider, QueryList, Renderer2, SimpleChanges, TemplateRef, Type, ViewContainerRef } from "@angular/core";
3
- import * as i75 from "@angular/router";
3
+ import * as i74 from "@angular/router";
4
4
  import { ActivatedRoute, ActivatedRouteSnapshot, ParamMap, Params, QueryParamsHandling, Router, UrlSegment } from "@angular/router";
5
5
  import { Observable, Subject } from "rxjs";
6
- import * as i74 from "@angular/forms";
6
+ import * as i73 from "@angular/forms";
7
7
  import { AbstractControl, AsyncValidatorFn, FormControl, FormControlDirective, FormGroup, UntypedFormArray, UntypedFormControl, UntypedFormGroup, ValidationErrors, ValidatorFn } from "@angular/forms";
8
- import * as i76 from "@ngx-translate/core";
8
+ import * as i75 from "@ngx-translate/core";
9
9
  import { TranslateService } from "@ngx-translate/core";
10
10
  import { DateTime } from "luxon";
11
- import * as i78 from "@angular/cdk/overlay";
11
+ import * as i77 from "@angular/cdk/overlay";
12
12
  import { CdkConnectedOverlay, Overlay as Overlay$1, OverlayRef } from "@angular/cdk/overlay";
13
13
  import Popper from "popper.js";
14
14
  import { ClipboardService } from "ngx-clipboard";
15
- import * as i77 from "@angular/cdk/a11y";
15
+ import * as i76 from "@angular/cdk/a11y";
16
16
  import { InteractivityChecker } from "@angular/cdk/a11y";
17
- import * as i73 from "@angular/common";
18
- import * as i79 from "@angular/cdk/scrolling";
17
+ import * as i72 from "@angular/common";
18
+ import * as i78 from "@angular/cdk/scrolling";
19
19
  import { HttpErrorResponse } from "@angular/common/http";
20
20
  declare namespace button_component_d_exports {
21
21
  export { ButtonComponent, ButtonType };
@@ -58,11 +58,6 @@ export declare class ButtonComponent implements OnInit, OnChanges, AfterViewInit
58
58
  * Note: If both label and ariaLabel are provided, ariaLabel will be ignored as the visible label text provides the accessible name.
59
59
  */
60
60
  ariaLabel?: string;
61
- /**
62
- * Indicates the current pressed state of a toggle button.
63
- * When provided, sets the aria-pressed attribute on the native button element.
64
- */
65
- ariaPressed?: boolean;
66
61
  /**
67
62
  * Indicates whether the element controlled by this button is expanded or collapsed.
68
63
  * When provided, sets the aria-expanded attribute on the native button element.
@@ -176,10 +171,6 @@ export declare class ButtonComponent implements OnInit, OnChanges, AfterViewInit
176
171
  "alias": "ariaLabel";
177
172
  "required": false;
178
173
  };
179
- "ariaPressed": {
180
- "alias": "ariaPressed";
181
- "required": false;
182
- };
183
174
  "ariaExpanded": {
184
175
  "alias": "ariaExpanded";
185
176
  "required": false;
@@ -4865,7 +4856,6 @@ export declare class AppBarComponent implements OnChanges {
4865
4856
  userMenuMinWidth: number;
4866
4857
  userMenuTabindex: number;
4867
4858
  iconPath: string;
4868
- darkIconPath?: string;
4869
4859
  iconLink: string | null;
4870
4860
  hideAppIcon: boolean;
4871
4861
  menuItems: MenuItem[];
@@ -4898,10 +4888,6 @@ export declare class AppBarComponent implements OnChanges {
4898
4888
  "alias": "iconPath";
4899
4889
  "required": false;
4900
4890
  };
4901
- "darkIconPath": {
4902
- "alias": "darkIconPath";
4903
- "required": false;
4904
- };
4905
4891
  "iconLink": {
4906
4892
  "alias": "iconLink";
4907
4893
  "required": false;
@@ -8546,65 +8532,6 @@ export declare class MultiselectComponent extends FormControlBase implements OnI
8546
8532
  "selectionChanged": "selectionChanged";
8547
8533
  }, never, never, false, never>;
8548
8534
  }
8549
- export type Theme = 'light' | 'dark';
8550
- /** localStorage key the selected theme is persisted under. */
8551
- export declare const THEME_STORAGE_KEY = "ec-theme";
8552
- /**
8553
- * Manages the application's color theme (light/dark).
8554
- *
8555
- * Light mode is the default and corresponds to the baseline `:root` CSS custom
8556
- * properties. Dark mode is activated by setting `data-theme="dark"` on the
8557
- * document root element, which engages the overrides in `_theme-dark.scss`.
8558
- *
8559
- * The selected theme is persisted to localStorage (via {@link CacheService}) so it
8560
- * survives between sessions.
8561
- */
8562
- export declare class ThemeService {
8563
- private cacheService;
8564
- private readonly themeSubject;
8565
- /** Emits the active theme, starting with the current value. */
8566
- readonly theme$: Observable<Theme>;
8567
- constructor(cacheService: CacheService);
8568
- /** The currently active theme. */
8569
- get currentTheme(): Theme;
8570
- /**
8571
- * Reads the persisted theme (defaulting to light) and applies it. Call this
8572
- * once at application startup, as early as possible, to avoid a flash of the
8573
- * default theme before the saved one is applied.
8574
- */
8575
- init(): void;
8576
- /** Toggles between light and dark, persisting the new value. */
8577
- toggle(): void;
8578
- /**
8579
- * Applies a theme to the document and notifies subscribers.
8580
- * @param theme The theme to activate.
8581
- * @param persist When true (default) the choice is saved to localStorage.
8582
- */
8583
- setTheme(theme: Theme, persist?: boolean): void;
8584
- private applyTheme;
8585
- private getStoredTheme;
8586
- static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
8587
- static ɵprov: i0.ɵɵInjectableDeclaration<any>;
8588
- }
8589
- declare namespace theme_toggle_component_d_exports {
8590
- export { ThemeToggleComponent };
8591
- }
8592
- interface ThemeToggleViewModel {
8593
- icon: string;
8594
- ariaLabel: string;
8595
- ariaPressed: boolean;
8596
- }
8597
- /**
8598
- * Icon button that toggles the application between light and dark mode.
8599
- * Drop it anywhere (typically the app bar actions) and it drives {@link ThemeService}.
8600
- */
8601
- export declare class ThemeToggleComponent {
8602
- themeService: ThemeService;
8603
- readonly viewModel$: Observable<ThemeToggleViewModel>;
8604
- constructor(themeService: ThemeService);
8605
- static ɵfac: i0.ɵɵFactoryDeclaration<ThemeToggleComponent, never>;
8606
- static ɵcmp: i0.ɵɵComponentDeclaration<ThemeToggleComponent, "ec-theme-toggle", never, {}, {}, never, never, false, never>;
8607
- }
8608
8535
  export type ComponentsModuleConfig = {
8609
8536
  tracker: Provider;
8610
8537
  };
@@ -8616,7 +8543,7 @@ export declare class ComponentsModule {
8616
8543
  */
8617
8544
  static forRoot(config: ComponentsModuleConfig): ModuleWithProviders<ComponentsModule>;
8618
8545
  static ɵfac: i0.ɵɵFactoryDeclaration<ComponentsModule, never>;
8619
- static ɵmod: i0.ɵɵNgModuleDeclaration<ComponentsModule, [typeof ButtonComponent, typeof TabsComponent, typeof TextboxComponent, typeof NavItemActiveDirective, typeof SpinnerComponent, typeof ViewOverlayComponent, typeof BannerComponent, typeof ResizableTableDirective, typeof TabsComponent, typeof TableComponent, typeof SearchableTableComponent, typeof ComboboxComponent, typeof MenuComponent, typeof PopupContainerDirective, typeof DropdownComponent, typeof ConfirmComponent, typeof DialogComponent, typeof DateDisplayPipe, typeof TimeDisplayPipe, typeof MockDateDisplayPipe, typeof RadioButtonComponent, typeof CheckboxComponent, typeof NumericboxComponent, typeof AvatarComponent, typeof AppBarComponent, typeof SplashComponent, typeof IfViewportWidthDirective, typeof ClickAreaForDirective, typeof CollapsibleToggleComponent, typeof TableMasterRowComponent, typeof TableMasterHeaderRowComponent, typeof TableDetailRowComponent, typeof TableLockedColumnComponent, typeof TableSelectableRowComponent, typeof PopoverComponent, typeof TablePaginationComponent, typeof RowCountPipe, typeof CopyButtonDirective, typeof TablePaginationComponent, typeof TagsComponent, typeof FormControlComponent, typeof SelectComponent, typeof ItemDisplayComponent, typeof TableSelectableRowComponent, typeof ResizableColumnComponent, typeof DialogGroupComponent, typeof FileUploadComponent, typeof FormGroupComponent, typeof JsonDisplayComponent, typeof ToastComponent, typeof ToasterComponent, typeof PageViewComponent, typeof PageTitleComponent, typeof WizardProgressComponent, typeof WizardButtonsComponent, typeof HierarchyTreeComponent, typeof TreeComponent, typeof RelativeDatePipe, typeof ResizableComponent, typeof HighlightTextPipe, typeof FormControlLabelComponent, typeof ItemPickerComponent, typeof HelpPopoverComponent, typeof LinkButtonComponent, typeof TooltipComponent, typeof CopyTableButtonDirective, typeof TooltipDirective, typeof CalendarComponent, typeof CalendarItemComponent, typeof DateInputComponent, typeof KeyboardNavContainerDirective, typeof DateDisplayPipe2, typeof DateDisplayPipe3, typeof MultiselectComponent, typeof ThemeToggleComponent], [typeof i73.CommonModule, typeof i74.FormsModule, typeof i74.ReactiveFormsModule, typeof i75.RouterModule, typeof i76.TranslateModule, typeof i77.A11yModule, typeof i78.OverlayModule, typeof i79.ScrollingModule], [typeof ButtonComponent, typeof TabsComponent, typeof TextboxComponent, typeof NavItemActiveDirective, typeof SpinnerComponent, typeof ViewOverlayComponent, typeof BannerComponent, typeof TabsComponent, typeof TableComponent, typeof SearchableTableComponent, typeof ComboboxComponent, typeof MenuComponent, typeof MultiselectComponent, typeof PopupContainerDirective, typeof DropdownComponent, typeof ConfirmComponent, typeof DialogComponent, typeof DateDisplayPipe, typeof TimeDisplayPipe, typeof RadioButtonComponent, typeof CheckboxComponent, typeof NumericboxComponent, typeof AvatarComponent, typeof AppBarComponent, typeof SplashComponent, typeof IfViewportWidthDirective, typeof ClickAreaForDirective, typeof CollapsibleToggleComponent, typeof TableMasterRowComponent, typeof TableMasterHeaderRowComponent, typeof TableLockedColumnComponent, typeof TableSelectableRowComponent, typeof PopoverComponent, typeof CopyButtonDirective, typeof TablePaginationComponent, typeof TagsComponent, typeof FormControlComponent, typeof SelectComponent, typeof ItemDisplayComponent, typeof ResizableColumnComponent, typeof DialogGroupComponent, typeof FileUploadComponent, typeof FormGroupComponent, typeof JsonDisplayComponent, typeof ToastComponent, typeof ToasterComponent, typeof PageViewComponent, typeof PageTitleComponent, typeof WizardProgressComponent, typeof WizardButtonsComponent, typeof HierarchyTreeComponent, typeof TreeComponent, typeof RelativeDatePipe, typeof ResizableComponent, typeof HighlightTextPipe, typeof FormControlLabelComponent, typeof ItemPickerComponent, typeof HelpPopoverComponent, typeof LinkButtonComponent, typeof TooltipComponent, typeof CopyTableButtonDirective, typeof TooltipDirective, typeof CalendarComponent, typeof DateInputComponent, typeof KeyboardNavContainerDirective, typeof DateDisplayPipe2, typeof ThemeToggleComponent, typeof DateDisplayPipe3]>;
8546
+ static ɵmod: i0.ɵɵNgModuleDeclaration<ComponentsModule, [typeof ButtonComponent, typeof TabsComponent, typeof TextboxComponent, typeof NavItemActiveDirective, typeof SpinnerComponent, typeof ViewOverlayComponent, typeof BannerComponent, typeof ResizableTableDirective, typeof TabsComponent, typeof TableComponent, typeof SearchableTableComponent, typeof ComboboxComponent, typeof MenuComponent, typeof PopupContainerDirective, typeof DropdownComponent, typeof ConfirmComponent, typeof DialogComponent, typeof DateDisplayPipe, typeof TimeDisplayPipe, typeof MockDateDisplayPipe, typeof RadioButtonComponent, typeof CheckboxComponent, typeof NumericboxComponent, typeof AvatarComponent, typeof AppBarComponent, typeof SplashComponent, typeof IfViewportWidthDirective, typeof ClickAreaForDirective, typeof CollapsibleToggleComponent, typeof TableMasterRowComponent, typeof TableMasterHeaderRowComponent, typeof TableDetailRowComponent, typeof TableLockedColumnComponent, typeof TableSelectableRowComponent, typeof PopoverComponent, typeof TablePaginationComponent, typeof RowCountPipe, typeof CopyButtonDirective, typeof TablePaginationComponent, typeof TagsComponent, typeof FormControlComponent, typeof SelectComponent, typeof ItemDisplayComponent, typeof TableSelectableRowComponent, typeof ResizableColumnComponent, typeof DialogGroupComponent, typeof FileUploadComponent, typeof FormGroupComponent, typeof JsonDisplayComponent, typeof ToastComponent, typeof ToasterComponent, typeof PageViewComponent, typeof PageTitleComponent, typeof WizardProgressComponent, typeof WizardButtonsComponent, typeof HierarchyTreeComponent, typeof TreeComponent, typeof RelativeDatePipe, typeof ResizableComponent, typeof HighlightTextPipe, typeof FormControlLabelComponent, typeof ItemPickerComponent, typeof HelpPopoverComponent, typeof LinkButtonComponent, typeof TooltipComponent, typeof CopyTableButtonDirective, typeof TooltipDirective, typeof CalendarComponent, typeof CalendarItemComponent, typeof DateInputComponent, typeof KeyboardNavContainerDirective, typeof DateDisplayPipe2, typeof DateDisplayPipe3, typeof MultiselectComponent], [typeof i72.CommonModule, typeof i73.FormsModule, typeof i73.ReactiveFormsModule, typeof i74.RouterModule, typeof i75.TranslateModule, typeof i76.A11yModule, typeof i77.OverlayModule, typeof i78.ScrollingModule], [typeof ButtonComponent, typeof TabsComponent, typeof TextboxComponent, typeof NavItemActiveDirective, typeof SpinnerComponent, typeof ViewOverlayComponent, typeof BannerComponent, typeof TabsComponent, typeof TableComponent, typeof SearchableTableComponent, typeof ComboboxComponent, typeof MenuComponent, typeof MultiselectComponent, typeof PopupContainerDirective, typeof DropdownComponent, typeof ConfirmComponent, typeof DialogComponent, typeof DateDisplayPipe, typeof TimeDisplayPipe, typeof RadioButtonComponent, typeof CheckboxComponent, typeof NumericboxComponent, typeof AvatarComponent, typeof AppBarComponent, typeof SplashComponent, typeof IfViewportWidthDirective, typeof ClickAreaForDirective, typeof CollapsibleToggleComponent, typeof TableMasterRowComponent, typeof TableMasterHeaderRowComponent, typeof TableLockedColumnComponent, typeof TableSelectableRowComponent, typeof PopoverComponent, typeof CopyButtonDirective, typeof TablePaginationComponent, typeof TagsComponent, typeof FormControlComponent, typeof SelectComponent, typeof ItemDisplayComponent, typeof ResizableColumnComponent, typeof DialogGroupComponent, typeof FileUploadComponent, typeof FormGroupComponent, typeof JsonDisplayComponent, typeof ToastComponent, typeof ToasterComponent, typeof PageViewComponent, typeof PageTitleComponent, typeof WizardProgressComponent, typeof WizardButtonsComponent, typeof HierarchyTreeComponent, typeof TreeComponent, typeof RelativeDatePipe, typeof ResizableComponent, typeof HighlightTextPipe, typeof FormControlLabelComponent, typeof ItemPickerComponent, typeof HelpPopoverComponent, typeof LinkButtonComponent, typeof TooltipComponent, typeof CopyTableButtonDirective, typeof TooltipDirective, typeof CalendarComponent, typeof DateInputComponent, typeof KeyboardNavContainerDirective, typeof DateDisplayPipe2, typeof DateDisplayPipe3]>;
8620
8547
  static ɵinj: i0.ɵɵInjectorDeclaration<ComponentsModule>;
8621
8548
  }
8622
8549
  /**
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="none" viewBox="0 0 64 64">
2
- <path fill="#fff" d="M47.05 45.248v2.87H34.8v-2.24l6.282-5.932c.665-.635 1.502-1.408 1.758-1.851.275-.478.35-.911.35-1.359 0-.655-.222-1.152-.66-1.502-.444-.35-1.088-.502-1.945-.526-1.103-.025-1.767.344-2.343.62-.577.27-1.054.68-1.443 1.22l-2.747-1.767c.635-.945 1.511-1.683 2.629-2.22 1.117-.532 2.392-.802 3.84-.802 1.206 0 2.27.197 3.175.59.906.394 1.615.956 2.117 1.674.507.72.758 1.57.758 2.546 0 .886-.187 1.713-.556 2.49-.37.779-1.093 1.66-2.161 2.654l-3.747 3.535h6.942Z"/>
3
- <path fill="#4684E8" d="M32 6.4c-7.823 0-14.813 3.52-19.51 9.049l-5.248-3.722C13.11 4.569 22.02 0 32 0c9.98 0 18.89 4.569 24.758 11.727l-5.248 3.722C46.814 9.92 39.823 6.4 32 6.4Z"/>
4
- <path fill="#fff" d="M32 64c9.98 0 18.89-4.569 24.758-11.727l-5.248-3.722C46.813 54.08 39.823 57.6 32 57.6 17.86 57.6 6.4 46.14 6.4 32c0-4.017.95-7.798 2.6-11.18l-5.298-3.757A31.804 31.804 0 0 0 0 32c0 17.674 14.326 32 32 32Z"/>
5
- <path fill="#4684E8" d="M24.27 40.714h-.004a11.452 11.452 0 0 1-3.289-4.648 11.397 11.397 0 0 1 0-8.206 11.515 11.515 0 0 1 3.289-4.653h.005c4.106-3.613 10.722-3.613 14.823 0h.005a11.45 11.45 0 0 1 3.289 4.648c.074.187.118.384.177.57 1.073.129 2.077.38 2.973.779a8.118 8.118 0 0 1 2.748 1.9 15.976 15.976 0 0 0-1.64-6.267l-.015.01a16.201 16.201 0 0 0-3.406-4.574c-6.213-6.04-16.906-6.04-23.12 0a16.277 16.277 0 0 0-3.401 4.579l-.015-.01c-2.225 4.43-2.225 9.816 0 14.247l.015-.01a16.348 16.348 0 0 0 3.402 4.574c2.998 2.914 7.035 4.411 11.111 4.514v-4.77c-2.53-.094-5.026-.975-6.966-2.683"/>
6
- </svg>
@@ -1,11 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="33" height="32" fill="none" viewBox="0 0 33 32">
2
- <g clip-path="url(#a)">
3
- <path fill="#fff" d="M22.373 8.351H10v3.138h12.373V8.35Zm0 12.261H10v3.137h12.373v-3.137Zm-4.066-6.13H10v3.137h8.307v-3.137ZM16.136 3.514c3.834 0 7.26 1.725 9.563 4.436l2.572-1.826A15.657 15.657 0 0 0 16.136.376c-4.888 0-9.261 2.24-12.135 5.748L6.574 7.95c2.303-2.71 5.729-4.436 9.562-4.436Z"/>
4
- <path fill="#C8D4D9" d="M25.705 24.176c-2.303 2.71-5.729 4.436-9.563 4.436-3.833 0-7.26-1.726-9.562-4.436l.013-.007c-1.858-2.19-3-5.007-3-8.106 0-1.97.465-3.821 1.274-5.484L2.27 8.74a15.62 15.62 0 0 0-1.813 7.323 15.63 15.63 0 0 0 3.551 9.932 15.657 15.657 0 0 0 12.135 5.748c4.888 0 9.262-2.24 12.135-5.748l-2.572-1.82Z"/>
5
- </g>
6
- <defs>
7
- <clipPath id="a">
8
- <path fill="#fff" d="M.13 0h28.235v32H.13z"/>
9
- </clipPath>
10
- </defs>
11
- </svg>
@@ -1,102 +0,0 @@
1
- // Dark theme overrides.
2
- // These re-declare the SEMANTIC CSS custom properties (surfaces, text, borders,
3
- // status, interactive) with dark-appropriate values. They are scoped to the
4
- // `data-theme="dark"` attribute on the root element so light mode (the :root
5
- // baseline in _global-variables.scss) remains the default and is untouched.
6
- //
7
- // The brand palette tokens (--ec-color-gray-1..8, --ec-color-red-1..8, etc.) are
8
- // intentionally NOT overridden — only the semantic tokens that map to surfaces,
9
- // text, borders, and status. Most downstream tokens (form controls, shadows,
10
- // links, buttons) recompute automatically because they reference these via var().
11
- //
12
- // Values here are sensible defaults derived from the existing brand palette and
13
- // are meant to be tuned against real screens.
14
-
15
- @import 'colors';
16
-
17
- :root[data-theme='dark'] {
18
- // Surfaces use blue-tinted near-blacks, with subtle light layers for depth.
19
- --ec-background-color: rgb(19, 29, 44);
20
- --ec-background-color-overlay: rgba(19, 29, 44, .82);
21
- --ec-background-color-body: rgb(34, 41, 51);
22
- --ec-background-color-body-overlay: rgba(34, 41, 51, .82);
23
- --ec-background-color-control: var(--ec-background-color);
24
- --ec-background-color-detail: rgba(255, 255, 255, .04);
25
- --ec-background-color-disabled: rgba(255, 255, 255, .1);
26
- --ec-background-color-hover: rgba(255, 255, 255, .08);
27
- --ec-background-color-selected: rgba(255, 255, 255, .12);
28
- --ec-overlay-color-hover: rgba(255, 255, 255, .1);
29
- --ec-background-color-heading: rgb(27, 33, 40);
30
-
31
- // Text — the "dark" semantic name now carries a LIGHT value (text on dark bg)
32
- --ec-color-primary-dark: var(--ec-color-white);
33
- --ec-color-secondary-dark: rgba(255, 255, 255, .66);
34
- --ec-color-hint-dark: rgba(255, 255, 255, .38);
35
- --ec-color-disabled-dark: var(--ec-color-hint-dark);
36
-
37
- // Default icon color (defined by the icons project as a dark navy for light mode).
38
- // Flip it to a light value so icons remain legible on dark surfaces.
39
- --ec-color-icon: rgba(255, 255, 255, .66);
40
-
41
- // Borders
42
- --ec-border-color: rgb(48, 56, 65);
43
- --ec-border-color-dark: rgba(255, 255, 255, .6);
44
- --ec-border-color-hint: var(--ec-color-gray-7);
45
- --ec-border-color-control: var(--ec-color-gray-5);
46
- --ec-border-color-control-hover: var(--ec-color-gray-3);
47
-
48
- // Shadows (deeper on dark surfaces)
49
- --ec-color-shadow: rgba(0, 0, 0, .55);
50
- --ec-color-shadow-overlay: rgba(0, 0, 0, .7);
51
-
52
- // Dialog backdrops recede into a blue-black wash behind the dialog surface.
53
- --ec-background-color-dialog: rgba(3, 7, 11, .72);
54
- --ec-background-color-dialog-stacked: rgba(3, 7, 11, .48);
55
-
56
- // Status background tints (re-tinted for dark surfaces)
57
- --ec-background-color-info: rgba(109, 164, 254, .15);
58
- --ec-background-color-success: rgba(99, 184, 54, .15);
59
- --ec-background-color-caution: rgba(255, 222, 50, .15);
60
- --ec-background-color-danger: rgba(254, 88, 117, .15);
61
- --ec-background-color-accent: rgba(165, 114, 220, .15);
62
-
63
- // Tag backgrounds — dark tinted variants of each type's hue so the (now light)
64
- // tag text stays legible. The bright type-colored borders/icons are kept.
65
- --ec-tag-background-color: rgba(255, 255, 255, .12);
66
- --ec-tag-background-color-info: rgba(66, 117, 216, .28);
67
- --ec-tag-background-color-success: rgba(99, 184, 54, .28);
68
- --ec-tag-background-color-warning: rgba(245, 207, 8, .22);
69
- --ec-tag-background-color-danger: rgba(254, 88, 117, .26);
70
- --ec-tag-background-color-accent: rgba(165, 114, 220, .28);
71
- --ec-tag-background-color-chargeback: rgba(249, 106, 21, .26);
72
- --ec-tag-background-color-accrual: rgba(55, 213, 175, .22);
73
- --ec-tag-background-color-system: rgba(255, 255, 255, .12);
74
- --ec-tag-background-color-interval: rgba(255, 255, 255, .12);
75
-
76
- // Interactive / link — shift up the palette for contrast on dark surfaces
77
- --ec-color-interactive: var(--ec-color-cobalt-2);
78
- --ec-color-link: var(--ec-color-interactive);
79
- --ec-color-info: var(--ec-color-cobalt-2);
80
-
81
- // Form controls — most inherit the above; override the few that don't
82
- --ec-form-control-border-color: var(--ec-color-gray-5);
83
- --ec-form-control-color-disabled: var(--ec-color-primary-dark);
84
- --ec-form-control-color-readonly: var(--ec-color-primary-dark);
85
-
86
- // Buttons — primary needs a distinct background since the default (gray-8)
87
- // matches the dark surface color.
88
- --ec-button-background-color-primary: var(--ec-color-cobalt-5);
89
-
90
- // Spinner dots
91
- --ec-spinner-color: var(--ec-color-cobalt-3);
92
- }
93
-
94
- // Popover content uses status backgrounds as solid fills (not translucent tints),
95
- // so restore opaque values for floating surfaces that need readable contrast.
96
- :root[data-theme='dark'] .popover-content {
97
- --ec-background-color-caution: rgb(255, 249, 195);
98
- --ec-background-color-danger: rgb(255, 225, 231);
99
- --ec-background-color-info: rgb(218, 229, 251);
100
- --ec-background-color-success: rgb(227, 251, 214);
101
- --ec-background-color-accent: rgb(237, 220, 255);
102
- }