[EuiIcon] Upate analyzeEvent icon to be horizontally centered
#5365
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
|
🤯 That was quick!! 💟 |
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_5365/ |
1 similar comment
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_5365/ |
andrew-goldstein
added a commit
to andrew-goldstein/kibana
that referenced
this pull request
Nov 12, 2021
…action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
andrew-goldstein
added a commit
to andrew-goldstein/kibana
that referenced
this pull request
Nov 14, 2021
…action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
andrew-goldstein
added a commit
to elastic/kibana
that referenced
this pull request
Nov 15, 2021
…ion icon buttons (#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per #115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
andrew-goldstein
added a commit
to andrew-goldstein/kibana
that referenced
this pull request
Nov 15, 2021
…ion icon buttons (elastic#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365 # Conflicts: # x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx
andrew-goldstein
added a commit
to elastic/kibana
that referenced
this pull request
Nov 15, 2021
…and action icon buttons (#118454) (#118602) * [Security Solution] Adjusts the width of the `Actions` column and action icon buttons (#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per #115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365 # Conflicts: # x-pack/plugins/security_solution/public/common/components/events_viewer/events_viewer.test.tsx # x-pack/plugins/security_solution/public/common/components/events_viewer/events_viewer.tsx # x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx # x-pack/plugins/security_solution/public/timelines/components/timeline/eql_tab_content/index.tsx * - removed files deleted via #118454 * - resolved conflict: useSourcererDataView vs useSourcererScope * - removed runtimeMappings and createFieldComponent props
andrew-goldstein
added a commit
to elastic/kibana
that referenced
this pull request
Nov 16, 2021
…nd action icon buttons (#118454) (#118598) * [Security Solution] Adjusts the width of the `Actions` column and action icon buttons (#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per #115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365 # Conflicts: # x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx * - removed createFieldComponent prop
fkanout
pushed a commit
to fkanout/kibana
that referenced
this pull request
Nov 17, 2021
…ion icon buttons (elastic#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
mbondyra
pushed a commit
to mbondyra/kibana
that referenced
this pull request
Nov 19, 2021
…ion icon buttons (elastic#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
dmlemeshko
pushed a commit
to elastic/kibana
that referenced
this pull request
Nov 29, 2021
…ion icon buttons (#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per #115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
roeehub
pushed a commit
to build-security/kibana
that referenced
this pull request
Dec 16, 2021
…ion icon buttons (elastic#118454) ## [Security Solution] Adjusts the width of the `Actions` column and action icon buttons This PR adjusts the width of the `Actions` column, and normalizes the action icon button sizes throughout the Security Solution, per elastic#115726 ### Before / after screenshots This section provides before / after screenshots for the following views: - Alerts - Alerts > Event rendered - Rules > Details - Rules > Details > Event rendered - Host > Events - Host > External alerts - Network > External alerts - Timeline > Query tab - Timeline > Correlation tab - Timeline > Pinned tab - Observability > alerts (no change) #### Alerts (before)  #### Alerts (after)  #### Alerts > Event rendered (before)  #### Alerts > Event rendered (after)  #### Rules > Details (before)  #### Rules > Details (after)  #### Rules > Details > Event rendered (before)  #### Rules > Details > Event rendered (after)  #### Host > Events (before)  #### Host > Events (after)  #### Host > External alerts (before)  #### Host > External alerts (after)  #### Network > External alerts (before)  #### Network > External alerts (after)  #### Timeline > Query tab (before)  #### Timeline > Query tab (after)  #### Timeline > Correlation tab (before)  #### Timeline > Correlation tab (after)  #### Timeline > Pinned tab (before)  #### Timeline > Pinned tab (after)  #### Observability > alerts (before)  #### Observability > alerts (after / no change)  ### Additional details - Per [this comment](elastic#115726 (comment)) from @monina-n , the size of all action buttons have been normalized match the size off the `...` overflow button (`28 x 32` at the time of this writing) via the `EuiButtonIcon` `size` prop: ``` size="s" ``` - The horizontal alignment of the `Analyze event` icon was updated by the EUI team in the following PR: elastic/eui#5365
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.
Closes #5361
The previous icon had the wrong dimensions, to this PR updates the icon with the right dimensions and centered within the viewbox.
Before
After
Checklist
[ ] Checked in mobile[ ] Props have proper autodocs and playground toggles[ ] Added documentation[ ] Checked Code Sandbox works for any docs examples[ ] Checked for breaking changes and labeled appropriately[ ] Checked for accessibility including keyboard-only and screenreader modes