Skip to content

[EuiIcon] Add checklist glyph#5705

Merged
andreadelrio merged 5 commits intoelastic:mainfrom
andreadelrio:listOptions
Mar 14, 2022
Merged

[EuiIcon] Add checklist glyph#5705
andreadelrio merged 5 commits intoelastic:mainfrom
andreadelrio:listOptions

Conversation

@andreadelrio
Copy link
Contributor

@andreadelrio andreadelrio commented Mar 10, 2022

Summary

Adds editorChecklist glyph which we need for the Controls projects in Dashboard. Below is a screenshot of the control type we're trying to represent.

image

Design

image

image

Also, replaced custom icon in MarkdownEditor with this new icon

image

Checklist

@cchaos
Copy link
Contributor

cchaos commented Mar 10, 2022

Quick suggestion, this looks just like a simple checklist. How about naming it that instead?

@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5705/

Copy link
Contributor

@elizabetdev elizabetdev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @andreadelrio. It looks great! 🎉

One thing that I noticed is that visually the icons are more similar to the list icons in editor controls. In common they have three list items. So I think we can move the icon there and update the design to make it more similar to these icons (like having round rectangles)

editor-check-list@2x

Also the EuiMarkdownEditor is using a custom icon that lives in src/components/markdown_editor/icons/markdown_checkmark.tsx, do you mind to replace it with this new one and deleting the old one markdown_checkmark?

Screenshot 2022-03-10 at 12 55 07

Also, don't forget to add the new icon to our Figma library! Thanks! 😄

@andreadelrio
Copy link
Contributor Author

@miukimiu great suggestions! implemented them all and made the icon's rectangles rounded.

@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5705/

@andreadelrio andreadelrio changed the title [EuiIcon] Add options list glyph [EuiIcon] Add checklist glyph Mar 10, 2022
Copy link
Contributor

@elizabetdev elizabetdev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @andreadelrio! LGTM! 🎉

@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5705/

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.

4 participants