finalise darkmode

src/module/sheets/character/liturgies.mjs

@@ -62,7 +62,7 @@ export default {
 
                         insertObject["count" + name] = insertObject["count" + name] + 1;
 
-                        insertObject[name].push({
+                        insertObject[name]?.push({
                             id: item._id,
                             name: item.name,
                             lkpReq: lkp,

src/module/sheets/character/spells.mjs

@@ -14,14 +14,21 @@ export default {
             return merkmale.split(",").map((merkmal) => merkmal.trim())
         }
 
+        const prepareEigenschaftRoll = (actorData, name) => {
+            if (name && name !== "*") {
+                return actorData.system.attribute[name.toLowerCase()].aktuell
+            } else {
+                return 0
+            }
+        }
+
+        actorData.itemTypes["Spell"].forEach((item, index) => {
 
-        Object.values(actorData.items).forEach((item, index) => {
-            if (item.type === "Spell") {
                 const eigenschaften = item.system.probe;
                 const werte = [
-                    {name: eigenschaften[0], value: this.prepareEigenschaftRoll(actorData, eigenschaften[0])},
+                    {name: eigenschaften[0], value: prepareEigenschaftRoll(actorData, eigenschaften[0])},
-                    {name: eigenschaften[1], value: this.prepareEigenschaftRoll(actorData, eigenschaften[1])},
+                    {name: eigenschaften[1], value: prepareEigenschaftRoll(actorData, eigenschaften[1])},
-                    {name: eigenschaften[2], value: this.prepareEigenschaftRoll(actorData, eigenschaften[2])}
+                    {name: eigenschaften[2], value: prepareEigenschaftRoll(actorData, eigenschaften[2])}
                 ]
                 context.spells.push({
                     id: item._id,
@@ -36,7 +43,7 @@ export default {
                     eigenschaft2: werte[1].name,
                     eigenschaft3: werte[2].name,
                 })
-            }
+
         })
         context.hasSpells = context.spells.length > 0
 

src/module/sheets/groupSheet.mjs

@@ -251,7 +251,7 @@ export class GroupSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
         // Drag-drop
         new foundry.applications.ux.DragDrop.implementation({
             dragSelector: ".inventory-table .equipment",
-            dropSelector: ".inventory-table",
+            dropSelector: ".inventory",
             permissions: {
                 dragstart: this._canDragStart.bind(this),
                 drop: this._canDragDrop.bind(this)

src/style/molecules/_equipment.scss

@@ -1,6 +1,6 @@
 @use "../atoms/assets";
 
-@mixin equipment {
+@mixin equipment($darkmode: false) {
   position: relative;
   height: 32px;
   display: grid;
@@ -9,7 +9,11 @@
   padding: 2px 0 0 2px;
   margin: 4px 0 0 4px;
   gap: 8px;
+  @if darkmode {
+    background: rgba(0, 0, 0, 0.3);
+  } @else {
     background: assets.$tab-pane-background;
+  }
 
   .icon {
     width: 32px;

src/style/molecules/_liturgy-banner.scss

@@ -91,6 +91,9 @@ $deity_colours_tint: (
       @include coloring('Rahja');
 
       tr {
+
+        background-color: unset;
+
         th.background {
 
           &::before {
@@ -211,33 +214,9 @@ $deity_colours_tint: (
         z-index: 1;
         position: relative;
 
-        .border {
-          fill: #0000;
-        }
 
-        .center {
+        path {
           fill: $color;
-          stroke: colour.$rollable-die-border-color;
-        }
-
-        .topleft {
-          fill: color.adjust($color, $lightness: numbers.$lighter_factor);
-          stroke: colour.$rollable-die-border-color;
-        }
-
-        .bottomleft {
-          fill: color.adjust($color, $lightness: numbers.$lightest_factor);
-          stroke: colour.$rollable-die-border-color;
-        }
-
-        .topright {
-          fill: color.adjust($color, $lightness: numbers.$darken_factor);
-          stroke: colour.$rollable-die-border-color;
-        }
-
-        .bottomright, .bottom {
-          fill: color.adjust($color, $lightness: numbers.$darkest_factor);
-          stroke: colour.$rollable-die-border-color;
         }
       }
     }

src/style/molecules/_tabs.scss

@@ -87,7 +87,9 @@
         background: rgba(0, 0, 0, 0.3);
 
         &::after {
-          background: rgba(0, 0, 0, 0.3);
+          background: rgba(0, 0, 0, 0.75);
+          bottom: 0;
+          height: 1px;
         }
       }
 

src/style/organisms/_character-sheet.scss

@@ -105,3 +105,44 @@
   }
 
 }
+
+.theme-dark {
+
+  .application.sheet.dsa41.actor.character {
+
+    .tab.meta.active {
+      @include meta.tab(true);
+    }
+
+    .tab.social.active {
+      @include social.tab(true);
+    }
+
+    .tab.advsf.active {
+      @include advsf.tab(true);
+    }
+
+    .tab.equipment.active {
+      @include inventory.tab(true);
+    }
+
+    .tab.combat.active {
+      @include combat.tab(true);
+    }
+
+    .tab.skills.active {
+      @include skills.tab(true);
+    }
+
+    .tab.spells {
+      @include spells.tab(true);
+    }
+
+    .tab.liturgies {
+      @include liturgies.tab(true);
+    }
+
+
+  }
+
+}

src/style/organisms/_creature-sheet.scss

@@ -168,7 +168,7 @@
 
       div {
         .equipment {
-          @include equipment.equipment
+          @include equipment.equipment(false)
         }
       }
 
@@ -177,3 +177,18 @@
   }
 }
 
+.theme-dark {
+
+  .dsa41.sheet.actor.creature {
+
+    .tab.loot {
+
+      div .equipment {
+        @include equipment.equipment(true)
+      }
+
+    }
+
+  }
+
+}

src/style/organisms/_group-sheet.scss

@@ -150,10 +150,27 @@
 
   }
 
-  .equipment:hover {
+  .equipment {
+
+    display: grid;
+    height: 32px;
+    grid-template-columns: 32px 24px 1fr 80px;
+    grid-template-rows: 1fr;
+
+    input {
+      appearance: base;
+    }
+
+    span {
+      line-height: 32px;
+      vertical-align: middle;
+    }
+
+    &:hover {
       .item-name {
         text-shadow: 0 0 10px rgb(255 0 0);
       }
     }
+  }
 
 }

src/style/organisms/character-tabs/_advsf.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   .advantages-and-specialabilities {
     display: flex;

src/style/organisms/character-tabs/_combat.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   display: grid;
 

src/style/organisms/character-tabs/_inventory.scss

@@ -1,7 +1,7 @@
 @use "../../atoms/assets";
 @use "../../molecules/equipment";
 
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   & > div {
     display: grid;
@@ -35,7 +35,22 @@
           left: 0;
           top: 0;
           bottom: 0;
-          background: linear-gradient(to bottom, #0bad29 0%, #11f128 50%, #0cde24 51%, #6ff77b 100%);
+          background: url('/systems/DSA_4-1/assets/gradient.png');
+          background-size: 8px 100%;
+
+          &:after {
+            position: absolute;
+            left: 0;
+            top: 0;
+            bottom: 0;
+            right: 0;
+            background-color: rgba(0, 128, 0, 0.5);
+            content: '';
+          }
+
+          &.danger::after {
+            background-color: rgba(224, 60, 20, 0.5);
+          }
         }
 
       }
@@ -62,7 +77,7 @@
 
 
       .equipment {
-        @include equipment.equipment
+        @include equipment.equipment($darkmode)
       }
 
     }

src/style/organisms/character-tabs/_liturgies.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
 
   > div {
@@ -9,6 +9,12 @@
     border-top: unset;
     border-bottom: unset;
     position: relative;
+    background: unset;
+
+    tr {
+      background-color: unset;
+    }
+
   }
 
   .liturgy-header {
@@ -20,7 +26,6 @@
 
       th {
         vertical-align: middle;
-        color: black;
         text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.2);
       }
     }

src/style/organisms/character-tabs/_meta.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   display: flex;
   flex-direction: column;

src/style/organisms/character-tabs/_skills.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   container: thisTab / inline-size;
 

src/style/organisms/character-tabs/_social.scss

@@ -1,4 +1,4 @@
-@mixin tab {
+@mixin tab($darkmode: false) {
 
   display: flex;
   flex-direction: column;

src/style/organisms/character-tabs/_spells.scss

@@ -2,11 +2,12 @@
 @use "../../atoms/numbers";
 @use "../../atoms/colours" as colour;
 
-@mixin tab {
+@mixin tab($darkmode: false) {
   tr {
     height: 24px;
     margin: 0;
     padding: 0;
+    background-color: unset;
   }
 
   td {
@@ -15,44 +16,25 @@
     height: 24px;
   }
 
-  $color: #05f;
+  .spell.rollable {
-
-  .spell.rollable svg {
-    width: 24px;
-    height: 24px;
-    top: 1px;
-    z-index: 1;
     position: relative;
 
-    .border {
+    svg {
-      fill: #0000;
+
+      position: absolute;
+      width: 32px;
+      height: 32px;
+      z-index: 2;
+      top: 0;
+      left: -4px;
+      display: none;
+
+      path {
+        fill: colour.$zauber-color;
+      }
+    }
   }
 
-    .center {
-      fill: $color;
-      stroke: colour.$rollable-die-border-color;
-    }
-
-    .topleft {
-      fill: color.adjust($color, $lightness: numbers.$lighter_factor);
-      stroke: colour.$rollable-die-border-color;
-    }
-
-    .bottomleft {
-      fill: color.adjust($color, $lightness: numbers.$lightest_factor);
-      stroke: colour.$rollable-die-border-color;
-    }
-
-    .topright {
-      fill: color.adjust($color, $lightness: numbers.$darken_factor);
-      stroke: colour.$rollable-die-border-color;
-    }
-
-    .bottomright, .bottom {
-      fill: color.adjust($color, $lightness: numbers.$darkest_factor);
-      stroke: colour.$rollable-die-border-color;
-    }
-  }
 
   .die-column {
     width: 24px;
@@ -73,7 +55,7 @@
 
       &::after {
         content: '';
-        background-image: linear-gradient(to right, rgba(color.scale($color, $lightness: numbers.$zebra_light), numbers.$start_gradient), rgba(color.scale($color, $lightness: numbers.$zebra_light), numbers.$end_2_gradient));
+        background-image: linear-gradient(to right, rgba(color.scale(colour.$zauber-color, $lightness: numbers.$zebra_light), numbers.$start_gradient), rgba(color.scale(colour.$zauber-color, $lightness: numbers.$zebra_light), numbers.$end_2_gradient));
         border-top-right-radius: 8px;
         border-bottom-right-radius: 8px;
         position: absolute;
@@ -87,7 +69,7 @@
 
       &:nth-child(odd) {
         &::after {
-          background-image: linear-gradient(to right, rgba(color.scale($color, $lightness: numbers.$zebra_dark), numbers.$start_gradient), rgba(color.scale($color, $lightness: numbers.$zebra_dark), numbers.$end_2_gradient));
+          background-image: linear-gradient(to right, rgba(color.scale(colour.$zauber-color, $lightness: numbers.$zebra_dark), numbers.$start_gradient), rgba(color.scale(colour.$zauber-color, $lightness: numbers.$zebra_dark), numbers.$end_2_gradient));
         }
       }
     }

src/templates/actor/character/tab-equipment.hbs

@@ -5,7 +5,8 @@
     <div class="capacity">
         <label>Tragkraft: {{this.carryingweight}} von maximal {{this.maxcarryingcapacity}} Stein</label>
         <div class="resource">
-            <span class="fill" style="width: {{this.carryingpercentage}}%"></span>
+            <span class="fill {{#if (gte this.carryingpercentage 75)}}danger{{/if}}"
+                  style="width: {{this.carryingpercentage}}%"></span>
         </div>
     </div>
 

src/templates/actor/character/tab-liturgies.hbs

@@ -19,7 +19,7 @@
                 <th style="width: 0"></th>
                 <th class="banner-top" style="width: 90px"><img
                         src="systems/DSA_4-1/assets/deities/{{this.deity}}.png"/></th>
-                <th colspan="2">Liturgiekenntnis: {{this.lkp}}</th>
+                <th class="lkp" colspan="2">Liturgiekenntnis: {{this.lkp}}</th>
             </tr>
             </thead>
             <tbody>

src/templates/actor/character/tab-spells.hbs

@@ -2,6 +2,7 @@
          data-tab="{{tabs.spells.id}}"
          data-group="{{tabs.spells.group}}">
 
+    <div>
     <div class="tab-resources">
 
         <div class="astralpoints">
@@ -46,4 +47,5 @@
         {{/each}}
         </tbody>
     </table>
+    </div>
 </section>

src/templates/actor/group/tab-inventory.hbs

@@ -2,6 +2,8 @@
          data-tab="{{tabs.inventory.id}}"
          data-group="{{tabs.inventory.group}}">
 
+    <div class="inventory">
     {{> "systems/DSA_4-1/templates/ui/partial-equipment-button.hbs" inventoryItems}}
+    </div>
 
 </section>