moved basic talent properties in talent-sheet head

- a little bit better gridding of side-properties
  (still needs a rewrite)
- common SCSS mixin for input field marking

src/scss/components/_basic_property.scss

@@ -1,13 +1,20 @@
 .basic-properties {
     flex: 0 0 100%;
     .basic-property {
-        .basic-property-label {
+        display: grid;
+        align-content: end;
+
+        .basic-property-label,
+        & > label {
             font-weight: bold;
         }
 
-        .basic-property-select {
+        .basic-property-select,
+        & > select {
             display: block;
             width: 100%;
         }
+
+        @include mark-invalid-or-disabled-input;
     }
 }

src/scss/components/_description.scss

@@ -9,7 +9,7 @@
     .side-property {
         margin: 2px 0;
         display: grid;
-        grid-template-columns: 40% auto;
+        grid-template-columns: minmax(30%, auto) auto;
         justify-content: left;
 
         label {
@@ -22,12 +22,9 @@
             text-align: left;
             width: calc(100% - 2px);
         }
-        input:invalid {
-            background-color: $c-invalid-input;
-        }
-        input:disabled {
-            background-color: transparent;
-        }
+
+        @include mark-invalid-or-disabled-input;
+
         input[type="checkbox"] {
             width: auto;
             height: 100%;

src/scss/components/_items.scss

@@ -39,9 +39,8 @@
             height: 100%;
             margin: 0px;
         }
-        input:invalid {
-            background-color: $c-invalid-input;
-        }
+
+        @include mark-invalid-or-disabled-input;
     }
 
     .item-name {

src/scss/utils/_mixins.scss

@@ -19,3 +19,12 @@
     display: grid;
     place-items: center;
 }
+
+@mixin mark-invalid-or-disabled-input {
+    input:invalid {
+        background-color: $c-invalid-input;
+    }
+    input:disabled {
+        background-color: transparent;
+    }
+}