From 9636bd222bceaaa8962dd59210b78fb02f068e9b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patrick=20Ha=C3=9Fel?= <git@patrick-hassel.de>
Date: Wed, 6 Nov 2024 15:08:37 +0100
Subject: [PATCH] PasswordTileComponent is a Tile now

---
 .../pages/group/group/group.component.html    | 11 +---
 .../app/pages/group/group/group.component.ts  |  4 +-
 .../pages/tools/numbers/numbers.component.ts  |  4 +-
 .../password-tile.component.html              | 13 +++++
 .../password-tile.component.less              |  1 +
 .../password-tile.component.ts}               |  8 +--
 .../shared/password/password.component.html   |  7 ---
 .../shared/password/password.component.less   |  0
 src/main/angular/src/common.less              |  1 -
 src/main/angular/src/styles.less              | 51 +++++++++++++++++
 src/main/angular/src/tile.less                | 56 -------------------
 11 files changed, 74 insertions(+), 82 deletions(-)
 create mode 100644 src/main/angular/src/app/shared/password-tile/password-tile.component.html
 create mode 100644 src/main/angular/src/app/shared/password-tile/password-tile.component.less
 rename src/main/angular/src/app/shared/{password/password.component.ts => password-tile/password-tile.component.ts} (70%)
 delete mode 100644 src/main/angular/src/app/shared/password/password.component.html
 delete mode 100644 src/main/angular/src/app/shared/password/password.component.less
 delete mode 100644 src/main/angular/src/tile.less

diff --git a/src/main/angular/src/app/pages/group/group/group.component.html b/src/main/angular/src/app/pages/group/group/group.component.html
index e61b43f..0fb1255 100644
--- a/src/main/angular/src/app/pages/group/group/group.component.html
+++ b/src/main/angular/src/app/pages/group/group/group.component.html
@@ -1,15 +1,6 @@
 <div class="tileContainer">
 
-  <div class="tile" *ngIf="group === null && granted === false">
-    <div class="tileInner">
-      <div class="tileTitle">
-        Passwort
-      </div>
-    </div>
-    <div class="tileContent">
-      <app-password [visible]="true" (join)="join($event)"></app-password>
-    </div>
-  </div>
+  <app-password-tile [visible]="group === null && granted === false" (join)="join($event)"></app-password-tile>
 
   <ng-container *ngIf="group">
 
diff --git a/src/main/angular/src/app/pages/group/group/group.component.ts b/src/main/angular/src/app/pages/group/group/group.component.ts
index 59887b8..ec6368a 100644
--- a/src/main/angular/src/app/pages/group/group/group.component.ts
+++ b/src/main/angular/src/app/pages/group/group/group.component.ts
@@ -7,7 +7,7 @@ import {GroupService} from "../../../api/group/group.service";
 import {UserService} from "../../../api/User/user.service";
 import {Group} from "../../../api/group/Group";
 import {NumbersService} from "../../../api/tools/Numbers/numbers.service";
-import {PasswordComponent} from "../../../shared/password/password.component";
+import {PasswordTileComponent} from "../../../shared/password-tile/password-tile.component";
 import {Numbers} from "../../../api/tools/Numbers/Numbers";
 import {Page} from "../../../api/common/Page";
 import {RelativePipe} from "../../../shared/relative.pipe";
@@ -26,7 +26,7 @@ import {UserPublic} from "../../../api/User/UserPublic";
     ReactiveFormsModule,
     TextComponent,
     FormsModule,
-    PasswordComponent,
+    PasswordTileComponent,
     RelativePipe
   ],
   templateUrl: './group.component.html',
diff --git a/src/main/angular/src/app/pages/tools/numbers/numbers.component.ts b/src/main/angular/src/app/pages/tools/numbers/numbers.component.ts
index fc18bfc..33fc653 100644
--- a/src/main/angular/src/app/pages/tools/numbers/numbers.component.ts
+++ b/src/main/angular/src/app/pages/tools/numbers/numbers.component.ts
@@ -4,7 +4,7 @@ import {ActivatedRoute} from "@angular/router";
 import {NumbersService} from "../../../api/tools/Numbers/numbers.service";
 import {NgIf} from "@angular/common";
 import {FormsModule} from "@angular/forms";
-import {PasswordComponent} from "../../../shared/password/password.component";
+import {PasswordTileComponent} from "../../../shared/password-tile/password-tile.component";
 import {GroupService} from "../../../api/group/group.service";
 import {UserService} from "../../../api/User/user.service";
 import {RelativePipe} from "../../../shared/relative.pipe";
@@ -16,7 +16,7 @@ import {Subscription, timer} from "rxjs";
   imports: [
     NgIf,
     FormsModule,
-    PasswordComponent,
+    PasswordTileComponent,
     RelativePipe
   ],
   templateUrl: './numbers.component.html',
