-
Notifications
You must be signed in to change notification settings - Fork 122
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
feat(styles): eui Amsterdam theme #1463
Conversation
👋 Hey @nickofthyme! This is great! I just figured I'd give you a heads up that we will be releasing (another) breaking change soon that will actually make You may want to pause this until that release happens so you don't have to do the work twice. I can provide guidance on the changes needed once that happens. |
@cchaos Thanks for the heads up. I think the main issue with this change is our VRT and having to check all 900+ diffs. If your breaking change would just mean we have to change some imports but the styles are nearly the same than it shouldn't be an issue. When is this change coming? days, weeks, months? |
It's in this PR elastic/eui#5121 which is in it's final reviews. So maybe next Tuesday (11/9) or the Tuesday after. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM - checked all the vrts thanks for opening/referencing the orphan points. All other screenshots only reflected theme changes
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I might be a bit confused about how your docs work or how you expect consumers to consumer charts with/without EUI, but here are some suggestions:
@markov00 could you take a look at the style |
The `rotation` configuration is available on the `theme.heatmap.xAxisLabel` theme style to rotate the labels of the X-axis from 0 to 90 degrees. The rotation will shrink the chart vertically( and occasionally also horizontally) depending on the length of the labels. Few changes to the x-axis labels are also landed in this PR: - categorical labels overflowing the chart boundaries will play a role in shrinking the chart size. - the X-axis now shows small ticks, center-aligned for categorical scale and left-aligned for time - the time axis ticks are aligned to the right of the ticks - time axis labels instead, will not shrink the chart anymore. The number of labels will be reduced gradually to avoid overlaps and overflows. The right edge of the heatmap will always touch the right edge of the rendering area. BREAKING CHANGES: `width`, `align`, and `baseline` style properties are removed from the `xAxisLabels` and `yAxisLabels` style of the Heatmap theme. Co-authored-by: Marco Vettorello <[email protected]>
Bumps [url-parse](https://github.com/unshiftio/url-parse) from 1.5.3 to 1.5.10. - [Release notes](https://github.com/unshiftio/url-parse/releases) - [Commits](unshiftio/url-parse@1.5.3...1.5.10) --- updated-dependencies: - dependency-name: url-parse dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@markov00 do you think this should be a breaking change? |
Changing the colors is actually a breaking change even if the change is not too drastic (the colors are a bit more washed and the last 2 colors are inverted) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Changes looks goot to me tested locally and all charts looks great (only the streamgraph is a bit too transparent, but we can fix this in a different PR)
# [45.0.0](v44.0.0...v45.0.0) (2022-03-04) ### Features * **styles:** eui Amsterdam theme ([#1463](#1463)) ([fea1445](fea1445)) ### BREAKING CHANGES * **styles:** chart color and style changes
Summary
Move to eui Amsterdam theme. Major changes include:
:focus
&:focus-within
states are slightly different. (see gifs below)After
Before
Details
Chart consumes styles from eui to leverage some variables, mixins, etc. and now that kibana is fully on the new Amsterdam theme I think it's best we fully migrate. This was also causing styles issues related to a different implementation for focus states between the old and the new, which consequently applied both styles. This situation defeats any VRT we have in place.
cc: @elastic/eui-design
Issues
fix #1461
Checklist
:xy
,:partition
):interactions
,:axis
):theme
label has been added and the@elastic/eui-design
team has been pinged when there areTheme
API changescloses #123
,fixes #123
)dark
,light
,eui-dark
&eui-light