mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 09:19:04 -04:00
[Lens] [Dashboard] Remove metric chart progress bar rounded border (#211189)
## Summary Closes https://github.com/elastic/kibana/issues/174889 1. Removes rounded border shown in metric chart progress bar border 2. Makes the panel heading highlight fit the container 3. Removes rounded border from loader horizontal bar ## Screenshots and screen recordings 1. Removes rounded border shown in metric chart progress bar border #### Before <img width="874" alt="Screenshot 2025-02-14 at 21 05 29" src="https://github.com/user-attachments/assets/ada89180-0cb1-4385-b58d-a6ca068376b7" /> #### After <img width="647" alt="Screenshot 2025-02-14 at 20 30 58" src="https://github.com/user-attachments/assets/9048a1a5-6afd-418f-994c-69fd68b969b1" />/ 2. Makes the panel heading highlight fit the container #### Before <img width="950" alt="Screenshot 2025-02-14 at 20 34 31" src="https://github.com/user-attachments/assets/eb4df553-bace-4ce2-b2c0-93829235c5ce" /> #### After <img width="154" alt="Screenshot 2025-02-14 at 20 36 53" src="https://github.com/user-attachments/assets/2887de13-198d-4ea4-a7a9-57bfd657746f" />/ 3. Removes rounded border from loader horizontal bar #### Before https://github.com/user-attachments/assets/a091f3a1-9d0e-4a55-a45e-9930e6d54983 #### After https://github.com/user-attachments/assets/5e6fd8d4-407e-45c0-b3ff-ba1884c413c1 ### Considerations We need to make sure that these styles changes do not affect the rest of the visualizations. I checked different visualizations and it looks like there are no side effects, e.g metric chart - break down by <img width="653" alt="Screenshot 2025-02-14 at 20 48 15" src="https://github.com/user-attachments/assets/d21b6e5d-af53-48be-ac20-646468949fea" /> <img width="650" alt="Screenshot 2025-02-14 at 21 03 29" src="https://github.com/user-attachments/assets/c60d1ca4-671b-492d-8629-5a69e273dc89" /> ### Checklist - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
This commit is contained in:
parent
fe80777b6f
commit
9d6ec7dc90
3 changed files with 2 additions and 3 deletions
|
@ -186,6 +186,7 @@ const styles = {
|
|||
flexDirection: 'column',
|
||||
height: '100%',
|
||||
position: 'relative',
|
||||
overflow: 'hidden',
|
||||
}),
|
||||
embPanelContent: css({
|
||||
'&.embPanel__content': {
|
||||
|
@ -193,7 +194,6 @@ const styles = {
|
|||
flex: '1 1 100%',
|
||||
zIndex: 1,
|
||||
minHeight: 0, // Absolute must for Firefox to scroll contents
|
||||
borderRadius: '4px',
|
||||
overflow: 'hidden',
|
||||
},
|
||||
'&.embPanel__content--hidden, &[data-error]': {
|
||||
|
|
|
@ -24,6 +24,7 @@
|
|||
border-radius: $euiBorderRadius;
|
||||
background: $euiColorEmptyShade;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
@include euiScrollBar;
|
||||
&>* {
|
||||
flex: 1 1 100%;
|
||||
|
|
|
@ -10,8 +10,6 @@
|
|||
height: 100%;
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
// important for visualizations with no padding
|
||||
border-radius: $euiBorderRadius;
|
||||
@include euiScrollBar;
|
||||
.lnsExpressionRenderer__component {
|
||||
position: static; // Let the progress indicator position itself against the outer parent
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue