vaultwarden/bitwarden-estensione-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2024-12-22 16:12:07 +01:00
Code Issues 1 Releases Wiki Activity

Fix tab item text color

Browse Source 
Tab item text color broke after a merge from master and needs a fix to account for bootstrap styles in Web.
This commit is contained in:
Shane Melton 2022-10-18 09:07:56 -07:00
parent 0ededfac3a
commit ae39afeaa6
No known key found for this signature in database
1 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
libs/components/src/tabs/shared/tab-list-item.directive.ts
View File

@ -28,8 +28,23 @@ export class TabListItemDirective implements FocusableOption {
@HostBinding("class")
get classList(): string[] {
return this.baseClassList
.concat(this.active ? this.activeClassList : ["!tw-text-main"])
.concat(this.disabled ? this.disabledClassList : []);
.concat(this.active ? this.activeClassList : [])
.concat(this.disabled ? this.disabledClassList : [])
.concat(this.textColorClassList);
}
/**
* Classes used for styling tab item text color.
* Separate text color class list required to override bootstrap classes in Web.
*/
get textColorClassList(): string[] {
if (this.disabled) {
return ["!tw-text-muted", "hover:!tw-text-muted"];
}
if (this.active) {
return ["!tw-text-primary-500", "hover:!tw-text-primary-700"];
}
return ["!tw-text-main", "hover:!tw-text-main"];
}
get baseClassList(): string[] {
@ -47,9 +62,7 @@ export class TabListItemDirective implements FocusableOption {
"tw-border-transparent",
"tw-border-solid",
"tw-bg-transparent",
"tw-text-main",
"hover:tw-underline",
"hover:tw-text-main",
"focus-visible:tw-z-10",
"focus-visible:tw-outline-none",
"focus-visible:tw-ring-2",
@ -58,13 +71,7 @@ export class TabListItemDirective implements FocusableOption {
}
get disabledClassList(): string[] {
return [
"!tw-bg-secondary-100",
"!tw-text-muted",
"hover:!tw-text-muted",
"!tw-no-underline",
"tw-cursor-not-allowed",
];
return ["!tw-bg-secondary-100", "!tw-no-underline", "tw-cursor-not-allowed"];
}
get activeClassList(): string[] {
@ -75,9 +82,7 @@ export class TabListItemDirective implements FocusableOption {
"tw-border-b",
"tw-border-b-background",
"tw-bg-background",
"!tw-text-primary-500",
"hover:tw-border-t-primary-700",
"hover:!tw-text-primary-700",
"focus-visible:tw-border-t-primary-700",
"focus-visible:!tw-text-primary-700",
];