diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.html b/src/app/header/context-help-toggle/context-help-toggle.component.html
index 523874d461..1ec2050497 100644
--- a/src/app/header/context-help-toggle/context-help-toggle.component.html
+++ b/src/app/header/context-help-toggle/context-help-toggle.component.html
@@ -1,12 +1,10 @@
-
+
diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.scss b/src/app/header/context-help-toggle/context-help-toggle.component.scss
index af233dd7b5..f3e5e01880 100644
--- a/src/app/header/context-help-toggle/context-help-toggle.component.scss
+++ b/src/app/header/context-help-toggle/context-help-toggle.component.scss
@@ -1,13 +1,8 @@
-.ds-context-help-toggle-enabled {
+.ds-context-help-toggle {
color: var(--ds-header-icon-color);
background-color: var(--ds-header-bg);
- &:hover, &focus {
+ &:hover, &:focus {
color: var(--ds-header-icon-color-hover);
}
}
-
-.ds-context-help-toggle-disabled {
- color: grey;
- background-color: var(--ds-header-bg);
-}
diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts
index 93421b58eb..2d1b5bad20 100644
--- a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts
+++ b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts
@@ -13,9 +13,9 @@ describe('ContextHelpToggleComponent', () => {
beforeEach(async () => {
contextHelpService = jasmine.createSpyObj('contextHelpService', [
- 'contextHelpEmpty$', 'toggleIcons'
+ 'tooltipCount$', 'toggleIcons'
]);
- contextHelpService.contextHelpEmpty$.and.returnValue(observableOf(true));
+ contextHelpService.tooltipCount$.and.returnValue(observableOf(0));
await TestBed.configureTestingModule({
declarations: [ ContextHelpToggleComponent ],
providers: [
@@ -37,19 +37,17 @@ describe('ContextHelpToggleComponent', () => {
});
describe('if there are no elements on the page with a tooltip', () => {
- it('clicking the button does not toggle context help icon visibility', fakeAsync(() => {
+ it('the toggle should not be visible', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
- fixture.debugElement.query(By.css('a')).nativeElement.click();
- tick();
- expect(contextHelpService.toggleIcons).toHaveBeenCalledTimes(0);
+ expect(fixture.debugElement.query(By.css('div'))).toBeNull();
});
}));
});
describe('if there are elements on the page with a tooltip', () => {
beforeEach(() => {
- contextHelpService.contextHelpEmpty$.and.returnValue(observableOf(false));
+ contextHelpService.tooltipCount$.and.returnValue(observableOf(1));
fixture.detectChanges();
});
diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.ts b/src/app/header/context-help-toggle/context-help-toggle.component.ts
index 6804836246..1bd6eb4b17 100644
--- a/src/app/header/context-help-toggle/context-help-toggle.component.ts
+++ b/src/app/header/context-help-toggle/context-help-toggle.component.ts
@@ -1,33 +1,30 @@
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ContextHelpService } from '../../shared/context-help.service';
-import { TranslateService } from '@ngx-translate/core';
import { Observable, Subscription, BehaviorSubject } from 'rxjs';
import { combineLatest } from 'rxjs';
+import { map } from 'rxjs/operators';
+/**
+ * Renders a "context help toggle" button that toggles the visibility of tooltip buttons on the page.
+ * If there are no tooltip buttons available on the current page, the toggle is unclickable.
+ */
@Component({
selector: 'ds-context-help-toggle',
templateUrl: './context-help-toggle.component.html',
styleUrls: ['./context-help-toggle.component.scss']
})
export class ContextHelpToggleComponent implements OnInit, OnDestroy {
- buttonDisabled$: Observable
;
+ buttonVisible$: Observable;
constructor(
private contextHelpService: ContextHelpService,
- private translateService: TranslateService
) { }
- private clickEvents: BehaviorSubject = new BehaviorSubject(null);
private subs: Subscription[];
ngOnInit(): void {
- this.buttonDisabled$ = this.contextHelpService.contextHelpEmpty$();
- this.subs = [
- this.buttonDisabled$.subscribe(),
- combineLatest([this.clickEvents, this.buttonDisabled$])
- .subscribe(([_, disabled]) =>
- disabled ? null : this.contextHelpService.toggleIcons())
- ];
+ this.buttonVisible$ = this.contextHelpService.tooltipCount$().pipe(map(x => x > 0));
+ this.subs = [this.buttonVisible$.subscribe()];
}
ngOnDestroy() {
@@ -35,6 +32,6 @@ export class ContextHelpToggleComponent implements OnInit, OnDestroy {
}
onClick() {
- this.clickEvents.next(null);
+ this.contextHelpService.toggleIcons();
}
}
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index 922b2d02e1..546f6a06fa 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -15,7 +15,7 @@
a {
color: var(--ds-header-icon-color);
- &:hover, &focus {
+ &:hover, &:focus {
color: var(--ds-header-icon-color-hover);
}
}
diff --git a/src/app/search-navbar/search-navbar.component.scss b/src/app/search-navbar/search-navbar.component.scss
index c1ccd289b2..125aa82f1f 100644
--- a/src/app/search-navbar/search-navbar.component.scss
+++ b/src/app/search-navbar/search-navbar.component.scss
@@ -22,8 +22,5 @@ a.submit-icon {
width: 40vw !important;
}
- a.submit-icon {
- color: var(--bs-link-color);
- }
}
diff --git a/src/app/shared/auth-nav-menu/auth-nav-menu.component.scss b/src/app/shared/auth-nav-menu/auth-nav-menu.component.scss
index ac51af27bf..36161ff3da 100644
--- a/src/app/shared/auth-nav-menu/auth-nav-menu.component.scss
+++ b/src/app/shared/auth-nav-menu/auth-nav-menu.component.scss
@@ -13,9 +13,9 @@
}
.dropdown-toggle {
- color: var(--ds-header-icon-color) !important;
+ color: var(--ds-header-icon-color);
- &:hover, &focus {
+ &:hover, &:focus {
color: var(--ds-header-icon-color-hover);
}
}
diff --git a/src/app/shared/context-help.service.ts b/src/app/shared/context-help.service.ts
index 68f6cfd92c..f10f258be9 100644
--- a/src/app/shared/context-help.service.ts
+++ b/src/app/shared/context-help.service.ts
@@ -54,9 +54,9 @@ export class ContextHelpService {
/**
* Observable that yields true iff there are currently no context help entries in the store.
*/
- contextHelpEmpty$(): Observable {
+ tooltipCount$(): Observable {
return this.store.pipe(select(allContextHelpSelector))
- .pipe(map((models: ContextHelpModels) => Object.keys(models).length === 0));
+ .pipe(map((models: ContextHelpModels) => Object.keys(models).length));
}
/**
diff --git a/src/app/shared/lang-switch/lang-switch.component.scss b/src/app/shared/lang-switch/lang-switch.component.scss
index 6d79e6ab25..7b593a9bb5 100644
--- a/src/app/shared/lang-switch/lang-switch.component.scss
+++ b/src/app/shared/lang-switch/lang-switch.component.scss
@@ -2,12 +2,10 @@
display:none;
}
-@media screen and (min-width: map-get($grid-breakpoints, md)) {
- .dropdown-toggle {
- color: var(--ds-header-icon-color);
+.dropdown-toggle {
+ color: var(--ds-header-icon-color);
- &:hover, &focus {
- color: var(--ds-header-icon-color-hover);
- }
+ &:hover, &:focus {
+ color: var(--ds-header-icon-color-hover);
}
}
diff --git a/src/app/shared/search/search-filters/search-filter/search-authority-filter/search-authority-filter.component.scss b/src/app/shared/search/search-filters/search-filter/search-authority-filter/search-authority-filter.component.scss
index 8f61f5ebf1..9e01e19d02 100644
--- a/src/app/shared/search/search-filters/search-filter/search-authority-filter/search-authority-filter.component.scss
+++ b/src/app/shared/search/search-filters/search-filter/search-authority-filter/search-authority-filter.component.scss
@@ -1,7 +1,7 @@
.filters {
a {
color: var(--bs-body-color);
- &:hover, &focus {
+ &:hover, &:focus {
text-decoration: none;
}
span.badge {
diff --git a/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.scss b/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.scss
index 74cede54a8..1211d2d478 100644
--- a/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.scss
+++ b/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.scss
@@ -1,6 +1,6 @@
a {
color: var(--bs-body-color);
- &:hover, &focus {
+ &:hover, &:focus {
text-decoration: none;
}
span.badge {
diff --git a/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.scss b/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.scss
index 74cede54a8..1211d2d478 100644
--- a/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.scss
+++ b/src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.scss
@@ -1,6 +1,6 @@
a {
color: var(--bs-body-color);
- &:hover, &focus {
+ &:hover, &:focus {
text-decoration: none;
}
span.badge {
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 02700f76d9..f050ef6f33 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -2864,8 +2864,6 @@
"nav.context-help-toggle": "Toggle context help",
- "nav.context-help-toggle-disabled": "No context help available on this page",
-
"nav.language": "Language switch",
"nav.login": "Log In",