@energycap/components 0.47.2-AppDarkMode.20261013-1459 → 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/README.md +0 -14
- package/energycap-components.min.css +2 -2
- package/fesm2022/energycap-components.mjs +38 -203
- package/fesm2022/energycap-components.mjs.map +1 -1
- package/package.json +1 -1
- package/src/assets/locales/en_US.json +2 -1
- package/src/styles/_global-variables.scss +1 -19
- package/src/styles/index.scss +0 -1
- package/src/styles/mixins/_button-base.scss +0 -1
- package/src/styles/mixins/_form-control-base.scss +0 -1
- package/src/styles/mixins/_table-base.scss +1 -1
- package/src/styles/mixins/_tags-base.scss +11 -11
- package/types/energycap-components.d.ts +8 -81
- package/src/assets/images/icon-carbonhub-dark.svg +0 -6
- package/src/assets/images/icon-dark.svg +0 -11
- package/src/styles/_theme-dark.scss +0 -109
package/package.json
CHANGED
|
@@ -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);
|
package/src/styles/index.scss
CHANGED
|
@@ -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:
|
|
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-
|
|
6
|
-
success: (bg: var(--ec-
|
|
7
|
-
warning: (bg: var(--ec-
|
|
8
|
-
danger: (bg: var(--ec-
|
|
9
|
-
accent: (bg: var(--ec-
|
|
10
|
-
chargeback: (bg: var(--ec-
|
|
11
|
-
accrual: (bg: var(--ec-
|
|
12
|
-
system: (bg: var(--ec-
|
|
13
|
-
interval:(bg: var(--ec-
|
|
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-
|
|
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:
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
15
|
+
import * as i76 from "@angular/cdk/a11y";
|
|
16
16
|
import { InteractivityChecker } from "@angular/cdk/a11y";
|
|
17
|
-
import * as
|
|
18
|
-
import * as
|
|
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
|
|
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,109 +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
|
-
// Shadows barely register against near-black surfaces, so floating popups
|
|
52
|
-
// (dropdown/combobox/multiselect menus, tooltips) also get a 1px light edge to
|
|
53
|
-
// separate them from same-colored content beneath, like tables.
|
|
54
|
-
--ec-box-shadow-overlay: 0 0 0 1px var(--ec-color-gray-6), 0 .25rem 1rem var(--ec-color-shadow-overlay);
|
|
55
|
-
|
|
56
|
-
// Dialog backdrops recede into a blue-black wash behind the dialog surface.
|
|
57
|
-
--ec-background-color-dialog: rgba(3, 7, 11, .72);
|
|
58
|
-
--ec-background-color-dialog-stacked: rgba(3, 7, 11, .48);
|
|
59
|
-
|
|
60
|
-
// Status background tints (re-tinted for dark surfaces)
|
|
61
|
-
--ec-background-color-info: rgba(109, 164, 254, .15);
|
|
62
|
-
--ec-background-color-success: rgba(99, 184, 54, .15);
|
|
63
|
-
--ec-background-color-caution: rgba(255, 222, 50, .15);
|
|
64
|
-
--ec-background-color-danger: rgba(254, 88, 117, .15);
|
|
65
|
-
--ec-background-color-accent: rgba(165, 114, 220, .15);
|
|
66
|
-
|
|
67
|
-
// Tag backgrounds — dark tinted variants of each type's hue so the (now light)
|
|
68
|
-
// tag text stays legible. The bright type-colored borders/icons are kept.
|
|
69
|
-
--ec-tag-background-color: rgba(255, 255, 255, .12);
|
|
70
|
-
--ec-tag-background-color-info: rgba(66, 117, 216, .28);
|
|
71
|
-
--ec-tag-background-color-success: rgba(99, 184, 54, .28);
|
|
72
|
-
--ec-tag-background-color-warning: rgba(245, 207, 8, .22);
|
|
73
|
-
--ec-tag-background-color-danger: rgba(254, 88, 117, .26);
|
|
74
|
-
--ec-tag-background-color-accent: rgba(165, 114, 220, .28);
|
|
75
|
-
--ec-tag-background-color-chargeback: rgba(249, 106, 21, .26);
|
|
76
|
-
--ec-tag-background-color-accrual: rgba(55, 213, 175, .22);
|
|
77
|
-
--ec-tag-background-color-system: rgba(255, 255, 255, .12);
|
|
78
|
-
--ec-tag-background-color-interval: rgba(255, 255, 255, .12);
|
|
79
|
-
|
|
80
|
-
// Interactive / link — shift up the palette for contrast on dark surfaces
|
|
81
|
-
--ec-color-interactive: var(--ec-color-cobalt-2);
|
|
82
|
-
--ec-color-link: var(--ec-color-interactive);
|
|
83
|
-
--ec-color-info: var(--ec-color-cobalt-2);
|
|
84
|
-
|
|
85
|
-
// Form controls — most inherit the above; override the few that don't
|
|
86
|
-
--ec-form-control-border-color: var(--ec-color-gray-5);
|
|
87
|
-
--ec-form-control-color-disabled: var(--ec-color-primary-dark);
|
|
88
|
-
--ec-form-control-color-readonly: var(--ec-color-primary-dark);
|
|
89
|
-
|
|
90
|
-
// Buttons — primary needs a distinct background since the default (gray-8)
|
|
91
|
-
// matches the dark surface color.
|
|
92
|
-
--ec-button-background-color-primary: var(--ec-color-cobalt-5);
|
|
93
|
-
// Secondary's default border (gray-8) disappears into the dark surface; lift it
|
|
94
|
-
// a step above form control borders so the button outline reads clearly.
|
|
95
|
-
--ec-button-border-color-secondary: var(--ec-color-gray-4);
|
|
96
|
-
|
|
97
|
-
// Spinner dots
|
|
98
|
-
--ec-spinner-color: var(--ec-color-cobalt-3);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
// Popover content uses status backgrounds as solid fills (not translucent tints),
|
|
102
|
-
// so restore opaque values for floating surfaces that need readable contrast.
|
|
103
|
-
:root[data-theme='dark'] .popover-content {
|
|
104
|
-
--ec-background-color-caution: rgb(255, 249, 195);
|
|
105
|
-
--ec-background-color-danger: rgb(255, 225, 231);
|
|
106
|
-
--ec-background-color-info: rgb(218, 229, 251);
|
|
107
|
-
--ec-background-color-success: rgb(227, 251, 214);
|
|
108
|
-
--ec-background-color-accent: rgb(237, 220, 255);
|
|
109
|
-
}
|