framadate-responsive/src/app/app.component.html

<header style="text-align:center">
    <a
        [routerLink]="'home'"
        class="home_link"
        aria-roledescription="home"
    >
        <h1>
            <span class="logo_first">Frama</span>
            <span class="logo_second">date</span>
        </h1>
        <div class="legend">proposé par
            <span class="legend_first">Frama</span>
            <span class="legend_second">soft</span>
        </div>
    </a>
    <div id="translate_example">
        <div class="wrapper">
            <img
                src="assets/img/icone-langue.svg"
                alt="location icon"
                (click)="changeLanguage()"
                class="lang_icon clickable"
            >
            <img
                (click)="toggleMenu()"
                alt="menu icon"
                class="menu_icon  clickable"
                src="assets/img/icone-menu.svg"
            >
            <select
                name="language"
                class="Language-"
                (change)="switchLanguage(currentLang)"
                [(ngModel)]="currentLang"
            >
                <option
                    value="d"
                    default
                    class="select_language"
                >{{"Language" | translate}}</option>
                <option value="en">English</option>
                <option value="fr">Français</option>
            </select>
            <span (click)="toggleMenu()" class="menu_label">Menu</span>
        </div>

    </div>

</header>
<framadate-navigation *ngIf="menuVisible" [step]="step"></framadate-navigation>
<main>
    <router-outlet></router-outlet>
</main>
<framadate-debugger></framadate-debugger>
<p-toast position="top-right"></p-toast>