interesting
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix nested lists HTML markup

This commit is contained in:
Chocobozzz 2024-09-26 16:39:53 +02:00
parent fe62406e50
commit bc2a055bc8
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
2 changed files with 23 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
client/src/app/menu/menu.component.html
View File

@ -123,14 +123,16 @@
<ul [ngClass]="[ menuSection.key, 'menu-block' ]">
<li i18n class="block-title">{{ menuSection.title }}</li>
<ul>
<li *ngFor="let link of menuSection.links">
<a class="menu-link" [routerLink]="link.path" routerLinkActive="active">
<my-global-icon *ngIf="link.icon" [iconName]="link.icon" [ngClass]="link.iconClass" aria-hidden="true"></my-global-icon>
<ng-container>{{ link.shortLabel }}</ng-container>
</a>
</li>
</ul>
<li>
<ul>
<li *ngFor="let link of menuSection.links">
<a class="menu-link" [routerLink]="link.path" routerLinkActive="active">
<my-global-icon *ngIf="link.icon" [iconName]="link.icon" [ngClass]="link.iconClass" aria-hidden="true"></my-global-icon>
<ng-container>{{ link.shortLabel }}</ng-container>
</a>
</li>
</ul>
</li>
</ul>
</ng-container>
</div>

28
client/src/app/shared/shared-main/menu/top-menu-dropdown.component.html
View File

@ -1,16 +1,16 @@
<div class="sub-menu" [ngClass]="{ 'sub-menu-fixed': !isBroadcastMessageDisplayed, 'no-scroll': isModalOpened }">
<ul *ngFor="let menuEntry of menuEntries; index as id">
<li *ngIf="menuEntry.routerLink && isDisplayed(menuEntry)">
<a
class="sub-menu-entry" [routerLink]="menuEntry.routerLink" routerLinkActive="active"
#routerLink (click)="onActiveLinkScrollToTop(routerLink)" ariaCurrentWhenActive="page"
>{{ menuEntry.label }}</a>
</li>
@if (isDisplayed(menuEntry)) {
<ng-container *ngIf="!menuEntry.routerLink && isDisplayed(menuEntry)">
<!-- On mobile, use a modal to display sub menu items -->
@if (isInSmallView) {
@if (menuEntry.routerLink) {
<li *ngIf="menuEntry.routerLink && isDisplayed(menuEntry)">
<a
class="sub-menu-entry" [routerLink]="menuEntry.routerLink" routerLinkActive="active"
#routerLink (click)="onActiveLinkScrollToTop(routerLink)" ariaCurrentWhenActive="page"
>{{ menuEntry.label }}</a>
</li>
} @else if (isInSmallView) { <!-- On mobile, use a modal to display sub menu items -->
<li>
<button class="sub-menu-entry" [ngClass]="{ active: !!suffixLabels[menuEntry.label] }" (click)="openModal(id)">
{{ menuEntry.label }}
@ -20,10 +20,8 @@
</li>
} @else {
<!-- On desktop, use a classic dropdown -->
<div ngbDropdown #dropdown="ngbDropdown" autoClose="true" container="body">
<li>
<button ngbDropdownToggle class="sub-menu-entry" [ngClass]="{ active: !!suffixLabels[menuEntry.label] }">{{ menuEntry.label }}</button>
</li>
<li ngbDropdown #dropdown="ngbDropdown" autoClose="true" container="body">
<button ngbDropdownToggle class="sub-menu-entry" [ngClass]="{ active: !!suffixLabels[menuEntry.label] }">{{ menuEntry.label }}</button>
<ul ngbDropdownMenu>
<li *ngFor="let menuChild of menuEntry.children">
@ -39,9 +37,9 @@
</a>
</li>
</ul>
</div>
</li>
}
</ng-container>
}
</ul>
</div>