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.

Sign up for GitHub

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

Jump to bottom

Image styles CSS is not applied in new installation methods #16317

Closed
Witoso opened this issue May 7, 2024 · 0 comments · Fixed by #16338
Closed

Image styles CSS is not applied in new installation methods #16317

Witoso opened this issue May 7, 2024 · 0 comments · Fixed by #16338
Assignees
@pszczesniak
Labels
type:bug This issue reports a buggy (incorrect) behavior.
Milestone
iteration 75

Comments

@Witoso
Copy link
Member

Witoso commented May 7, 2024

📝 Provide detailed reproduction steps (if any)

  1. For new installation methods (🦸 Improving CKEditor 5 installation methods #15502).
  2. Load Image styles plugin, and configure it.
  3. Style the image via its toolbar.

✔️ Expected result

Style is applied.

❌ Actual result

Style is not applied. CSS is overwritten.

❓ Possible solution

Fix the BEM of image style classes.

.ck-content .image-style-block-align-right, /* <---- TBD to keep backward compat */
.ck-content .image.image-style-block-align-right {

📃 Other details

  • Browser: …
  • OS: …
  • First affected CKEditor version: …
  • Installed CKEditor plugins: …

If you'd like to see this fixed sooner, add a 👍 reaction to this post.
@Witoso Witoso added the type:bug This issue reports a buggy (incorrect) behavior. label May 7, 2024
@pszczesniak pszczesniak self-assigned this May 10, 2024
@CKEditorBot CKEditorBot added the status:in-progress Set automatically when an issue lands in the "In progress" column. We are working on it. label May 10, 2024
@pszczesniak pszczesniak mentioned this issue May 10, 2024
Merged
pszczesniak added a commit that referenced this issue May 20, 2024
@pszczesniak
Merge pull request #16338 from ckeditor/ck/16317-image-style-css-brea…
3f8edce 
…ks-in-nim

Fix (image): Increased specificity of `.image-style-block-align-[right/left]`, `.image-style-align-[right/left]`, `.image-style-side` CSS classes by adding `.image` class. Closes #16317.

MINOR BREAKING CHANGE (image): Increased specificity of `.image-style-block-align-[right/left]`, `.image-style-align-[right/left]`, `.image-style-side` CSS classes by adding `.image` class. See #16317.
@CKEditorBot CKEditorBot removed the status:in-progress Set automatically when an issue lands in the "In progress" column. We are working on it. label May 20, 2024
@CKEditorBot CKEditorBot added this to the iteration 75 milestone May 20, 2024
@CKEditorBot CKEditorBot mentioned this issue May 21, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@pszczesniak pszczesniak

Labels
type:bug This issue reports a buggy (incorrect) behavior.
Projects
None yet
Milestone
iteration 75
Development

Successfully merging a pull request may close this issue.

Fixed Image styles CSS that got broken using NIM. ckeditor/ckeditor5
3 participants
@pszczesniak @Witoso @CKEditorBot