Fix the styling of the accessibility dialog
authorAlexander Ebert <ebert@woltlab.com>
Wed, 25 Sep 2024 11:31:10 +0000 (13:31 +0200)
committerAlexander Ebert <ebert@woltlab.com>
Wed, 25 Sep 2024 11:31:10 +0000 (13:31 +0200)
It’s not perfect but comes close to the appearance of our dialogs.

See https://www.woltlab.com/community/thread/307927-ckeditor-hilfefenster-schrift-im-dunklen-farbschema-kaum-lesbar-layout-schief/

wcfsetup/install/files/style/ui/ckeditor.scss

index 35825d8474c5b6815be93360aa00bb62800d706b..36dc947e99b5c8bea4d00516b9b466d06f0fdad6 100644 (file)
@@ -662,3 +662,25 @@ html.iOS {
                display: none !important;
        }
 }
+
+/* Accessiblity Dialog */
+.ck.ck-dialog {
+       --ck-accessibility-help-dialog-border-color: var(--wcfContentBorderInner);
+       --ck-color-dialog-form-header-border: var(--wcfContentBorderInner);
+       --ck-accessibility-help-dialog-code-background-color: transparent;
+
+       background-color: var(--wcfContentBackground);
+       border-radius: var(--wcfBorderRadiusContainer);
+       box-shadow: var(--wcfBoxShadow);
+       color: var(--wcfContentText);
+
+       dl:not(.plain) {
+               &:not(:first-child) {
+                       margin-top: 0;
+               }
+
+               > :is(dt:not(:empty), dd:not(:last-child)) {
+                       margin-bottom: 0;
+               }
+       }
+}