From 1eaef04a12483beec02a2a1d1ff4324f92ab923d Mon Sep 17 00:00:00 2001
From: Sarah Faey <s.ruspekhofer@gmail.com>
Date: Sun, 11 Dec 2022 11:55:56 +0100
Subject: [PATCH] changed Checkboxes for BuildList

---
 Lieb/Pages/GuildWars2/BuildList.razor     |  63 ++++++++++++++++++----
 Lieb/Pages/GuildWars2/BuildList.razor.css |  46 ++++++++++++++++
 Lieb/wwwroot/dark-check-green.png         | Bin 0 -> 3195 bytes
 3 files changed, 98 insertions(+), 11 deletions(-)
 create mode 100644 Lieb/wwwroot/dark-check-green.png

diff --git a/Lieb/Pages/GuildWars2/BuildList.razor b/Lieb/Pages/GuildWars2/BuildList.razor
index 3723704..9ecf525 100644
--- a/Lieb/Pages/GuildWars2/BuildList.razor
+++ b/Lieb/Pages/GuildWars2/BuildList.razor
@@ -66,8 +66,22 @@
         <tr>
             @if (_account != null)
             {
-                <td class="checkboxfield"><input type="checkbox" checked="@isEquipped" disabled="@(!_allowEdit)" @onchange="args => EquippedStatusChanged(build.GuildWars2BuildId, args)" /></td>
-                <td class="checkboxfield"><input type="checkbox" checked="@canTank" disabled="@(!isEquipped || !_allowEdit)" @onchange="args => TankingStatusChanged(build.GuildWars2BuildId, args)" /></td>
+                if(_allowEdit)
+                {
+                    <td class="checkboxfield"><input type="checkbox" checked="@isEquipped" disabled="@(!_allowEdit)" @onchange="args => EquippedStatusChanged(build.GuildWars2BuildId, args)" /></td>
+                    <td class="checkboxfield"><input type="checkbox" checked="@canTank" disabled="@(!isEquipped || !_allowEdit)" @onchange="args => TankingStatusChanged(build.GuildWars2BuildId, args)" /></td>
+                }
+                else
+                {
+                    <td class="checkboxfield">
+                        <input type="checkbox" checked="@isEquipped" id="@build.GuildWars2BuildId-Equipped" class="css-checkbox dark-check-green" disabled="@(!_allowEdit)"/>
+                        <label for="@build.GuildWars2BuildId-Equipped" class="css-label dark-check-green"></label>
+                    </td>
+                    <td class="checkboxfield">
+                        <input type="checkbox" checked="@canTank" id="@build.GuildWars2BuildId-Tank" class="css-checkbox dark-check-green" disabled="@(!isEquipped || !_allowEdit)"/>
+                        <label for="@build.GuildWars2BuildId-Tank" class="css-label dark-check-green"></label>
+                    </td>
+                }
             }
             <AuthorizeView Policy="@Constants.Roles.Admin.Name">
                 <Authorized>
@@ -84,15 +98,42 @@
             </AuthorizeView>
             <td>@build.Class.ToString()</td>
             <td>@build.EliteSpecialization.ToString()</td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.Might)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.Quickness)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.Alacrity)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.DamageType == DamageType.Heal)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.DamageType == DamageType.Power)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.DamageType == DamageType.Condition)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.DamageType == DamageType.Hybrid)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.DamageType == DamageType.Other)" disabled="disabled" /></td>
-            <td class="checkboxfield"><input type="checkbox" checked="@(build.UseInRandomRaid)" disabled="disabled" /></td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.Might)" id="@build.GuildWars2BuildId-Might" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Might" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.Quickness)" id="@build.GuildWars2BuildId-Quickness" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Quickness" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.Alacrity)" id="@build.GuildWars2BuildId-Alacrity" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Alacrity" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.DamageType == DamageType.Heal)" id="@build.GuildWars2BuildId-Heal" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Heal" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.DamageType == DamageType.Power)" id="@build.GuildWars2BuildId-Power" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Power" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.DamageType == DamageType.Condition)" id="@build.GuildWars2BuildId-Condition" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Condition" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.DamageType == DamageType.Hybrid)" id="@build.GuildWars2BuildId-Hybrid" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Hybrid" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.DamageType == DamageType.Other)" id="@build.GuildWars2BuildId-Other" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-Other" class="css-label dark-check-green"></label>
+            </td>
+            <td class="checkboxfield">
+                <input type="checkbox" checked="@(build.UseInRandomRaid)" id="@build.GuildWars2BuildId-UseInRandomRaid" class="css-checkbox dark-check-green" disabled="disabled" />
+                <label for="@build.GuildWars2BuildId-UseInRandomRaid" class="css-label dark-check-green"></label>
+            </td>
             @if(string.IsNullOrEmpty(build.SourceLink))
             {
                 <td>@build.Source</td>
diff --git a/Lieb/Pages/GuildWars2/BuildList.razor.css b/Lieb/Pages/GuildWars2/BuildList.razor.css
index 5a9d4c6..5064aa0 100644
--- a/Lieb/Pages/GuildWars2/BuildList.razor.css
+++ b/Lieb/Pages/GuildWars2/BuildList.razor.css
@@ -21,3 +21,49 @@
     padding-left: 8px;
     padding-right: 8px;
 }
+
+/*checkboxes*/
+label {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+    
+input[type=checkbox].css-checkbox {
+    position: absolute; 
+    overflow: hidden; 
+    clip: rect(0 0 0 0); 
+    height:1px; 
+    width:1px; 
+    margin:-1px; 
+    padding:0;
+    border:0;
+}
+
+input[type=checkbox].css-checkbox + label.css-label {
+    padding-left:23px;
+    height:17px; 
+    display:inline-block;
+    line-height:17px;
+    background-repeat:no-repeat;
+    background-position: 0 0;
+    background-size: 17px;
+    font-size:17px;
+    vertical-align:middle;
+    cursor:pointer;
+}
+
+input[type=checkbox].css-checkbox:checked + label.css-label {
+    background-position: 0 -17px;
+}
+
+.css-label{
+    background-image:url(dark-check-green.png);
+}
+
+
+.dark-check-green{background-image:url(dark-check-green.png);}
+
diff --git a/Lieb/wwwroot/dark-check-green.png b/Lieb/wwwroot/dark-check-green.png
new file mode 100644
index 0000000000000000000000000000000000000000..8f411c0ee2b07c320b66f1f1b759be0abbb15f45
GIT binary patch
literal 3195
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
AcmMzZ

literal 0
HcmV?d00001