From b85f5cb1910b7e857fae913bd86563619cf9f731 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Fri, 14 Apr 2023 15:47:34 +0200 Subject: [PATCH] Use CSS classes for text alignment Fixes WoltLab/editor#31 --- .../Core/Component/Ckeditor/Configuration.ts | 8 ++++++++ .../Core/Component/Ckeditor/Configuration.js | 8 ++++++++ wcfsetup/install/files/style/ui/ckeditor.scss | 19 +++++++++++++++++++ 3 files changed, 35 insertions(+) diff --git a/ts/WoltLabSuite/Core/Component/Ckeditor/Configuration.ts b/ts/WoltLabSuite/Core/Component/Ckeditor/Configuration.ts index 5f4e34cf85..3c06171ff3 100644 --- a/ts/WoltLabSuite/Core/Component/Ckeditor/Configuration.ts +++ b/ts/WoltLabSuite/Core/Component/Ckeditor/Configuration.ts @@ -244,6 +244,14 @@ class ConfigurationBuilder { // TODO: The typings are both incompleted and outdated. return { + alignment: { + options: [ + { name: "center", className: "text-center" }, + { name: "left", className: "text-left" }, + { name: "justify", className: "text-justify" }, + { name: "right", className: "text-right" }, + ], + }, language, removePlugins: this.#removePlugins, toolbar: this.#getToolbar(), diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Configuration.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Configuration.js index 542bdde6a6..8205f37ec5 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Configuration.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Configuration.js @@ -211,6 +211,14 @@ define(["require", "exports", "../../Language"], function (require, exports, Lan const language = Object.keys(window.CKEDITOR_TRANSLATIONS).find((language) => language !== "en"); // TODO: The typings are both incompleted and outdated. return { + alignment: { + options: [ + { name: "center", className: "text-center" }, + { name: "left", className: "text-left" }, + { name: "justify", className: "text-justify" }, + { name: "right", className: "text-right" }, + ], + }, language, removePlugins: this.#removePlugins, toolbar: this.#getToolbar(), diff --git a/wcfsetup/install/files/style/ui/ckeditor.scss b/wcfsetup/install/files/style/ui/ckeditor.scss index 47ad1c4056..552de18465 100644 --- a/wcfsetup/install/files/style/ui/ckeditor.scss +++ b/wcfsetup/install/files/style/ui/ckeditor.scss @@ -189,3 +189,22 @@ html[data-color-scheme="dark"] { height: 16px; width: 16px; } + +/* Text Alignment */ +.text-center { + text-align: center !important; +} + +.text-left { + text-align: left !important; +} + +.text-justify { + text-align: justify !important; + -webkit-hyphens: auto; + hyphens: auto; +} + +.text-right { + text-align: right !important; +} -- 2.20.1