diff --git a/src/main/angular/src/app/shared/password-tile/password-tile.component.html b/src/main/angular/src/app/shared/password-tile/password-tile.component.html
new file mode 100644
index 0000000..37ef064
--- /dev/null
+++ b/src/main/angular/src/app/shared/password-tile/password-tile.component.html
@@ -0,0 +1,13 @@
+<div class="tile" *ngIf="visible">
+  <div class="tileInner" *ngIf="visible">
+    <div class="tileTitle">
+      Gruppenpasswort
+    </div>
+    <div class="tileContent">
+      <input type="text" [(ngModel)]="password" (keydown.enter)="join.emit(password)">
+      <div class="buttons">
+        <div class="button buttonRight buttonJoin" (click)="join.emit(password)">Beitreten</div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/src/main/angular/src/app/shared/password-tile/password-tile.component.less b/src/main/angular/src/app/shared/password-tile/password-tile.component.less
new file mode 100644
index 0000000..66c29f3
--- /dev/null
+++ b/src/main/angular/src/app/shared/password-tile/password-tile.component.less
@@ -0,0 +1 @@
+@import "../../../common";
diff --git a/src/main/angular/src/app/shared/password/password.component.ts b/src/main/angular/src/app/shared/password-tile/password-tile.component.ts
similarity index 70%
rename from src/main/angular/src/app/shared/password/password.component.ts
rename to src/main/angular/src/app/shared/password-tile/password-tile.component.ts
index 2d2f3bb..20cf426 100644
--- a/src/main/angular/src/app/shared/password/password.component.ts
+++ b/src/main/angular/src/app/shared/password-tile/password-tile.component.ts
@@ -3,16 +3,16 @@ import {FormsModule} from "@angular/forms";
 import {NgIf} from "@angular/common";
 
 @Component({
-  selector: 'app-password',
+  selector: 'app-password-tile',
   standalone: true,
   imports: [
     FormsModule,
     NgIf
   ],
-  templateUrl: './password.component.html',
-  styleUrl: './password.component.less'
+  templateUrl: './password-tile.component.html',
+  styleUrl: './password-tile.component.less'
 })
-export class PasswordComponent implements OnInit {
+export class PasswordTileComponent implements OnInit {
 
   @Input()
   visible: boolean = false;
diff --git a/src/main/angular/src/app/shared/password/password.component.html b/src/main/angular/src/app/shared/password/password.component.html
deleted file mode 100644
index 6c7f814..0000000
--- a/src/main/angular/src/app/shared/password/password.component.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<ng-container *ngIf="visible">
-  <h1>Passwort</h1>
-  <input type="text" [(ngModel)]="password" (keydown.enter)="join.emit(password)">
-  <div class="buttons">
-    <div class="button buttonRight buttonJoin" (click)="join.emit(password)">Beitreten</div>
-  </div>
-</ng-container>
diff --git a/src/main/angular/src/app/shared/password/password.component.less b/src/main/angular/src/app/shared/password/password.component.less
deleted file mode 100644
index e69de29..0000000
diff --git a/src/main/angular/src/common.less b/src/main/angular/src/common.less
index 948b194..d00bede 100644
--- a/src/main/angular/src/common.less
+++ b/src/main/angular/src/common.less
@@ -1,4 +1,3 @@
-@import "./tile.less";
 @import "./user.less";
 
 .buttons {
diff --git a/src/main/angular/src/styles.less b/src/main/angular/src/styles.less
index 4ecb2e4..4c67da1 100644
--- a/src/main/angular/src/styles.less
+++ b/src/main/angular/src/styles.less
@@ -29,10 +29,61 @@ table {
   border-collapse: collapse;
 }
 
+.tileContainer {
+  padding: @halfSpace;
+
+  .tile {
+    width: 100%;
+    padding: @halfSpace;
+
+    .tileInner {
+      border: 1px solid #ddd;
+      border-radius: @space;
+      background-color: #fbfbfb;
+
+      .tileTitle {
+        font-weight: bold;
+        padding: @halfSpace @space;
+        background-color: lightskyblue;
+      }
+
+      .tileContent {
+        padding: @halfSpace;
+
+        table {
+          width: 100%;
+        }
+
+        td {
+          white-space: nowrap;
+          border: 0.2em solid white;
+        }
+
+      }
+
+      .tileFooter {
+        padding: @halfSpace @space;
+      }
+
+    }
+
+  }
+
+}
+
 @media (min-width: 1000px) {
 
   body {
     font-size: 18px;
   }
 
+  .tileContainer {
+
+    .tile {
+      float: left;
+      width: 500px;
+    }
+
+  }
+
 }
diff --git a/src/main/angular/src/tile.less b/src/main/angular/src/tile.less
deleted file mode 100644
index c89a745..0000000
--- a/src/main/angular/src/tile.less
+++ /dev/null
@@ -1,56 +0,0 @@
-@import "./config.less";
-
-.tileContainer {
-  padding: @halfSpace;
-
-  .tile {
-    width: 100%;
-    padding: @halfSpace;
-
-    .tileInner {
-      border: 1px solid #ddd;
-      border-radius: @space;
-      background-color: #fbfbfb;
-
-      .tileTitle {
-        font-weight: bold;
-        padding: @halfSpace @space;
-        background-color: lightskyblue;
-      }
-
-      .tileContent {
-        padding: @halfSpace;
-
-        table {
-          width: 100%;
-        }
-
-        td {
-          white-space: nowrap;
-          border: 0.2em solid white;
-        }
-
-      }
-
-      .tileFooter {
-        padding: @halfSpace @space;
-      }
-
-    }
-
-  }
-
-}
-
-@media (min-width: 1000px) {
-
-  .tileContainer {
-
-    .tile {
-      float: left;
-      width: 500px;
-    }
-
-  }
-
-}