cu-ng-design-library
Version:
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.3.0.
1 lines • 118 kB
Source Map (JSON)
{"version":3,"file":"cu-ng-design-library.mjs","sources":["../../../projects/cu-ng-design-library/src/lib/components/layout/main-menu/main-menu.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/main-menu/main-menu.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/main-menu/main-menu.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/skip-link/skip-link.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/skip-link/skip-link.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/skip-link/skip-link.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/footer/footer.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/footer/footer.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/footer/footer.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/sub-footer/sub-footer.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/sub-footer/sub-footer.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/sub-footer/sub-footer.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/header/header.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/header/header.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/header/header.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/main/main.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/main/main.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/header-buttons/header-buttons.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/header-buttons/header-buttons.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/header-buttons/header-buttons.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/main-footer/main-footer.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/main-footer/main-footer.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/main-footer/main-footer.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/primary-content/primary-content.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/primary-content/primary-content.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/primary-content/primary-content.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/secondary-content/secondary-content.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/secondary-content/secondary-content.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/secondary-content/secondary-content.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/utility-nav/utility-nav.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/utility-nav/utility-nav.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/utility-nav/utility-nav.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-dialog/mobile-dialog.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-dialog/mobile-dialog.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-dialog/mobile-dialog.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-menu/mobile-menu.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-menu/mobile-menu.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/mobile-menu/mobile-menu.module.ts","../../../projects/cu-ng-design-library/src/lib/pages/two-column/two-column.component.ts","../../../projects/cu-ng-design-library/src/lib/pages/two-column/two-column.component.html","../../../projects/cu-ng-design-library/src/lib/pages/two-column/two-column.module.ts","../../../projects/cu-ng-design-library/src/lib/pages/one-column/one-column.component.ts","../../../projects/cu-ng-design-library/src/lib/pages/one-column/one-column.component.html","../../../projects/cu-ng-design-library/src/lib/pages/one-column/one-column.module.ts","../../../projects/cu-ng-design-library/src/lib/cu-ng-design-library.breakpoints.ts","../../../projects/cu-ng-design-library/src/lib/pages/two-column-example/two-column-example.component.ts","../../../projects/cu-ng-design-library/src/lib/pages/two-column-example/two-column-example.component.html","../../../projects/cu-ng-design-library/src/lib/pages/two-column-example/two-column-example.module.ts","../../../projects/cu-ng-design-library/src/lib/pages/one-column-example/one-column-example.component.ts","../../../projects/cu-ng-design-library/src/lib/pages/one-column-example/one-column-example.component.html","../../../projects/cu-ng-design-library/src/lib/pages/one-column-example/one-column-example.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/admin-toolbar/admin-toolbar.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/side-menu/side-menu.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/side-menu/side-menu.component.html","../../../projects/cu-ng-design-library/src/lib/components/layout/side-menu/side-menu.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/admin-toolbar/admin-toolbar.module.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/admin-layout/admin-layout.component.ts","../../../projects/cu-ng-design-library/src/lib/components/layout/admin-layout/admin-layout.module.ts","../../../projects/cu-ng-design-library/src/lib/components/loading/loading.component.ts","../../../projects/cu-ng-design-library/src/lib/components/loading/loading.module.ts","../../../projects/cu-ng-design-library/src/lib/components/announcement/announcement.component.ts","../../../projects/cu-ng-design-library/src/lib/components/announcement/announcement.module.ts","../../../projects/cu-ng-design-library/src/lib/components/alert/alert.component.ts","../../../projects/cu-ng-design-library/src/lib/components/alert/alert.module.ts","../../../projects/cu-ng-design-library/src/lib/components/bread-crumb/bread-crumb.component.ts","../../../projects/cu-ng-design-library/src/lib/components/bread-crumb/bread-crumb.module.ts","../../../projects/cu-ng-design-library/src/lib/cu-ng-design-library.service.ts","../../../projects/cu-ng-design-library/src/lib/cu-ng-design-library.component.ts","../../../projects/cu-ng-design-library/src/lib/shared/modules/material/material.module.ts","../../../projects/cu-ng-design-library/src/lib/cu-ng-design-library.module.ts","../../../projects/cu-ng-design-library/src/public-api.ts","../../../projects/cu-ng-design-library/src/cu-ng-design-library.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\nimport { Routes } from '@angular/router';\n\n// This component implements the main menu.\n// As outlined in https://www.w3.org/WAI/ARIA/apg/example-index/menubar/menubar-navigation.html\n@Component({\n selector: 'lib-main-menu',\n templateUrl: './main-menu.component.html',\n styleUrls: ['./main-menu.component.scss'],\n})\nexport class MainMenuComponent {\n @Input() routes!: Routes;\n}\n","<nav\n class=\"dropdown-menu\"\n id=\"main-navigation\"\n aria-label=\"Main Navigation\"\n>\n <div class=\"container-fluid\">\n <ul class=\"list-menu links\">\n <ng-container *ngFor=\"let route of routes\">\n <li\n class=\"top-level-item parent top-level-li\"\n *ngIf=\"route.data && route.data['menu'] == 'main'\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n >\n\n <ng-container *ngIf=\"!route.children; else parent \">\n <a\n mat-button\n routerLink=\"{{route.path}}\"\n >\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n <mat-icon\n *ngIf=\"route.data && route.data['class'] == 'ext-link'\"\n class=\"ext-link\"\n >\n launch\n </mat-icon>\n </a>\n </ng-container>\n\n <ng-template #parent>\n <!-- <a mat-button routerLink=\"{{route.path}}\">{{route.path}}</a> -->\n <button\n mat-button\n [matMenuTriggerFor]=\"menu\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: false}\"\n >\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu\n #menu=\"matMenu\"\n backdropClass=\"main-menu-backdrop\"\n >\n <ng-container *ngFor=\"let child of route.children\">\n <a\n mat-menu-item\n routerLink=\"{{route.path}}/{{child.path}}\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n >\n {{child.data && child.data['title'] ? child.data['title'] : child.path}}\n </a>\n </ng-container>\n </mat-menu>\n </ng-template>\n\n <!-- <a routerLink=\"{{route.path}}\" >\n {{route.path}}\n </a>\n <ul *ngIf=\"route.children\" class=\"list-menu links vertical children\" style=\"min-width: 138px;\">\n <ng-container *ngFor=\"let child of route.children\">\n <li\n *ngIf=\"child.data && child.data['menu'] == route.path\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\">\n <a\n routerLink=\"{{child.path}}\"\n >{{child.path}}</a>\n </li>\n </ng-container>\n </ul> -->\n </li>\n </ng-container>\n </ul>\n </div>\n</nav>\n","import { MatButtonModule } from '@angular/material/button';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\nimport { MatIconModule } from '@angular/material/icon';\nimport { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\nimport { APP_BASE_HREF } from '@angular/common';\nimport { MatMenuModule } from '@angular/material/menu';\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule,\n RouterModule,\n MatMenuModule,\n MatIconModule,\n MatButtonModule,\n ],\n exports: [\n RouterModule,\n CommonModule,\n MatMenuModule,\n MatIconModule,\n BrowserAnimationsModule,\n MatButtonModule,\n ],\n providers: [{ provide: APP_BASE_HREF, useValue: '/' }],\n})\nexport class MainMenuModule {}\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-skip-link',\n templateUrl: './skip-link.component.html',\n styleUrls: ['./skip-link.component.scss'],\n})\nexport class SkipLinkComponent {}\n","<div id=\"skipnav\"><a href=\"#main\">Skip to main content</a></div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class SkipLinkModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-footer',\n templateUrl: './footer.component.html',\n styleUrls: ['./footer.component.scss'],\n})\nexport class FooterComponent {}\n","<footer>\n <ng-content></ng-content>\n</footer>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class FooterModule { }\n","import { Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'lib-sub-footer',\n templateUrl: './sub-footer.component.html',\n styleUrls: ['./sub-footer.component.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class SubFooterComponent {\n // deprecated\n @Input() isMobileLayout?: boolean;\n @Input()\n message = `If you have a disability and are having trouble accessing information on this website or need materials in an alternate format, contact <a href=\"mailto:web-accessibility@cornell.edu\">web-accessibility@cornell.edu</a> for assistance.`;\n constructor() {\n if (this.isMobileLayout !== undefined) {\n console.log(\n \"isMobileLayout is deprecated. Use the 'mobile' class on the host element instead.\"\n );\n }\n }\n}\n","<div class=\"sub-footer\">\n <div class=\"container-fluid\">\n <div class=\"row\">\n <div class=\"vertical-align\">\n <mat-icon class=\"icon\">accessibility_new</mat-icon>\n <p class=\"accessibility-message\" [innerHTML]=\"message\"></p>\n </div>\n </div>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatIconModule } from '@angular/material/icon';\n\n@NgModule({\n declarations: [],\n imports: [CommonModule, MatIconModule],\n exports: [MatIconModule],\n})\nexport class SubFooterModule {}\n","import { Component, Input, ViewEncapsulation } from '@angular/core';\n\n// Cornell Branding Banner\n// .cu-red - Overrides the default light gray banner to be red with white logo. Affects both 45px and Large Seal options.\n// .cu-black - Overrides the default light gray banner to be black with white logo. Affects both 45px and Large Seal options.\n// .cu-gray - Overrides the default light gray banner to be dark gray with white logo. Affects both 45px and Large Seal options.\n// .cu-45 - Renders as a ~45px banner with small Cornell logo (this is also the default if no body class is defined). Headings appear below the banner. Note: This class is mutually exclusive with .cu-seal.\n// .cu-seal - Renders as a taller banner with a large standalone Cornell seal. Headings appear to the right of the seal. Note: This class is mutually exclusive with .cu-45.\n// .cu-seal-right - Added to .cu-seal to swap the left and right positions of the seal and headings.\n// .cu-45-mobile - Added to .cu-seal to switch to 45px style at mobile sizes.\n// .cu-45-mobile-red - Added to .cu-seal-mobile also activate the red color option on the 45px banner at mobile sizes.\n// .no-main-nav - When .cu-seal is in use and no main navigation bar is planned, this class can be included to apply some subtle adjustments to the Cornell header.\n\nexport type theme = 'cu-default' | 'cu-red' | 'cu-black' | 'cu-gray';\nexport type logo = 'cu-seal' | 'cu-45';\n\n@Component({\n selector: 'lib-header',\n templateUrl: './header.component.html',\n styleUrls: ['./header.component.scss'],\n encapsulation: ViewEncapsulation.None, // apply global styles to this component\n})\nexport class HeaderComponent {\n // public svgIconUrl = 'https://rawcdn.githack.com/CU-CommunityApps/cwd_base/734e40e6a6e21bf5cc8afff65096b452d864480e/images/cornell/bold_cornell_logo_simple_b31b1b.svg';\n @Input() title?: string;\n @Input() subtitle?: string;\n @Input() theme!: theme;\n @Input() logo!: logo;\n @Input() useGradient!: boolean;\n constructor() {\n this.theme = this.theme || 'cu-default';\n this.logo = this.logo || 'cu-seal';\n this.useGradient = this.useGradient || false;\n }\n\n getClasses(): string[] {\n const classes: string[] = [];\n if (this.theme) {\n classes.push(this.theme);\n }\n if (this.logo) {\n classes.push(this.logo);\n }\n if (this.useGradient) {\n classes.push('gradient');\n }\n return classes;\n }\n}\n","<div [ngClass]=\"getClasses()\">\n <header id=\"cu-header\">\n <ng-template [ngIf]=\"logo == 'cu-45'\">\n <div class=\"cu45-helper\"></div>\n </ng-template>\n <div class=\"container-fluid cu-brand\">\n <h1 class=\"cu-logo\">\n <a href=\"http://www.cornell.edu\">\n <!-- <img class=\"sr-only\" alt=\"Cornell University\" width=\"245\" [src]=\"svgIconUrl\" height=\"62\" /> -->\n <span class=\"sr-only\">Cornell University</span>\n </a>\n </h1>\n <div class=\"cu-unit\">\n <h2 *ngIf=\"title\">{{title}}</h2>\n <ng-content select=\"[unit-title]\"></ng-content>\n <h3 class=\"sans mat-h3\" *ngIf=\"subtitle\">{{subtitle}}</h3>\n </div>\n <ng-content></ng-content>\n </div>\n </header>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class HeaderModule { }\n","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'lib-main',\n template: `\n <div id=\"main-content\" class=\"band\">\n <main\n id=\"main\"\n [ngClass]=\"['container-fluid', 'aria-target', paddingClass]\"\n tabindex=\"-1\"\n >\n <ng-content></ng-content>\n </main>\n </div>\n `,\n styleUrls: ['./main.component.scss'],\n})\nexport class MainComponent {\n @Input() useTopPadding = true;\n paddingClass = 'padding-top';\n\n constructor() {\n if (!this.useTopPadding) {\n this.paddingClass = '';\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class MainModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-header-buttons',\n templateUrl: './header-buttons.component.html',\n styleUrls: ['./header-buttons.component.scss'],\n})\nexport class HeaderButtonsComponent {}\n","<div class=\"buttons\">\n <ng-content></ng-content>\n <!-- <button class=\"mobile-button\" id=\"mobile-nav\">Main Menu</button> -->\n <!-- <button class=\"mobile-button\" id=\"cu-search-button\">Toggle Search Form</button> -->\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class HeaderButtonsModule { }\n","import { Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'lib-main-footer',\n templateUrl: './main-footer.component.html',\n styleUrls: ['./main-footer.component.scss'],\n encapsulation: ViewEncapsulation.None, // apply global styles to this component\n})\nexport class MainFooterComponent {}\n","<div class=\"main-footer\">\n <div class=\"container-fluid sidebar-left\">\n <div class=\"row\">\n <div class=\"primary\">\n <ng-content select=\"[primary]\"></ng-content>\n </div>\n <div class=\"secondary\">\n <ng-content select=\"[secondary]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class MainFooterModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-primary-content',\n templateUrl: './primary-content.component.html',\n styleUrls: ['./primary-content.component.scss'],\n})\nexport class PrimaryContentComponent {}\n","<div role=\"article\" id=\"main-article\" class=\"primary\">\n <div class=\"row\">\n <ng-content></ng-content>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class PrimaryContentModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-secondary-content',\n templateUrl: './secondary-content.component.html',\n styleUrls: ['./secondary-content.component.scss'],\n})\nexport class SecondaryContentComponent {}\n","<div id=\"sidebar-top\" class=\"secondary\">\n <div id=\"sidebar-bottom\" role=\"complementary\">\n <ng-content></ng-content>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class SecondaryContentModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-utility-nav',\n templateUrl: './utility-nav.component.html',\n styleUrls: ['./utility-nav.component.scss'],\n})\nexport class UtilityNavComponent {}\n","<nav id=\"utility-navigation\" aria-label=\"Supplementary Navigation\">\n <ul class=\"list-menu links\">\n <li><a href=\"#\">Login</a></li>\n </ul>\n</nav>\n\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class UtilityNavModule { }\n","import { Component, Inject, OnInit } from '@angular/core';\nimport { Route, Routes } from '@angular/router';\nimport { MAT_DIALOG_DATA } from '@angular/material/dialog';\nimport { ActivatedRoute } from '@angular/router';\n\ninterface DialogData {\n routes?: Routes;\n}\n\n@Component({\n selector: 'lib-mobile-dialog',\n templateUrl: './mobile-dialog.component.html',\n styleUrls: ['./mobile-dialog.component.scss'],\n})\nexport class MobileDialogComponent implements OnInit {\n constructor(\n @Inject(MAT_DIALOG_DATA) public data: DialogData,\n private activeRouter: ActivatedRoute\n ) {}\n public routes?: Routes = this.data.routes;\n ngOnInit(): void {\n this.routes = this.data.routes?.filter(\n (route) => route.data && route.data['menu']\n );\n }\n\n // @todo do this in a more angular way.\n handleExpandClick(contentClass: string | undefined): void {\n // slide opn and close\n const content = document.querySelector(\n '.content.' + contentClass\n ) as HTMLElement;\n\n if (content) {\n if (content?.style.maxHeight) {\n content.style.maxHeight = '';\n } else {\n content.style.maxHeight = content?.scrollHeight + 'px';\n }\n }\n\n // toggle aria attributes\n const collapsible = document.querySelector('.collapsible.' + contentClass);\n if (collapsible) {\n // toggle aria expanded attribute\n if (collapsible.getAttribute('aria-expanded') === 'true') {\n collapsible.setAttribute('aria-expanded', 'false');\n } else {\n collapsible.setAttribute('aria-expanded', 'true');\n }\n }\n }\n\n handleFocus(contentClass: string | undefined): void {\n const content = document.querySelector(\n '.content.' + contentClass\n ) as HTMLElement;\n if (content) {\n content.style.maxHeight = content?.scrollHeight + 'px';\n }\n\n const collapsible = document.querySelector('.collapsible.' + contentClass);\n if (collapsible) {\n collapsible.setAttribute('aria-expanded', 'true');\n }\n }\n\n routeHasActiveChild(route: Route): string {\n const _activeChild = this.activeRouter.children.length;\n if (_activeChild != 0) {\n for (let i = 0; i < _activeChild; i++) {\n if (this.activeRouter.children[i].outlet === 'primary') {\n if (\n this.activeRouter.children[i].snapshot.url[0].path === route.path\n ) {\n return 'active-parent';\n }\n }\n }\n }\n return '';\n }\n}\n","<div\n mat-dialog-title\n class=\"drk-dialog\"\n>\n <h1 class=\"sr-only\">Mobile Menu</h1>\n <div mat-dialog-actions>\n <div *ngIf=\"data.routes\">\n <button\n mat-icon-button\n aria-label=\"home\"\n routerLink=\"/\"\n mat-dialog-close\n >\n <mat-icon>home</mat-icon>\n </button>\n </div>\n <div>\n <button\n mat-icon-button\n aria-label=\"close dialog\"\n mat-dialog-close\n >\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n</div>\n\n<div\n mat-dialog-content\n class=\"drk-dialog\"\n>\n <mat-nav-list>\n <ng-container *ngFor=\"let route of routes\">\n <ng-container *ngIf=\"!route.children; else parent \">\n <mat-list-item\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n >\n <a\n mat-button\n routerLink=\"{{route.path}}\"\n mat-dialog-close\n class=\"mat-button-link\"\n >\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n </a>\n </mat-list-item>\n </ng-container>\n\n <ng-template #parent>\n <mat-list-item\n [ngClass]=\"[routeHasActiveChild(route), 'parent']\"\n *ngIf=\"route.data && route.data['menu'] != 'hidden'\"\n >\n <button\n mat-button\n (click)=\"handleExpandClick(route.path)\"\n [ngClass]=\"['collapsible mat-button-expand', route.path]\"\n >\n <span class=\"flex justify-content-space-between\">\n <span>\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n </span>\n <span class=\"icon-wrapper flex-1\">\n <mat-icon>expand_more</mat-icon>\n </span>\n </span>\n\n </button>\n </mat-list-item>\n\n <div [ngClass]=\"['content', route.path]\">\n <ng-container *ngFor=\"let child of route.children\">\n <mat-list-item\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n >\n <a\n mat-button\n mat-dialog-close\n routerLink=\"{{route.path}}/{{child.path}}\"\n (focus)=\"handleFocus(route.path)\"\n >\n {{child.data && child.data['title'] ? child.data['title'] : child.path}}\n </a>\n </mat-list-item>\n </ng-container>\n </div>\n\n </ng-template>\n </ng-container>\n </mat-nav-list>\n</div>\n","import { RouterModule } from '@angular/router';\nimport { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { APP_BASE_HREF } from '@angular/common';\nimport { MatDialogModule } from '@angular/material/dialog';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\nimport { MatButtonModule } from '@angular/material/button';\n// import { CWD_BREAKPOINTS } from '../../../cu-ng-design-library.breakpoints';\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule,\n MatDialogModule,\n BrowserAnimationsModule,\n MatButtonModule,\n RouterModule,\n ],\n exports: [\n // MatDialogModule,\n // CommonModule,\n // BrowserAnimationsModule,\n MatButtonModule,\n // RouterModule,\n // CommonModule,\n ],\n providers: [{ provide: APP_BASE_HREF, useValue: '/' }],\n})\nexport class MobileDialogModule {}\n","import { Component, Input } from '@angular/core';\nimport { MatDialog } from '@angular/material/dialog';\nimport { Routes } from '@angular/router';\nimport { MobileDialogComponent } from '../mobile-dialog/mobile-dialog.component';\n\n@Component({\n selector: 'lib-mobile-menu',\n templateUrl: './mobile-menu.component.html',\n styleUrls: ['./mobile-menu.component.scss'],\n})\nexport class MobileMenuComponent {\n showFiller = false;\n @Input() routes!: Routes;\n constructor(public dialog: MatDialog) {}\n\n openDialog() {\n this.dialog.open(MobileDialogComponent, {\n backdropClass: 'mobile-dialog-backdrop',\n position: {\n top: '0',\n left: '0',\n },\n width: '100vw',\n maxWidth: '100vw',\n panelClass: 'mobile-dialog',\n data: {\n routes: this.routes,\n },\n });\n }\n}\n","<!-- <mat-drawer-container class=\"example-container\" autosize>\n <mat-drawer #drawer class=\"example-sidenav\" mode=\"side\">\n <p>Auto-resizing sidenav</p>\n <p *ngIf=\"showFiller\">Lorem, ipsum dolor sit amet consectetur.</p>\n <button (click)=\"showFiller = !showFiller\" mat-raised-button>\n Toggle extra text\n </button>\n </mat-drawer>\n\n <button mat-mini-fab color=\"primary\" aria-label=\"mobile menu\" (click)=\"drawer.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n\n</mat-drawer-container> -->\n\n<button\n mat-flat-button\n color=\"accent\"\n aria-label=\"mobile menu\"\n (click)=\"openDialog()\"\n>\n <mat-icon class=\"mobile-menu\">menu</mat-icon>\n</button>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { APP_BASE_HREF } from '@angular/common';\nimport { MatDialogModule } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\nimport { MatButtonModule } from '@angular/material/button';\nimport { RouterModule } from '@angular/router';\nimport { MatListModule } from '@angular/material/list';\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule,\n MatDialogModule,\n BrowserAnimationsModule,\n MatButtonModule,\n RouterModule,\n CommonModule,\n ],\n exports: [\n MatIconModule,\n MatDialogModule,\n BrowserAnimationsModule,\n MatButtonModule,\n RouterModule,\n MatListModule,\n ],\n providers: [{ provide: APP_BASE_HREF, useValue: '/' }],\n})\nexport class MobileMenuModule {}\n","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'lib-two-column',\n templateUrl: './two-column.component.html',\n styleUrls: ['./two-column.component.scss'],\n})\nexport class TwoColumnComponent {\n @Input() order = '1';\n}\n","<lib-main class=\"sidebar-tint\">\n <div\n tabindex=\"-1\"\n class=\"flex gap-6\"\n [ngClass]=\"order === '1' ? 'flex-row' : 'flex-row-reverse'\"\n >\n <lib-primary-content class=\"flex-2\">\n <ng-content select=\"[primary]\"></ng-content>\n </lib-primary-content>\n <lib-secondary-content class=\"flex-1\">\n <ng-content select=\"[secondary]\"></ng-content>\n </lib-secondary-content>\n </div>\n</lib-main>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n@NgModule({\n declarations: [],\n imports: [CommonModule],\n exports: [],\n})\nexport class TwoColumnModule {}\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-one-column',\n templateUrl: './one-column.component.html',\n styleUrls: ['./one-column.component.scss'],\n})\nexport class OneColumnComponent {}\n","<lib-main>\n <ng-content></ng-content>\n</lib-main>\n\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class OneColumnModule { }\n","// import { BREAKPOINT } from '@angular/flex-layout';\n\nexport const BREAKPOINT = [];\n// A standalone version of CWD Design Patterns\n// ---------------------------------------------------------------------------\n// Recommended breakpoints to match base theme:\n// @media (min-width: 321px) - above 3.5\" phones begins\n// @media xs-min (min-width: 480px)\n// @media ks-min (min-width: 624px)\n// @media sm-min (min-width: 768px) - tablet begins, sidebar begins\n// @media md-min (min-width: 992px) - desktop main navigation begins\n// @media ml-min (min-width: 1080px)\n// @media lg-min (min-width: 1200px)\n// @media xl-min (min-width: 1400px) - maximum content width begins\n// $screen-xs-min: 480px;\n// $screen-ks-min: 624px;\n// $screen-sm-min: 768px;\n// $screen-md-min: 992px;\n// $screen-ml-min: 1080px;\n// $screen-lg-min: 1200px;\n// $screen-xl-min: 1480px;\nexport const CWD_BREAKPOINTS = [\n {\n alias: 'xs',\n suffix: 'Xs',\n mediaQuery: 'screen and (min-width: 0px) and (max-width: 480px)',\n overlapping: false,\n priority: 1002,\n },\n {\n alias: 'sm',\n suffix: 'Sm',\n mediaQuery: 'screen and (min-width: 480px) and (max-width: 624px)',\n overlapping: false,\n priority: 1003,\n },\n {\n alias: 'md',\n suffix: 'Md',\n mediaQuery: 'screen and (min-width: 624px) and (max-width: 768px)',\n overlapping: false,\n priority: 1004,\n },\n {\n alias: 'lg',\n suffix: 'Lg',\n mediaQuery: 'screen and (min-width: 768px) and (max-width: 992px)',\n overlapping: false,\n priority: 1005,\n },\n {\n alias: 'xl',\n suffix: 'Xl',\n mediaQuery: 'screen and (min-width: 992px) and (max-width: 1200px)',\n overlapping: false,\n priority: 1006,\n },\n {\n alias: 'xxl',\n suffix: 'Xxl',\n mediaQuery: 'screen and (min-width: 1200px) and (max-width: 1400px)',\n overlapping: false,\n priority: 1007,\n },\n {\n alias: 'xxxl',\n suffix: 'Xxxl',\n mediaQuery: 'screen and (min-width: 1400px)',\n overlapping: false,\n priority: 1008,\n },\n];\n\nexport const CWD_BREAKPOINTS_SIZES = {\n xs: { max: 575 },\n sm: { min: 576, max: 767 },\n md: { min: 768, max: 991 },\n lg: { min: 992, max: 1199 },\n xl: { min: 1200 },\n};\n\nexport const CustomBreakPointsProvider = {\n provide: BREAKPOINT,\n useValue: [...CWD_BREAKPOINTS],\n multi: true,\n};\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-two-column-example',\n templateUrl: './two-column-example.component.html',\n styleUrls: ['./two-column-example.component.scss'],\n})\nexport class TwoColumnExampleComponent {}\n","<lib-two-column >\n <div primary>\n <h1>Two Column Example</h1>\n <p class=\"intro\">\n The two column layout contains two columns of content. The primary content is placed in the left column and the secondary content is placed in the right column.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eveniet\n dignissimos temporibus enim. Impedit,\n voluptatum\n error laborum, dolorem, nulla qui molestiae vitae fugiat adipisci eos\n asperiores nobis beatae voluptatibus\n commodi\n natus?\n </p>\n <h2>Sub Content</h2>\n <p>\n Lorem, ipsum dolor sit amet consectetur adipisicing elit. Qui\n consectetur voluptate quisquam architecto ducimus\n earum magni beatae tenetur repellat. Veniam atque vel deleniti\n voluptatem possimus accusamus quaerat modi eius\n vitae?\n Consequatur maiores fuga officiis placeat voluptatem provident non a\n quam possimus nihil beatae deserunt rem\n dolore nam, dolor deleniti nemo aspernatur in labore commodi sint,\n eius quo! Reiciendis, perferendis laborum.\n Blanditiis, animi possimus quia iste doloremque repudiandae eos\n voluptatum quam libero in tempora ad, facilis\n similique dolorum! Eveniet fuga assumenda ea dolore, aspernatur autem!\n Sit nulla saepe ullam qui id?\n Labore voluptatem ea aperiam repudiandae eum optio doloribus eveniet\n velit mollitia quisquam, consequuntur\n voluptatum minus itaque pariatur voluptatibus autem similique\n blanditiis atque esse illo aliquid recusandae!\n Fugit\n optio atque cum.\n Officia quod placeat tempora, temporibus ad exercitationem similique\n dicta ipsa dolores sunt distinctio, sit\n necessitatibus in. Perferendis harum porro quasi animi deleniti vel\n corrupti eligendi cumque debitis! Tenetur,\n eveniet possimus.\n </p>\n <h3>Example code usually used by a router component</h3>\n<pre>\n<code class=\"html\">\n <lib-two-column>\n <div primary>\n Primary Content...\n </div>\n <div secondary>\n Secondary Content...\n </div>\n </lib-two-column>\n</code>\n</pre>\n </div>\n\n <div secondary>\n <h2>Secondary Content</h2>\n <p>\n Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eveniet\n dignissimos temporibus enim. Impedit,\n voluptatum\n error laborum, dolorem, nulla qui molestiae vitae fugiat adipisci eos\n asperiores nobis beatae voluptatibus\n commodi\n natus?\n </p>\n </div>\n</lib-two-column>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class TwoColumnExampleModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-one-column-example',\n templateUrl: './one-column-example.component.html',\n styleUrls: ['./one-column-example.component.scss'],\n})\nexport class OneColumnExampleComponent {}\n","<lib-one-column>\n <h1>One Column Example</h1>\n <p class=\"intro\">\n This is a one column example.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eveniet dignissimos temporibus enim. Impedit, voluptatum\n error laborum, dolorem, nulla qui molestiae vitae fugiat adipisci eos asperiores nobis beatae voluptatibus commodi\n natus?\n </p>\n <h2>Sub Content</h2>\n <p>\n Lorem, ipsum dolor sit amet consectetur adipisicing elit. Qui consectetur voluptate quisquam architecto ducimus\n earum magni beatae tenetur repellat. Veniam atque vel deleniti voluptatem possimus accusamus quaerat modi eius\n vitae?\n Consequatur maiores fuga officiis placeat voluptatem provident non a quam possimus nihil beatae deserunt rem\n dolore nam, dolor deleniti nemo aspernatur in labore commodi sint, eius quo! Reiciendis, perferendis laborum.\n Blanditiis, animi possimus quia iste doloremque repudiandae eos voluptatum quam libero in tempora ad, facilis\n similique dolorum! Eveniet fuga assumenda ea dolore, aspernatur autem! Sit nulla saepe ullam qui id?\n Labore voluptatem ea aperiam repudiandae eum optio doloribus eveniet velit mollitia quisquam, consequuntur\n voluptatum minus itaque pariatur voluptatibus autem similique blanditiis atque esse illo aliquid recusandae! Fugit\n optio atque cum.\n Officia quod placeat tempora, temporibus ad exercitationem similique dicta ipsa dolores sunt distinctio, sit\n necessitatibus in. Perferendis harum porro quasi animi deleniti vel corrupti eligendi cumque debitis! Tenetur,\n eveniet possimus.\n </p>\n <h3>Example code usually used by a router component</h3>\n<pre>\n<code class=\"html\">\n <lib-one-column>\n Content...\n </lib-one-column>\n</code>\n</pre>\n\n </lib-one-column>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule\n ]\n})\nexport class OneColumnExampleModule { }\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n selector: 'lib-admin-toolbar',\n template: `\n <mat-toolbar color=\"primary\">\n <button\n mat-icon-button\n class=\"matero-toolbar-button\"\n *ngIf=\"showToggle\"\n (click)=\"toggleSidenav.emit()\"\n >\n <mat-icon>menu</mat-icon>\n </button>\n <span class=\"spacer\"></span>\n <ng-content></ng-content>\n </mat-toolbar>\n `,\n styleUrls: ['./admin-toolbar.component.scss'],\n})\nexport class AdminToolbarComponent {\n @Input() showToggle = true;\n @Output() toggleSidenav = new EventEmitter<void>();\n @Output() toggleSidenavNotice = new EventEmitter<void>();\n}\n","import { Component, Input, OnInit } from '@angular/core';\nimport { MatDrawerMode } from '@angular/material/sidenav';\nimport { Routes, Route, ActivatedRoute } from '@angular/router';\n\n@Component({\n selector: 'lib-side-menu',\n templateUrl: './side-menu.component.html',\n styleUrls: ['./side-menu.component.scss'],\n})\nexport class SideMenuComponent implements OnInit {\n @Input() routes!: Routes;\n @Input() title = 'Admin Toolbar';\n @Input() showToggle = true;\n @Input() svgIconUrl =\n 'https://cdn.jsdelivr.net/gh/CU-CommunityApps/cwd_base/images/cornell/bold_cornell_seal_simple_white.svg';\n @Input() imgHeight = '45px';\n @Input() mode: MatDrawerMode = 'side'; // 'over' | 'push' | 'side'\n @Input() opened = true;\n @Input() isMobileLayout = false;\n\n // options = {\n // autoCollapseOnClick: false,\n // autoCollapseOnHover: false,\n // sidenavCollapsed: false,\n // };\n\n constructor(\n // @Inject(MAT_DIALOG_DATA) public data: DialogData,\n private activeRouter: ActivatedRoute\n ) {\n this.showToggle = true;\n }\n\n ngOnInit(): void {\n // this.options.autoCollapseOnClick = this.isMobileLayout;\n if (this.isMobileLayout) {\n this.mode = 'over';\n this.opened = false;\n }\n }\n\n // @todo do this in a more angular way.\n handleExpandClick(contentClass: string | undefined): void {\n console.log('handleExpandClick', contentClass);\n // slide opn and close\n const content = document.querySelector(\n '.content.' + contentClass\n ) as HTMLElement;\n\n if (content) {\n if (content?.style.maxHeight) {\n content.style.maxHeight = '';\n } else {\n content.style.maxHeight = content?.scrollHeight + 'px';\n }\n }\n // toggle aria attributes\n const collapsible = document.querySelector('.collapsible.' + contentClass);\n if (collapsible) {\n // toggle aria expanded attribute\n if (collapsible.getAttribute('aria-expanded') !== 'true') {\n collapsible.setAttribute('aria-expanded', 'true');\n } else {\n collapsible.setAttribute('aria-expanded', 'false');\n }\n }\n }\n\n handleFocus(contentClass: string | undefined): void {\n console.log('handleFocus', contentClass);\n const content = document.querySelector(\n '.content.' + contentClass\n ) as HTMLElement;\n if (content) {\n content.style.maxHeight = content?.scrollHeight + 'px';\n }\n\n const collapsible = document.querySelector('.collapsible.' + contentClass);\n if (collapsible) {\n collapsible.setAttribute('aria-expanded', 'true');\n }\n }\n\n routeHasActiveChild(route: Route): string {\n const _activeChild = this.activeRouter.children.length;\n if (_activeChild != 0) {\n for (let i = 0; i < _activeChild; i++) {\n if (this.activeRouter.children[i].outlet === 'primary') {\n if (\n this.activeRouter.children[i].snapshot.url[0].path === route.path\n ) {\n return 'active-parent';\n }\n }\n }\n }\n return '';\n }\n\n handleLinkClick() {\n if (this.isMobileLayout) {\n this.handleToggleClick();\n }\n }\n\n handleToggleClick() {\n this.opened = !this.opened;\n }\n}\n","<mat-drawer-container>\n <mat-drawer\n #drawer\n [opened]=\"opened\"\n class=\"sidenav\"\n [mode]=\"mode\"\n autosize\n [ngClass]=\"{ 'mobile': isMobileLayout }\"\n >\n\n <mat-toolbar\n class=\"sidebar-logo\"\n color=\"primary\"\n >\n <a routerLink=\"/\">\n <img\n alt=\"Cornell University\"\n [src]=\"svgIconUrl\"\n height=\"{{imgHeight}}\"\n >\n {{title}}\n </a>\n </mat-toolbar>\n\n <mat-nav-list>\n <ng-container *ngFor=\"let route of routes\">\n <ng-container *ngIf=\"route.data && route.data['menu'] == 'admin'\">\n <a\n mat-list-item\n *ngIf=\"!route.children; else parent \"\n [routerLink]=\"route.path\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n (click)=\"handleLinkClick()\"\n >\n <span class=\"flex align-items-center\">\n <span>\n <mat-icon\n matListIcon\n *ngIf=\"route.data['icon']\"\n >\n {{route.data['icon']}}\n </mat-icon>\n </span>\n <span class=\"pl-1\">\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n </span>\n </span>\n\n </a>\n\n <ng-template #parent>\n <mat-list-item\n [ngClass]=\"routeHasActiveChild(route)\"\n [ngClass]=\"['collapsible', route.path]\"\n (click)=\"handleExpandClick(route.path)\"\n >\n <span class=\"flex align-items-center\">\n <span>\n <mat-icon\n matListIcon\n *ngIf=\"route.data['icon']\"\n >\n {{route.data['icon']}}\n </mat-icon>\n </span>\n <span class=\"pl-1\">\n {{route.data && route.data['title'] ? route.data['title'] : route.path}}\n </span>\n <span class=\"flex-grow\"></span>\n <span>\n <mat-icon class=\"expand-more\">expand_more</mat-icon>\n </span>\n </span>\n\n </mat-list-item>\n\n <div [ngClass]=\"['content', route.path]\">\n <ng-container *ngFor=\"let child of route.children\">\n <mat-list-item\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact: true}\"\n (click)=\"handleLinkClick()\"\n >\n <a\n routerLink=\"{{route.path}}/{{child.path}}\"\n (focus)=\"handleFocus(child.path)\"\n class=\"pad-left\"\n >\n <span>\n <mat-icon\n matListIcon\n *ngIf=\"child.data && child.data['icon']\"\n >\n {{ child.data['icon'] }}\n </mat-icon>\n </span>\n <span class=\"pl-1\">\n {{child.data && child.data['title'] ? child.data['title'] : child.path}}\n </span>\n </a>\n </mat-list-item>\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n </ng-container>\n\n </mat-nav-list>\n\n </mat-drawer>\n\n <mat-drawer-content>\n <lib-admin-toolbar\n (toggleSidenav)=\"handleToggleClick()\"\n (toggleSidenavNotice)=\"handleToggleClick()\"\n >\n <ng-content select=\"[toolbar]\"></ng-content>\n </lib-admin-toolbar>\n <ng-content></ng-content>\n </mat-drawer-content>\n</mat-drawer-container>\n","import { MatButtonModule } from '@angular/material/button';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\nimport { MatIconModule } from '@angular/material/icon';\nimport { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\nimport { APP_BASE_HREF } from '@angular/common';\nimport { MatMenuModule } from '@angular/material/menu';\nimport { MatSidenavModule } from '@angular/material/sidenav';\nimport { MatListModule } from '@angular/material/list';\n\n@NgModule({\n declarations: [],\n imports: [\n CommonModule,\n RouterModule,\n MatMenuModule,\n MatIconModule,\n MatButtonModule,\n MatSidenavModule,\n MatListModule,\n ],\n exports: [\n RouterModule,\n CommonModule,\n MatMenuModule,\n MatIconModule,\n BrowserAnimationsModule,\n MatButtonModule,\n MatSidenavModule,\n MatListModule,\n ],\n providers: [{ provide: APP_BASE_HREF, useValue: '/' }],\n})\nexport class SideMenuModule {}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\nimport { APP_BASE_HREF } from '@angular/common';\nimport { MatToolbarModule } from '@angular/material/toolbar';\n\n@NgModule({\n declarations: [],\n imports: [CommonModule],\n exports: [RouterModule, CommonModule, MatToolbarModule],\n providers: [{ provide: APP_BASE_HREF, useValue: '/' }],\n})\nexport class AdminToolbarModule {}\n","import { Component, Input, OnInit } from '@angular/core';\nimport { MatDrawerMode } from '@angular/material/sidenav';\nimport { Routes } from '@angular/router';\n\n@Component({\n selector: 'lib-admin-layout',\n template: `\n <lib-side-menu\n [routes]=\"routes\"\n [title]=\"toolbarTitle\"\n [svgIconUrl]=\"svgIconUrl\"\n [imgHeight]=\"imgHeight\"\n [showToggle]=\"true\"\n [mode]=\"mode\"\n [opened]=\"opened\"\n [isMobileLayout]=\"isMobileLayout\"\n >\n <ng-content ngProjectAs=\"[toolbar]\"></ng-content>\n <router-outlet></router-outlet>\n </lib-side-menu>\n `,\n styles: [\n `\n :host {\n display: block;\n }\n `,\n ],\n})\nexport class AdminLayoutComponent implements OnInit {\n @Input() routes!: Routes;\n @Input() toolbarTitle = 'SSIT';\n @Input() svgIconUrl =\n 'https://cdn.jsdelivr.net/gh/CU-CommunityApps/cwd_base/images/cornell/bold_cornell_seal_simple_white.svg';\n @Input() imgHeight = '45px';\n @Input() mode: MatDrawerMode = 'side'; // 'over' | 'push' | 'side'\n @Input() opened = true;\n @Input() isMobileLayout = false;\n\n ngOnInit(): void {\n if (this.isMobileLayout) {\n this.mode = 'over';\n this.opened = false;\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n\n\n@Ng