Fixed invalid html structure the ExpandableNavbarSectionComponent had an ul tag containing non-li tags

This commit is contained in:
Alexandre Vryghem
2023-09-28 11:50:24 +02:00
parent 58d31dd73f
commit fa56d5dfb7
11 changed files with 12 additions and 20 deletions

View File

@@ -12,8 +12,7 @@ import { Router } from '@angular/router';
* Represents a non-expandable section in the admin sidebar * Represents a non-expandable section in the admin sidebar
*/ */
@Component({ @Component({
/* eslint-disable @angular-eslint/component-selector */ selector: 'ds-admin-sidebar-section',
selector: 'li[ds-admin-sidebar-section]',
templateUrl: './admin-sidebar-section.component.html', templateUrl: './admin-sidebar-section.component.html',
styleUrls: ['./admin-sidebar-section.component.scss'], styleUrls: ['./admin-sidebar-section.component.scss'],

View File

@@ -26,10 +26,10 @@
</div> </div>
</li> </li>
<ng-container *ngFor="let section of (sections | async)"> <li *ngFor="let section of (sections | async)">
<ng-container <ng-container
*ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container> *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
</ng-container> </li>
</ul> </ul>
</div> </div>
<div class="navbar-nav"> <div class="navbar-nav">

View File

@@ -15,8 +15,7 @@ import { Router } from '@angular/router';
* Represents a expandable section in the sidebar * Represents a expandable section in the sidebar
*/ */
@Component({ @Component({
/* eslint-disable @angular-eslint/component-selector */ selector: 'ds-expandable-admin-sidebar-section',
selector: 'li[ds-expandable-admin-sidebar-section]',
templateUrl: './expandable-admin-sidebar-section.component.html', templateUrl: './expandable-admin-sidebar-section.component.html',
styleUrls: ['./expandable-admin-sidebar-section.component.scss'], styleUrls: ['./expandable-admin-sidebar-section.component.scss'],
animations: [rotate, slide, bgColor] animations: [rotate, slide, bgColor]

View File

@@ -14,9 +14,9 @@
</a> </a>
<ul @slide *ngIf="(active | async)" (click)="deactivateSection($event)" <ul @slide *ngIf="(active | async)" (click)="deactivateSection($event)"
class="m-0 shadow-none border-top-0 dropdown-menu show"> class="m-0 shadow-none border-top-0 dropdown-menu show">
<ng-container *ngFor="let subSection of (subSections$ | async)"> <li *ngFor="let subSection of (subSections$ | async)">
<ng-container <ng-container
*ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container> *ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container>
</ng-container> </li>
</ul> </ul>
</div> </div>

View File

@@ -4,7 +4,6 @@ import { MenuService } from '../../shared/menu/menu.service';
import { slide } from '../../shared/animations/slide'; import { slide } from '../../shared/animations/slide';
import { first } from 'rxjs/operators'; import { first } from 'rxjs/operators';
import { HostWindowService } from '../../shared/host-window.service'; import { HostWindowService } from '../../shared/host-window.service';
import { rendersSectionForMenu } from '../../shared/menu/menu-section.decorator';
import { MenuID } from '../../shared/menu/menu-id.model'; import { MenuID } from '../../shared/menu/menu-id.model';
/** /**
@@ -16,7 +15,6 @@ import { MenuID } from '../../shared/menu/menu-id.model';
styleUrls: ['./expandable-navbar-section.component.scss'], styleUrls: ['./expandable-navbar-section.component.scss'],
animations: [slide] animations: [slide]
}) })
@rendersSectionForMenu(MenuID.PUBLIC, true)
export class ExpandableNavbarSectionComponent extends NavbarSectionComponent implements OnInit { export class ExpandableNavbarSectionComponent extends NavbarSectionComponent implements OnInit {
/** /**
* This section resides in the Public Navbar * This section resides in the Public Navbar

View File

@@ -8,8 +8,7 @@ import { MenuID } from '../../shared/menu/menu-id.model';
* Themed wrapper for ExpandableNavbarSectionComponent * Themed wrapper for ExpandableNavbarSectionComponent
*/ */
@Component({ @Component({
/* eslint-disable @angular-eslint/component-selector */ selector: 'ds-themed-expandable-navbar-section',
selector: 'li[ds-themed-expandable-navbar-section]',
styleUrls: [], styleUrls: [],
templateUrl: '../../shared/theme-support/themed.component.html', templateUrl: '../../shared/theme-support/themed.component.html',
}) })

View File

@@ -8,8 +8,7 @@ import { MenuID } from '../../shared/menu/menu-id.model';
* Represents a non-expandable section in the navbar * Represents a non-expandable section in the navbar
*/ */
@Component({ @Component({
/* eslint-disable @angular-eslint/component-selector */ selector: 'ds-navbar-section',
selector: 'li[ds-navbar-section]',
templateUrl: './navbar-section.component.html', templateUrl: './navbar-section.component.html',
styleUrls: ['./navbar-section.component.scss'] styleUrls: ['./navbar-section.component.scss']
}) })

View File

@@ -8,9 +8,9 @@
<li *ngIf="(isXsOrSm$ | async) && (isAuthenticated$ | async)"> <li *ngIf="(isXsOrSm$ | async) && (isAuthenticated$ | async)">
<ds-user-menu [inExpandableNavbar]="true"></ds-user-menu> <ds-user-menu [inExpandableNavbar]="true"></ds-user-menu>
</li> </li>
<ng-container *ngFor="let section of (sections | async)"> <li *ngFor="let section of (sections | async)">
<ng-container *ngComponentOutlet="(sectionMap$ | async).get(section.id)?.component; injector: (sectionMap$ | async).get(section.id)?.injector;"></ng-container> <ng-container *ngComponentOutlet="(sectionMap$ | async).get(section.id)?.component; injector: (sectionMap$ | async).get(section.id)?.injector;"></ng-container>
</ng-container> </li>
</ul> </ul>
</div> </div>
</div> </div>

View File

@@ -13,7 +13,6 @@ import { hasValue } from '../../../empty.util';
* Represents an expandable section in the dso edit menus * Represents an expandable section in the dso edit menus
*/ */
@Component({ @Component({
/* tslint:disable:component-selector */
selector: 'ds-dso-edit-menu-expandable-section', selector: 'ds-dso-edit-menu-expandable-section',
templateUrl: './dso-edit-menu-expandable-section.component.html', templateUrl: './dso-edit-menu-expandable-section.component.html',
styleUrls: ['./dso-edit-menu-expandable-section.component.scss'], styleUrls: ['./dso-edit-menu-expandable-section.component.scss'],

View File

@@ -10,7 +10,6 @@ import { MenuSection } from '../../../menu/menu-section.model';
* Represents a non-expandable section in the dso edit menus * Represents a non-expandable section in the dso edit menus
*/ */
@Component({ @Component({
/* tslint:disable:component-selector */
selector: 'ds-dso-edit-menu-section', selector: 'ds-dso-edit-menu-section',
templateUrl: './dso-edit-menu-section.component.html', templateUrl: './dso-edit-menu-section.component.html',
styleUrls: ['./dso-edit-menu-section.component.scss'] styleUrls: ['./dso-edit-menu-section.component.scss']

View File

@@ -10,9 +10,9 @@
<li *ngIf="(isXsOrSm$ | async) && (isAuthenticated$ | async)"> <li *ngIf="(isXsOrSm$ | async) && (isAuthenticated$ | async)">
<ds-user-menu [inExpandableNavbar]="true"></ds-user-menu> <ds-user-menu [inExpandableNavbar]="true"></ds-user-menu>
</li> </li>
<ng-container *ngFor="let section of (sections | async)"> <li *ngFor="let section of (sections | async)">
<ng-container *ngComponentOutlet="(sectionMap$ | async).get(section.id)?.component; injector: (sectionMap$ | async).get(section.id)?.injector;"></ng-container> <ng-container *ngComponentOutlet="(sectionMap$ | async).get(section.id)?.component; injector: (sectionMap$ | async).get(section.id)?.injector;"></ng-container>
</ng-container> </li>
</ul> </ul>
</div> </div>
<div class="navbar-buttons"> <div class="navbar-buttons">