fix: enhance table properties form styles for dark and light themes

Author: yaroslav8765

custom/quillEditor.vue

@@ -756,7 +756,13 @@ function removeCompletionOnBlur() {
   @apply dark:bg-darkInputBackground;
 }
 
-.ql-table-menus-container, .ql-table-dropdown-list {
+.ql-table-menus-container, .ql-table-dropdown-list, .ql-table-properties-form {
+
+  h2 {
+    @apply dark:text-darkInputText;
+    @apply text-lightInputText;
+  }
+
   @apply dark:bg-darkForm;
   @apply bg-lightForm;
   @apply dark:border-darkInputBorder;
@@ -791,8 +797,48 @@ function removeCompletionOnBlur() {
     @apply dark:fill-darkInputBackground dark:stroke-darkPrimary;
   }
 
+  .properties-form-action-row {
+    button {
+      @apply dark:bg-darkEditViewButtonBackground;
+      @apply bg-lightEditViewButtonBackground;
+      @apply dark:text-darkInputText;
+      @apply text-lightInputText;
+
+      &:hover {
+        @apply dark:bg-darkEditViewButtonBackgroundHover;
+        @apply bg-lightEditViewButtonBackgroundHover;
+      }
+    }
+  }
+
+  label {
+    top: -75%;
+    @apply dark:text-darkInputText;
+    @apply text-lightInputText;
+    @apply dark:bg-darkForm;
+    @apply bg-lightForm;
+  }
 }
 
+  .ql-table-properties-form .properties-form-row .ql-table-check-container .ql-table-btns-checked  {
+    @apply dark:bg-darkEditViewButtonBackgroundHover;
+    @apply bg-lightEditViewButtonBackgroundHover;
+    svg path {
+      @apply dark:stroke-darkPrimary;
+      @apply stroke-lightPrimary;
+    }
+  }
+
+  .ql-table-properties-form .properties-form-row .ql-table-check-container .ql-table-tooltip-hover:hover  {
+    @apply dark:bg-darkEditViewButtonBackgroundHover;
+    @apply bg-lightEditViewButtonBackgroundHover;
+  }
+
+  .ql-table-dropdown-properties .ql-table-dropdown-list li:hover {
+    @apply dark:bg-darkInputBackground;
+    @apply bg-lightInputBackground;
+  }
+
   .ql-table-dropdown,.ql-table-dropdown li {
     &:hover {
     @apply dark:bg-darkInputBackground;
@@ -813,4 +859,21 @@ function removeCompletionOnBlur() {
   border-bottom: theme('colors.darkForm') !important;
 }
 
+.ql-table-color-container .color-picker .color-picker-select {
+  @apply dark:bg-darkForm;
+  @apply bg-lightForm;
+  .erase-container:hover {
+    @apply dark:bg-darkInputBackground;
+    @apply bg-lightInputBackground;
+  }
+  svg path {
+    @apply dark:stroke-darkPrimary;
+    @apply stroke-lightPrimary;
+  }
+  .color-picker-palette {
+    @apply dark:bg-darkForm;
+    @apply bg-lightForm;
+  }
+}
+
 </style>