v1.2.0 - terug knop toegevoegd en volgorde antwoorden op juiste manier neergezet

This commit is contained in:
Mel M. van Veen
2024-12-02 10:33:57 +01:00
parent 3a56271e1a
commit efe8a6a6f5
5 changed files with 28 additions and 11 deletions

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "wiv", "name": "wiv",
"version": "1.1.2", "version": "1.2.0",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "wiv", "name": "wiv",
"version": "1.1.2", "version": "1.2.0",
"dependencies": { "dependencies": {
"@angular/animations": "^19.0.0", "@angular/animations": "^19.0.0",
"@angular/cdk": "^19.0.0", "@angular/cdk": "^19.0.0",

View File

@@ -1,6 +1,6 @@
{ {
"name": "wiv", "name": "wiv",
"version": "1.1.2", "version": "1.2.0",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve", "start": "ng serve",

View File

@@ -106,6 +106,10 @@
background-color: #c0e4ff; background-color: #c0e4ff;
} }
a{
cursor: pointer;
}
/* Voor kleine schermen zoals de iPhone (max-width: 600px) */ /* Voor kleine schermen zoals de iPhone (max-width: 600px) */
@media (max-width: 600px) { @media (max-width: 600px) {
.game-container { .game-container {
@@ -135,3 +139,7 @@
border-radius: 5px; border-radius: 5px;
cursor: pointer; cursor: pointer;
} }
.backButton {
float: left;
}

View File

@@ -20,6 +20,9 @@
</div> </div>
<div class="game-container" *ngIf="currentQuestion.type == 1 && !confirmed"> <div class="game-container" *ngIf="currentQuestion.type == 1 && !confirmed">
<div class="backButton">
<a (click)="currentQuestion.type = 0">← Vorige</a>
</div>
<div class="question"> <div class="question">
<p>Vraag {{ localStorage.getItem('question') }}</p> <p>Vraag {{ localStorage.getItem('question') }}</p>
</div> </div>
@@ -42,6 +45,9 @@
</div> </div>
<div class="game-container" *ngIf="currentQuestion.type == 2 && !confirmed"> <div class="game-container" *ngIf="currentQuestion.type == 2 && !confirmed">
<div class="backButton">
<a (click)="currentQuestion.type = 0">← Vorige</a>
</div>
<div class="question"> <div class="question">
<p>Vraag {{ localStorage.getItem('question') }}</p> <p>Vraag {{ localStorage.getItem('question') }}</p>
</div> </div>
@@ -52,7 +58,7 @@
cdkDrag cdkDrag
[cdkDragData]="item" [cdkDragData]="item"
class="draggable-button"> class="draggable-button">
{{ item.position }} {{ item.label }}
</div> </div>
</div> </div>
@@ -71,6 +77,9 @@
</div> </div>
<div class="game-container" *ngIf="currentQuestion.type == 3 && !confirmed"> <div class="game-container" *ngIf="currentQuestion.type == 3 && !confirmed">
<div class="backButton">
<a (click)="currentQuestion.type = 0">← Vorige</a>
</div>
<div class="question"> <div class="question">
<p>Vraag {{ localStorage.getItem('question') }}</p> <p>Vraag {{ localStorage.getItem('question') }}</p>
</div> </div>
@@ -126,7 +135,7 @@
cdkDrag cdkDrag
[cdkDragData]="item" [cdkDragData]="item"
class="draggable-button"> class="draggable-button">
{{ item.position }} {{ item.label }}
</div> </div>
</div> </div>

View File

@@ -48,16 +48,16 @@ export class GameComponent implements OnInit {
// Linkerkolom knoppen (1, 2, 3) // Linkerkolom knoppen (1, 2, 3)
leftButtons: Button[] = [ leftButtons: Button[] = [
{position: 1}, {label: 'A'},
{position: 2}, {label: 'B'},
{position: 3} {label: 'C'}
]; ];
// Rechterkolom knoppen (A, B, C) // Rechterkolom knoppen (A, B, C)
rightButtons: Button[] = [ rightButtons: Button[] = [
{label: 'A'}, {label: '1'},
{label: 'B'}, {label: '2'},
{label: 'C'} {label: '3'},
]; ];
onDrop(event: CdkDragDrop<Button[]>) { onDrop(event: CdkDragDrop<Button[]>) {