38 lines
1.1 KiB
HTML
38 lines
1.1 KiB
HTML
<main class="container">
|
|
<form class="row" (submit)="greet($event, greetInput.value)">
|
|
<input #greetInput id="greet-input" placeholder="Enter a name..." />
|
|
<button type="submit">Greet</button>
|
|
</form>
|
|
|
|
<p>{{ greetingMessage }}</p>
|
|
|
|
<!-- Layout Switcher -->
|
|
<div class="layout-controls">
|
|
<button (click)="switchLayout()" class="layout-button">
|
|
Switch Layout: {{ currentLayout.toUpperCase() }}
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Conditional Rendering basierend auf currentLayout -->
|
|
<app-qwerty-keyboard
|
|
*ngIf="currentLayout === 'qwerty'"
|
|
[shiftActive]="shiftActive"
|
|
(keyPressed)="handleKeyPress($event)"
|
|
(shiftToggled)="toggleShift()">
|
|
</app-qwerty-keyboard>
|
|
|
|
<app-dvorak-keyboard
|
|
*ngIf="currentLayout === 'dvorak'"
|
|
[shiftActive]="shiftActive"
|
|
(keyPressed)="handleKeyPress($event)"
|
|
(shiftToggled)="toggleShift()">
|
|
</app-dvorak-keyboard>
|
|
|
|
<app-circle-keyboard
|
|
*ngIf="currentLayout === 'circle'"
|
|
[shiftActive]="shiftActive"
|
|
(keyPressed)="handleKeyPress($event)"
|
|
(shiftToggled)="toggleShift()">
|
|
</app-circle-keyboard>
|
|
</main>
|