yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Accessibility changes for the top navbar tabs and settings tabs (#20107)

Browse Source 
* Accessibility changes for the top navbar tabs and settings tabs

* fix indention

---------

Co-authored-by: Mads Rasmussen <madsr@hey.com>
This commit is contained in:
Abdulaziz
2025-09-22 10:33:58 +02:00
committed by GitHub
parent 96b37889ae
commit 182b7e0cfa
2 changed files with 16 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts
View File

@@ -54,6 +54,10 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
);
}
#getSectionName(section: UmbExtensionManifestInitializer<ManifestSection>) {
return section.manifest?.meta.label ? this.localize.string(section.manifest?.meta.label) : section.manifest?.name;
}
#getSectionPath(manifest: ManifestSection | undefined) {
return `section/${manifest?.meta.pathname}`;
}
@@ -108,12 +112,10 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
?active="${this._currentSectionAlias === section.alias}"
@click=${(event: PointerEvent) => this.#onSectionClick(event, section.manifest)}
href="${this.#getSectionPath(section.manifest)}"
label="${ifDefined(
section.manifest?.meta.label
? this.localize.string(section.manifest?.meta.label)
: section.manifest?.name,
)}"
data-mark="section-link:${section.alias}"></uui-tab>
label="${ifDefined(this.#getSectionName(section))}"
data-mark="section-link:${section.alias}"
>${this.#getSectionName(section)}</uui-tab
>
`,
)}
</uui-tab-group>

12
src/Umbraco.Web.UI.Client/src/packages/core/section/section-main-views/section-main-views.element.ts
View File

@@ -111,6 +111,10 @@ export class UmbSectionMainViewElement extends UmbLitElement {
: nothing;
}
#getDashboardName(dashboard: ManifestDashboard) {
return dashboard.meta?.label ? this.localize.string(dashboard.meta.label) : (dashboard.name ?? dashboard.alias);
}
#renderDashboards() {
// Only show dashboards if there are more than one dashboard or if there are both dashboards and views
return (this._dashboards.length > 0 && this._views.length > 0) || this._dashboards.length > 1
@@ -124,10 +128,10 @@ export class UmbSectionMainViewElement extends UmbLitElement {
return html`
<uui-tab
href="${this._routerPath}/${dashboardPath}"
label="${dashboard.meta.label
? this.localize.string(dashboard.meta.label)
: (dashboard.name ?? dashboard.alias)}"
?active="${isActive}"></uui-tab>
label="${this.#getDashboardName(dashboard)}"
?active="${isActive}"
>${this.#getDashboardName(dashboard)}</uui-tab
>
`;
})}
</uui-tab-group>