Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[TASK] Ensure working PageLayout localization modal for v13 #420

Merged
merged 1 commit into from
Dec 20, 2024

Conversation

sbuerk
Copy link
Contributor

@sbuerk sbuerk commented Dec 20, 2024

[TASK] Ensure working PageLayout localization modal for v13

TYPO3 changes in a lot of areas including the backend JavaScript
and CSS definition where the most part are taken as internal and
not as public API. This can change in even in LTS versions, but
most likely in newer major versions.

With TYPO3 v13 context aware lightning (light/dark mode) has been
introduces which is a hard thing for icons in regards of readability.

To ensure that the DeepL Translate part within this localization
model works for TYPO3 v13 this change ...

  • Adds the overriden TypeScript file along with the compiled JavaScript
    (compiled within a TYPO3 13.4 monorepo !) as documentation while also
    providing the compiled JavaScript in the public resources folder with
    a core version suffix while keeping the compiled v12 variant.
  • Modifies the Configuration/JavaScriptModules.php to override the
    TYPO3 core localization file with the custom file based for the
    current used core version.
  • Duplicates the action icon svg, slightly modified to be context aware
    and using the currentColor defined by the context to suite in both
    modes (light and dark).
  • Adds a custom CSS file to define a custom CSS class used within the
    overriden localization JavaScript code to ensure that icon labels
    breaks correctly. Workaround for a core bug in this area. [1][2]
  • Enforce loading the action icon as inline within the overriden
    localization JavaScript file to include the svg - otherwise the
    theme based context color would not take effect, which works
    around another known TYPO3 core bug.
  • A smaller unnice handling issue checking the extension configuration
    to allow or deny the next step for the deepltranslate modes has been
    streamlined as a side change. Mainly v13, v12 only partly due to
    general overhaul in TYPO3 v13.
  • Deepltranslate alert info when configuration is not fullfilled are
    no longer closeable (v12 + v13).

The build system for the TypeScript -> JavaScript must be revised
in the next year (2025) to be capable of building against multiple
core versions. The v13 has been compiled and extracted directly in a
TYPO3 Core Development instance using the monorepo on branch 13.4.

[1] https://forge.typo3.org/issues/105853
[2] https://review.typo3.org/c/Packages/TYPO3.CMS/+/87576

TYPO3 v12
image

TYPO3 v13 lightmode
image

TYPO3 v13 darkmode
image

TYPO3 v13 darkmode - missing configuration alert
image

@sbuerk sbuerk force-pushed the pagelayoutmodule-translation branch 3 times, most recently from 401c423 to 5217fce Compare December 20, 2024 12:12
TYPO3 changes in a lot of areas including the backend JavaScript
and CSS definition where the most part are taken as internal and
not as public API. This can change in even in LTS versions, but
most likely in newer major versions.

With TYPO3 v13 context aware lightning (light/dark mode) has been
introduces which is a hard thing for icons in regards of readability.

To ensure that the `DeepL Translate` part within this localization
model works for TYPO3 v13 this change ...

* Adds the overriden TypeScript file along with the compiled JavaScript
  (compiled within a TYPO3 13.4 monorepo !) as documentation while also
  providing the compiled JavaScript in the public resources folder with
  a core version suffix while keeping the compiled v12 variant.
* Modifies the `Configuration/JavaScriptModules.php` to override the
  TYPO3 core `localization` file with the custom file based for the
  current used core version.
* Duplicates the action icon svg, slightly modified to be context aware
  and using the `currentColor` defined by the context to suite in both
  modes (light and dark).
* Adds a custom CSS file to define a custom CSS class used within the
  overriden localization JavaScript code to ensure that icon labels
  breaks correctly. Workaround for a core bug in this area. [1][2]
* Enforce loading the action icon as inline within the overriden
  localization JavaScript file to include the svg - otherwise the
  theme based context color would not take effect, which works
  around another known TYPO3 core bug.
* A smaller unnice handling issue checking the extension configuration
  to allow or deny the next step for the deepltranslate modes has been
  streamlined as a side change. Mainly v13, v12 only partly due to
  general overhaul in TYPO3 v13.
* Deepltranslate alert info when configuration is not fullfilled are
  no longer closeable (v12 + v13).

The build system for the TypeScript -> JavaScript **must** be revised
in the next year (2025) to be capable of building against multiple
core versions. The v13 has been compiled and extracted directly in a
TYPO3 Core Development instance using the monorepo on branch 13.4.

[1] https://forge.typo3.org/issues/105853
[2] https://review.typo3.org/c/Packages/TYPO3.CMS/+/87576
@sbuerk sbuerk force-pushed the pagelayoutmodule-translation branch from 5217fce to 8cb3339 Compare December 20, 2024 12:13
@sbuerk sbuerk merged commit 1eafd9d into main Dec 20, 2024
9 checks passed
@sbuerk sbuerk deleted the pagelayoutmodule-translation branch December 20, 2024 12:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants