restyled proficiencies table

src/app/character/character-creator/character-creator.component.ts

@@ -208,7 +208,7 @@ export class CharacterCreatorComponent {
           martial: false,
           other: [],
           tools: [],
-          languages: ['common'],
+          languages: [],
         },
         'proficiencies',
       ),

src/app/journal/journal-stats/ability-panel/proficiencies-table/proficiencies-table.component.html

@@ -58,6 +58,7 @@
             {{ "proficiencies.langAndTools" | translate }}
           </mat-panel-title>
         </mat-expansion-panel-header>
+        <divider [appearance]="'gold-1'" class="b-15"></divider>
         <h5 class="left">{{ "proficiencies.languages" | translate }}</h5>
         <div
           cdkDropList
@@ -71,8 +72,13 @@
             <div class="item" cdkDrag>
               {{ language }}
             </div>
+          } @empty {
+            <div class="empty">
+              {{ "proficiencies.emptyList" | translate }}
+            </div>
           }
         </div>
+        <divider [appearance]="'gold-1'" class="t-1 b-1"></divider>
         <h5 class="left">{{ "proficiencies.tools" | translate }}</h5>
         <div
           cdkDropList
@@ -83,6 +89,10 @@
             <div class="item" cdkDrag>
               {{ tool }}
             </div>
+          } @empty {
+            <div class="empty">
+              {{ "proficiencies.emptyList" | translate }}
+            </div>
           }
         </div>
       </mat-expansion-panel>

src/app/journal/journal-stats/ability-panel/proficiencies-table/proficiencies-table.component.scss

@@ -43,3 +43,11 @@ mat-expansion-panel {
   margin-bottom: 0.5rem;
   gap: 0.5rem;
 }
+
+.empty {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 1rem;
+  width: 100%;
+}

src/app/journal/journal-stats/ability-panel/proficiencies-table/tools-modal/tools-modal.component.html

@@ -19,11 +19,16 @@
         </mat-form-field>
         <icon-button
           [icon]="'delete'"
+          style="margin-left: 0.25rem"
           (click)="deleteLanguage(languageIndex)"
         ></icon-button>
       </div>
     }
-    <icon-button [icon]="'add'" (click)="addLanguage()"></icon-button>
+    <icon-button
+      class="add-button"
+      [icon]="'add'"
+      (click)="addLanguage()"
+    ></icon-button>
   </div>
 
   <div class="heading left b-05">{{ "proficiencies.tools" | translate }}</div>
@@ -40,7 +45,11 @@
         ></icon-button>
       </div>
     }
-    <icon-button [icon]="'add'" (click)="addTool()"></icon-button>
+    <icon-button
+      class="add-button"
+      [icon]="'add'"
+      (click)="addTool()"
+    ></icon-button>
   </div>
 
   <div class="horizontal-buttons">

src/app/journal/journal-stats/ability-panel/proficiencies-table/tools-modal/tools-modal.component.scss

@@ -7,3 +7,7 @@
   gap: 0.25rem;
   align-items: center;
 }
+
+.add-button {
+  margin: 0.5rem 5rem;
+}

src/assets/i18n/de.json

@@ -631,7 +631,8 @@
     "langAndTools": "Sprachen und Werkzeuge",
     "languages": "Sprachen",
     "tools": "Werkzeuge",
-    "modalHeader": "Sprachen und Werkzeuge"
+    "modalHeader": "Sprachen und Werkzeuge",
+    "emptyList": "Noch kein Eintrag"
   },
   "navigation": {
     "menu": "Menü",

src/assets/i18n/en.json

@@ -626,7 +626,8 @@
     "langAndTools": "Languages and Tools",
     "languages": "Languages",
     "tools": "Tools",
-    "modalHeader": "Languages and Tools"
+    "modalHeader": "Languages and Tools",
+    "emptyList": "No entry added"
   },
   "navigation": {
     "menu": "Menu",

src/services/species/species.service.ts

@@ -2870,7 +2870,7 @@ export class SpeciesService {
     <p><b>Magical Detection:</b> You can cast the Detect Magic and the Detect Poison and Disease spells with this trait. Starting at 3rd level, you can also cast the See Invisibility spell with it. Once you cast either spell with this trait, you can't cast that spell again until you finish a Long Rest. Intelligence is your Spellcasting Ability for these spells, and you don't require material components for them.</p>
     <p><b>Spells of the Mark:</b> If you have the Spellcasting or Pact Magic class feature, the spells on the Mark of Detection Spells table are added to the spell list of your Spellcasting class.</p>
     <p><b>Mark of Detection Spells</b></p>
-    <table class='table'>>
+    <table class='table'>
       <tr>
         <th>Spell Level</th>
         <th>Spells</th>

src/styles.scss

@@ -156,8 +156,8 @@ input[type="checkbox"]:checked::after {
   position: absolute;
   top: 50%;
   left: 50%;
-  width: 12px;
-  height: 12px;
+  width: 13px;
+  height: 13px;
   background: var(--gold-dark);
   transform: translate(-50%, -50%);
 }