From 09cb9c88aeeee66a6c5e435b451c1e1b22d1cf63 Mon Sep 17 00:00:00 2001
From: Andre Beging <a.beging@eas-solutions.de>
Date: Thu, 14 Nov 2024 20:52:52 +0100
Subject: [PATCH] Settings Page Styling

---
 Server/Components/Pages/SettingsPage.razor | 143 ++++++++++++---------
 1 file changed, 81 insertions(+), 62 deletions(-)

diff --git a/Server/Components/Pages/SettingsPage.razor b/Server/Components/Pages/SettingsPage.razor
index 333ff15..0f5ebd0 100644
--- a/Server/Components/Pages/SettingsPage.razor
+++ b/Server/Components/Pages/SettingsPage.razor
@@ -1,79 +1,98 @@
 @page "/settings"
 @using Server.Data
-@using Server.Model
 @rendermode InteractiveServer
 
 <h3>Einstellungen</h3>
 
 <button type="button" class="btn btn-primary" @onclick="Save"><i class="fas fa-save"></i> Speichern</button>
 
-<hr />
+<div class="row">
+  <div class="col-md-6 col-xl-4 col-xxl-3">
+    <hr/>
+    <h4><i class="fas fa-address-card"></i> Adressdaten</h4>
+    <div class="mb-3">
+      <label class="form-label">Name</label>
+      <InputText DisplayName="Name" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.Name"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Name</label>
-  <InputText DisplayName="Name" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Name"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">Name 2</label>
+      <InputText DisplayName="Name 2" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.Name2"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Name 2</label>
-  <InputText DisplayName="Name 2" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Name2"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">Straße</label>
+      <InputText DisplayName="Straße" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.Street"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Street</label>
-  <InputText DisplayName="Street" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Street"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">PLZ</label>
+      <InputText DisplayName="PLZ" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.Zip"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Zip</label>
-  <InputText DisplayName="Zip" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Zip"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">Stadt</label>
+      <InputText DisplayName="Stadt" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.City"></InputText>
+    </div>
+  </div>
+  <div class="col-md-6 col-xl-4 col-xxl-3">
+    <hr/>
+    <h4><i class="fas fa-money-bill-alt"></i> Bankverbindung</h4>
+    <div class="mb-3">
+      <label class="form-label">Name der Bank</label>
+      <InputText DisplayName="Name der Bank" class="form-control"
+                 @bind-Value="@SettingsData.Instance.PaymentData.BankName"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">City</label>
-  <InputText DisplayName="City" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.City"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">IBAN</label>
+      <InputText DisplayName="IBAN" class="form-control"
+                 @bind-Value="@SettingsData.Instance.PaymentData.Iban"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Phone</label>
-  <InputText DisplayName="Phone" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Phone"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">BIC</label>
+      <InputText DisplayName="BIC" class="form-control"
+                 @bind-Value="@SettingsData.Instance.PaymentData.Bic"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Web</label>
-  <InputText DisplayName="Web" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Web"></InputText>
-</div>
+  </div>
+  <div class="col-md-6 col-xl-4 col-xxl-3">
+    <hr/>
+    <h4><i class="fas fa-mobile-alt"></i> Kontaktdaten</h4>
+    <div class="mb-3">
+      <label class="form-label">Telefon</label>
+      <InputText DisplayName="Telefon" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.Phone"></InputText>
+    </div>
 
-<hr />
+    <div class="mb-3">
+      <label class="form-label">Web</label>
+      <InputText DisplayName="Web" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.Web"></InputText>
+    </div>
 
-<div class="mb-3">
-  <label class="form-label">Comment</label>
-  <InputTextArea DisplayName="Comment" class="form-control" @bind-Value="@SettingsData.Instance.Comment"></InputTextArea>
-</div>
-
-<hr />
-
-<div class="mb-3">
-  <label class="form-label">TaxId</label>
-  <InputText DisplayName="TaxId" class="form-control" @bind-Value="@SettingsData.Instance.SellerAddress.TaxId"></InputText>
-</div>
-
-<div class="mb-3">
-  <label class="form-label">Bank</label>
-  <InputText DisplayName="Bank" class="form-control" @bind-Value="@SettingsData.Instance.PaymentData.BankName"></InputText>
-</div>
-
-<div class="mb-3">
-  <label class="form-label">IBAN</label>
-  <InputText DisplayName="IBAN" class="form-control" @bind-Value="@SettingsData.Instance.PaymentData.Iban"></InputText>
-</div>
-
-<div class="mb-3">
-  <label class="form-label">BIC</label>
-  <InputText DisplayName="BIC" class="form-control" @bind-Value="@SettingsData.Instance.PaymentData.Bic"></InputText>
-</div>
-
-<div class="mb-3">
-  <label class="form-label">Logo Pfad</label>
-  <InputText class="form-control" @bind-Value="@SettingsData.Instance.Logo"></InputText>
-</div>
+    <div class="mb-3">
+      <label class="form-label">Steuernummer</label>
+      <InputText DisplayName="Steuernummer" class="form-control"
+                 @bind-Value="@SettingsData.Instance.SellerAddress.TaxId"></InputText>
+    </div>
+  </div>
+  <div class="col-md-6 col-xl-4 col-xxl-3">
+    <hr/>
+    <h4><i class="fas fa-palette"></i> Personalisierung</h4>
+    <div class="mb-3">
+      <label class="form-label">Kommentar</label>
+      <InputTextArea DisplayName="Kommentar" class="form-control" rows="3"
+                     @bind-Value="@SettingsData.Instance.Comment"></InputTextArea>
+    </div>
+    <div class="mb-3">
+      <label class="form-label">Logo Pfad</label>
+      <InputText class="form-control" @bind-Value="@SettingsData.Instance.Logo"></InputText>
+    </div>
+  </div>
+</div>
\ No newline at end of file