[EuiText] Update nested ordered lists styles #6615
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_6615/ |
glitteringkatie
approved these changes
Feb 23, 2023
cee-chen
approved these changes
Feb 23, 2023
Comment on lines
+162
to
+172
| ol ol, | ||
| ul ol { | ||
| list-style-type: lower-roman; | ||
| } | ||
|
|
||
| ul ul ol, | ||
| ul ol ol, | ||
| ol ul ol, | ||
| ol ol ol { | ||
| list-style-type: lower-alpha; | ||
| } |
There was a problem hiding this comment.
[Adding this comment for reference] Just want to quickly note that it (sadly) looks like there isn't a way to alternate style types to an infinite depth with current CSS spec, so anything past 3 levels of nesting will just use a/b/c.
There was a problem hiding this comment.
Also for reference, this is consistent with markdown in GitHub:
- Number
- Roman
- Alpha
- Alpha
- Alpha!
- Alpha
- Alpha
- Roman
jbudz
added a commit
to elastic/kibana
that referenced
this pull request
Mar 14, 2023
👋 Hi all - the biggest breaking change of this PR is around two icon type changes/renames. 1.⚠️ **The `alert` icon is now named `warning`** - <img width="103" alt="" src="https://user-images.githubusercontent.com/549407/223561599-8913e88c-676f-47cd-aaed-81b64783bd81.png" align="middle"> - This change should have been automatically converted on your behalf by the EUI team, **but if for some reason** we missed making this conversion in this PR and your icon(s) are now broken, please ping us or let us know in this PR (or fix yourself after this PR merges). - In some cases, teams were using this icon for error messages, alongside the `danger` color. In those cases, we opinionatedly changed those icon usages to the new `error` icon instead of using the old alert/warning icon. 2. 🛑 **The `crossInACircleFilled` icon has been removed, and a new `error` icon added** - <img width="84" alt="" src="https://user-images.githubusercontent.com/549407/223561892-4406bdf6-1a55-49ac-85ad-3a11eb7c090d.png" align="middle"> - The conversion for this breaking change was not straightforward. This was the path we used to determine what to change `crossInACircleFilled` usages to: - If the icon was associated with errors or error messages, we changed it to the new `error` icon. - If a "delete" action was associated with this icon, we changed it to the `trash` icon instead. - If a "clear" action was associated with this icon, we changed it to just the `cross` icon, or in some cases `minusInCircleFilled` (if used alongside `plusInCircleFilled`). - Again, if we made a mistake during this conversion or missed your plugin, please feel free to ping us. ## Summary `[email protected]` ⏩ `[email protected]` ## [`76.0.2`](https://github.com/elastic/eui/tree/v76.0.2) **Bug fixes** - Added a legacy `alert` alias for the `warning` `EuiIcon` type ([#6640](elastic/eui#6640)) ## [`76.0.1`](https://github.com/elastic/eui/tree/v76.0.1) **Bug fixes** - Fixed broken icons on all `isInvalid` form controls ([#6629](elastic/eui#6629)) ## [`76.0.0`](https://github.com/elastic/eui/tree/v76.0.0) - Added `pivot` glyph to `EuiIcon` ([#6605](elastic/eui#6605)) - Added the `displayHeaderCellProps` API to `EuiDataGrid`'s columns, which allows passing custom props directly to column header cells ([#6609](elastic/eui#6609)) - Added the new `headerCellProps`/`footerCellProps` APIs to `EuiDataGrid`'s control columns, which allows passing custom props directly to control column header or footer cells ([#6609](elastic/eui#6609)) - Added a new `footerCellRender` API to `EuiDataGrid`'s control columns, which allows completely customizing control column rendering (previously rendered an empty cell) ([#6609](elastic/eui#6609)) - Updated the styling of nested ordered lists in `EuiText` to align with GitHub's list style, which is a popular format used in Markdown or MDX formatting ([#6615](elastic/eui#6615)) - Added a margin-bottom property exclusively to the direct child `ul` and `ol` elements of the `EuiText` component ([#6615](elastic/eui#6615)) - Fix issue with badges appearing within an `EuiBadgeGroup`, where the CSS rule to override the `margin-inline-start` was not being applied correctly due to the order of appearance in the CSS rules ([#6618](elastic/eui#6618)) **Bug fixes** - Fixed `EuiDataGrid` footer control columns rendering with cell expansion popovers when they should not have been ([#6609](elastic/eui#6609)) - Fixed an `EuiSkipLink` bug where main content loading in progressively/dynamically after the skip link rendered was not being correctly focused ([#6613](elastic/eui#6613)) **Breaking changes** - Renamed `EuiIcon`'s `alert` to `warning` ([#6608](elastic/eui#6608)) - Removed `EuiIcon`'s `crossInACircleFilled` in favor of `error` ([#6608](elastic/eui#6608)) --------- Co-authored-by: Davey Holler <[email protected]> Co-authored-by: Constance Chen <[email protected]> Co-authored-by: Kibana Machine <[email protected]> Co-authored-by: Jon <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Updated the styling of nested ordered lists (
ol) to align with GitHub's list style, which is a popular format used in Markdown or MDX formatting. These changes will enhance the readability and consistency of our content, and ensure that our lists are easily understood by readers.Added a margin-bottom property exclusively to the direct child
ulandolelements of the EuiText component. This change will ensure that the spacing between nested lists within the EuiText component is consistent and visually pleasing. Other child elements of EuiText will not be affected by this change.Closes #6611.
QA
Remove or strikethrough items that do not apply to your PR.
General checklist
@defaultif default values are missing) and playground toggles