File

src/app/modules/metadata/help/metadata-help.component.ts

Description

Metadata for help overlay content

Metadata

import { ChangeDetectionStrategy, Component } from '@angular/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { HraCommonModule } from '@hra-ui/common';
import { ButtonsModule } from '@hra-ui/design-system/buttons';

/** Metadata for help overlay content */
@Component({
  selector: 'ccf-metadata-help',
  imports: [HraCommonModule, MatDividerModule, MatIconModule, MatMenuModule, ButtonsModule],
  templateUrl: './metadata-help.component.html',
  styleUrl: './metadata-help.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class MetadataHelpComponent {}
<hra-help-button [action]="help" />

<mat-menu hraFeature="menu" class="metadata-help" backdropClass="metadata-help-backdrop" #help="matMenu">
  <a
    hraFeature="watch-video"
    hraClickEvent
    mat-menu-item
    href="https://youtu.be/18imQj068Iw"
    target="_blank"
    rel="noopener noreferrer"
  >
    Watch video tutorial
  </a>
  <a
    hraFeature="app-guide"
    hraClickEvent
    mat-menu-item
    href="https://humanatlas.io/registration-user-interface"
    target="_blank"
    rel="noopener noreferrer"
  >
    App guide & documentation
  </a>
  <a
    hraFeature="sop"
    hraClickEvent
    mat-menu-item
    href="https://doi.org/10.5281/zenodo.5575776"
    target="_blank"
    rel="noopener noreferrer"
  >
    Use standard operating procedure
  </a>

  <mat-divider class="menu-divider" />

  <a
    hraFeature="explore-registrations"
    hraClickEvent
    mat-menu-item
    href="https://apps.humanatlas.io/eui/"
    target="_blank"
    rel="noopener noreferrer"
  >
    Explore all registrations
  </a>
</mat-menu>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""