made spell modal responsive

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

@@ -1,3 +1,5 @@
+@import "../../../../../../responsive";
+
 .dimensions {
   width: 50rem;
   background-color: var(--modal-background);
@@ -6,3 +8,10 @@
   box-shadow: var(--shadow);
   padding: 0 2rem;
 }
+
+.flex-form {
+  gap: 0.5rem;
+  @include height-small {
+    gap: 1.5rem;
+  }
+}

src/app/journal/journal-stats/weapons-container/weapon-table/weapon-modal/weapon-modal.component.scss

@@ -1,3 +1,5 @@
+@import "../../../../../../responsive";
+
 .checkbox-row {
   display: flex;
   flex-direction: row;
@@ -98,3 +100,38 @@ div.nav-pills.flex-column.nav {
     opacity: 0.5;
   }
 }
+
+// Responsive
+
+hr {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+
+  @include height-small {
+    margin-top: 1.5rem;
+    margin-bottom: 1.5rem;
+  }
+}
+
+.horizontal-buttons {
+  padding: 1rem 0;
+
+  @include height-small {
+    padding: 2rem 0;
+  }
+}
+
+.title {
+  margin-top: 1rem;
+  @include height-small {
+    margin-top: 2rem;
+  }
+}
+
+.content {
+  margin-top: 1rem;
+
+  @include height-small {
+    margin-top: 1.5rem;
+  }
+}

src/app/journal/spell-modal/spell-modal.component.scss

@@ -1,3 +1,5 @@
+@import "../../../responsive";
+
 .checkbox-column {
   width: 33.3%;
   display: flex;
@@ -121,3 +123,38 @@ div.nav-pills.flex-column.nav {
     opacity: 0.5;
   }
 }
+
+// Responsive
+
+hr {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+
+  @include height-medium {
+    margin-top: 1.5rem;
+    margin-bottom: 1.5rem;
+  }
+}
+
+.horizontal-buttons {
+  padding: 1.5rem 0;
+
+  @include height-small {
+    padding: 2rem 0;
+  }
+}
+
+.title {
+  margin-top: 1.5rem;
+  @include height-small {
+    margin-top: 2rem;
+  }
+}
+
+.content {
+  margin-top: 1rem;
+
+  @include height-small {
+    margin-top: 1.5rem;
+  }
+}