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

Integrate inline images with image styles #8775

Closed
oleq opened this issue Jan 8, 2021 · 3 comments
Closed

Integrate inline images with image styles #8775

oleq opened this issue Jan 8, 2021 · 3 comments
Assignees
@magda-chrzescian
Labels
domain:ui/ux This issue reports a problem related to UI or UX. package:image squad:core Issue to be handled by the Core team. type:feature This issue reports a feature request (an idea for a new functionality or a missing option).
Milestone
iteration 41 (v27...

Comments

@oleq
Copy link
Member

oleq commented Jan 8, 2021

No description provided.

@oleq oleq added domain:ui/ux This issue reports a problem related to UI or UX. package:image squad:core Issue to be handled by the Core team. type:feature This issue reports a feature request (an idea for a new functionality or a missing option). labels Jan 8, 2021
@oleq oleq added this to the nice-to-have milestone Jan 8, 2021
@oleq oleq mentioned this issue Jan 8, 2021
Closed
3 tasks
@oleq
Copy link
Member Author

oleq commented Jan 8, 2021

I realised styles such as imageStyle:alignCenter or imageStyle:full do not make sense with inline images. We'll need two different configurations for inline and block and the UI will need to adapt on-the-fly and present only those styles matching the image type.

@oleq oleq modified the milestones: nice-to-have, iteration 40 Jan 27, 2021
@oleq oleq mentioned this issue Feb 11, 2021
Closed
@magda-chrzescian
Copy link
Contributor

I encountered a problem worth mentioning while implementing this functionality.

Since we need a wrapper for the inline mages, the image style class needs to be set on the <span> element instead of the <img>. It will cause some inconsistency between the editor view and the HTML output, where is no wrapper element at all and the class is applied to the <img> element directly.

It shouldn't cause any catastrophic consequences. Two really edge cases come to mind:

  • The behavior of the content added with the ::after pseudoselector, which will work only on the <span> element.
  • If someone will try to override the outline that we apply on the widget - which is unlikely since the same effect is easily achievable with the border property.

This was referenced Mar 2, 2021
Closed
Merged
oleq added a commit that referenced this issue Mar 8, 2021
@oleq
Merge pull request #8991 from ckeditor/i/8909-inline-images-styles
fc746be 
Other (image): Updated the `ImageStyle` plugin to support the inline images. Closes #8909. Closes #8775. Closes #8908.
Other (core): Added several new icons to support the inline image styles (see #8909).
Other (ui): Added the `class` property to the `SplitButtonView` UI component. See #8909.
@oleq
Copy link
Member Author

oleq commented Mar 9, 2021

Closed in #8991.

@oleq oleq closed this as completed Mar 9, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@magda-chrzescian magda-chrzescian

Labels
domain:ui/ux This issue reports a problem related to UI or UX. package:image squad:core Issue to be handled by the Core team. type:feature This issue reports a feature request (an idea for a new functionality or a missing option).
Projects
None yet
Milestone
iteration 41 (v27.0.0)
Development

No branches or pull requests
3 participants
@AnnaTomanek @oleq @magda-chrzescian