Fix tinymce dialog close button style

Author: tvdeyen

app/assets/builds/tinymce/skins/ui/alchemy-dark/skin.min.css

@@ -1534,8 +1534,15 @@ button::-moz-focus-inner {
 .tox .tox-dialog__header .tox-button {
   z-index: 1;
   color: var(--color-white);
+  height: var(--spacing-6);
   background-image: none; // If used in Solidus we need to override the background image
-  border: none; // If used in Solidus we need to override the border
+  border-color: transparent; // If used in Solidus we need to override the border
+
+  &:active:not(:disabled),
+  &:hover:not(:disabled) {
+    background-color: var(--color-blue_medium);
+    color: var(--color-white);
+  }
 }
 
 .tox .tox-dialog__draghandle {
@@ -2076,11 +2083,8 @@ body.tox-dialog__disable-scroll {
 }
 
 .tox .tox-color-input span::before {
-  background-image: linear-gradient(
-      45deg,
-      rgba(0, 0, 0, 0.25) 25%,
-      transparent 25%
-    ),
+  background-image:
+    linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%),
     linear-gradient(-45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%),
     linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%),
     linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%);

app/assets/builds/tinymce/skins/ui/alchemy/skin.min.css

@@ -1534,8 +1534,15 @@ button::-moz-focus-inner {
 .tox .tox-dialog__header .tox-button {
   z-index: 1;
   color: var(--color-white);
+  height: var(--spacing-6);
   background-image: none; // If used in Solidus we need to override the background image
-  border: none; // If used in Solidus we need to override the border
+  border-color: transparent; // If used in Solidus we need to override the border
+
+  &:active:not(:disabled),
+  &:hover:not(:disabled) {
+    background-color: var(--color-blue_medium);
+    color: var(--color-white);
+  }
 }
 
 .tox .tox-dialog__draghandle {
@@ -2076,11 +2083,8 @@ body.tox-dialog__disable-scroll {
 }
 
 .tox .tox-color-input span::before {
-  background-image: linear-gradient(
-      45deg,
-      rgba(0, 0, 0, 0.25) 25%,
-      transparent 25%
-    ),
+  background-image:
+    linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%),
     linear-gradient(-45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%),
     linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%),
     linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%);