Skip to content

[Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges#213666

Merged
andrew-goldstein merged 1 commit intoelastic:mainfrom
andrew-goldstein:ad_overflow_issue_213228
Mar 10, 2025
Merged

[Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges#213666
andrew-goldstein merged 1 commit intoelastic:mainfrom
andrew-goldstein:ad_overflow_issue_213228

Conversation

@andrew-goldstein
Copy link
Copy Markdown
Contributor

@andrew-goldstein andrew-goldstein commented Mar 8, 2025

[Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in #213228.

It also hides the Load query and Save query menu items from the filter popup menu in the settings flyout.

scrollable details

Details

  • The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

Before

details before

After

details after

  • TheLoad query and Save query menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

Before

filter menu before

After

filter menu after

@andrew-goldstein andrew-goldstein added release_note:skip Skip the PR/issue when compiling release notes v9.0.0 Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Security Generative AI Security Generative AI backport:version Backport to applied version labels v8.18.0 v9.1.0 v8.19.0 v8.18.1 labels Mar 8, 2025
@andrew-goldstein andrew-goldstein self-assigned this Mar 8, 2025
@andrew-goldstein andrew-goldstein requested a review from a team as a code owner March 8, 2025 23:47
@elasticmachine
Copy link
Copy Markdown
Contributor

Pinging @elastic/security-solution (Team: SecuritySolution)

… markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in <elastic#213228>.

It also hides the `Load query` and `Save query` menu items from the filter popup menu in the settings flyout.

![scrollable details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)

#### Details

- The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

**Before**

![details before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)

**After**

![details after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)

- The`Load query` and `Save query` menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

**Before**

![filter menu before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)

**After**

![filter menu after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)
@andrew-goldstein andrew-goldstein force-pushed the ad_overflow_issue_213228 branch from 94ffd15 to 94a629d Compare March 10, 2025 12:24
@elasticmachine
Copy link
Copy Markdown
Contributor

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

  • [job] [logs] FTR Configs #110 / ObservabilityApp Observability Rules page Create rules form "after each" hook for "Should allow the user to select consumers when creating ES query rules"
  • [job] [logs] FTR Configs #110 / ObservabilityApp Observability Rules page Create rules form Should allow the user to select consumers when creating ES query rules

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
securitySolution 8.9MB 8.9MB +196.0B

cc @andrew-goldstein

@andrew-goldstein andrew-goldstein merged commit ecdea5a into elastic:main Mar 10, 2025
@andrew-goldstein andrew-goldstein deleted the ad_overflow_issue_213228 branch March 10, 2025 15:34
@kibanamachine
Copy link
Copy Markdown
Contributor

Starting backport for target branches: 8.18, 8.x, 9.0

https://github.com/elastic/kibana/actions/runs/13768622830

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Mar 10, 2025
…kdown with XL badges (elastic#213666)

### [Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in <elastic#213228>.

It also hides the `Load query` and `Save query` menu items from the filter popup menu in the settings flyout.

![scrollable details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)

#### Details

- The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

**Before**

![details before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)

**After**

![details after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)

- The`Load query` and `Save query` menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

**Before**

![filter menu before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)

**After**

![filter menu after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)

(cherry picked from commit ecdea5a)
kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Mar 10, 2025
…kdown with XL badges (elastic#213666)

### [Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in <elastic#213228>.

It also hides the `Load query` and `Save query` menu items from the filter popup menu in the settings flyout.

![scrollable details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)

#### Details

- The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

**Before**

![details before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)

**After**

![details after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)

- The`Load query` and `Save query` menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

**Before**

![filter menu before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)

**After**

![filter menu after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)

(cherry picked from commit ecdea5a)
kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Mar 10, 2025
…kdown with XL badges (elastic#213666)

### [Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in <elastic#213228>.

It also hides the `Load query` and `Save query` menu items from the filter popup menu in the settings flyout.

![scrollable details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)

#### Details

- The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

**Before**

![details before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)

**After**

![details after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)

- The`Load query` and `Save query` menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

**Before**

![filter menu before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)

**After**

![filter menu after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)

(cherry picked from commit ecdea5a)
@kibanamachine
Copy link
Copy Markdown
Contributor

💚 All backports created successfully

Status Branch Result
8.18
8.x
9.0

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

kibanamachine added a commit that referenced this pull request Mar 10, 2025
…or markdown with XL badges (#213666) (#213774)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution] [Attack discovery] Fixes overflow styling for
markdown with XL badges
(#213666)](#213666)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Andrew
Macri","email":"andrew.macri@elastic.co"},"sourceCommit":{"committedDate":"2025-03-10T15:34:35Z","message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:
SecuritySolution","Team:Security Generative
AI","backport:version","v8.18.0","v9.1.0","v8.19.0","v8.18.1"],"title":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges","number":213666,"url":"https://github.com/elastic/kibana/pull/213666","mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},"sourceBranch":"main","suggestedTargetBranches":["9.0","8.18","8.x"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.18","label":"v8.18.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213666","number":213666,"mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Andrew Macri <andrew.macri@elastic.co>
@andrew-goldstein
Copy link
Copy Markdown
Contributor Author

Testing notes (v8.18.0, v8.18.1, and v9.0.0)

Please note, when testing this fix in any of the following releases:

  • v8.18.0
  • v8.18.1
  • v9.0.0

the always-disabled Load query and Saved query menu items shown in the screenshot below:

filter menu before

will still be visible (and always disabled) in the releases named above.

The showSavedQueryControls API, introduced in #210556 was NOT backported to the releases above, so it's not possible to hide the menu items in those releases.

kibanamachine added a commit that referenced this pull request Mar 11, 2025
…for markdown with XL badges (#213666) (#213773)

# Backport

This will backport the following commits from `main` to `8.18`:
- [[Security Solution] [Attack discovery] Fixes overflow styling for
markdown with XL badges
(#213666)](#213666)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Andrew
Macri","email":"andrew.macri@elastic.co"},"sourceCommit":{"committedDate":"2025-03-10T15:34:35Z","message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:
SecuritySolution","Team:Security Generative
AI","backport:version","v8.18.0","v9.1.0","v8.19.0","v8.18.1"],"title":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges","number":213666,"url":"https://github.com/elastic/kibana/pull/213666","mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},"sourceBranch":"main","suggestedTargetBranches":["9.0","8.18","8.x"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.18","label":"v8.18.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213666","number":213666,"mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

---------

Co-authored-by: Andrew Macri <andrew.macri@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 11, 2025
…or markdown with XL badges (#213666) (#213775)

# Backport

This will backport the following commits from `main` to `9.0`:
- [[Security Solution] [Attack discovery] Fixes overflow styling for
markdown with XL badges
(#213666)](#213666)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Andrew
Macri","email":"andrew.macri@elastic.co"},"sourceCommit":{"committedDate":"2025-03-10T15:34:35Z","message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:
SecuritySolution","Team:Security Generative
AI","backport:version","v8.18.0","v9.1.0","v8.19.0","v8.18.1"],"title":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges","number":213666,"url":"https://github.com/elastic/kibana/pull/213666","mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},"sourceBranch":"main","suggestedTargetBranches":["9.0","8.18","8.x"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.18","label":"v8.18.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213666","number":213666,"mergeCommit":{"message":"[Security
Solution] [Attack discovery] Fixes overflow styling for markdown with XL
badges (#213666)\n\n### [Security Solution] [Attack discovery] Fixes
overflow styling for markdown with XL badges\n\nThis PR fixes an
overflow styling issue when markdown contains badges that exceed the
width of the container, as reported in
<https://github.com/elastic/kibana/issues/213228>.\n\nIt also hides the
`Load query` and `Save query` menu items from the filter popup menu in
the settings flyout.\n\n![scrollable
details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)\n\n####
Details\n\n- The overflow issue is fixed by enabling horizontal
scrolling when badges exceed the width of the markdown container, as
illustrated by the before and after screenshots
below:\n\n**Before**\n\n![details
before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)\n\n**After**\n\n![details
after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)\n\n-
The`Load query` and `Save query` menu items in the filter popup menu are
now hidden, as illustrated by the before and after screenshots of the
settings flyout below:\n\n**Before**\n\n![filter menu
before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)\n\n**After**\n\n![filter
menu
after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)","sha":"ecdea5abaa2a2c318056e8474c0d513e9c6f535c"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

---------

Co-authored-by: Andrew Macri <andrew.macri@elastic.co>
CAWilson94 pushed a commit to CAWilson94/kibana that referenced this pull request Mar 22, 2025
…kdown with XL badges (elastic#213666)

### [Security Solution] [Attack discovery] Fixes overflow styling for markdown with XL badges

This PR fixes an overflow styling issue when markdown contains badges that exceed the width of the container, as reported in <elastic#213228>.

It also hides the `Load query` and `Save query` menu items from the filter popup menu in the settings flyout.

![scrollable details](https://github.com/user-attachments/assets/bb895de2-cade-4f89-8dcd-643349eca115)

#### Details

- The overflow issue is fixed by enabling horizontal scrolling when badges exceed the width of the markdown container, as illustrated by the before and after screenshots below:

**Before**

![details before](https://github.com/user-attachments/assets/e6698b38-2899-4ded-84f1-ad0d00418245)

**After**

![details after](https://github.com/user-attachments/assets/35e387aa-659a-4b6e-b5a9-d2b0972c98b0)

- The`Load query` and `Save query` menu items in the filter popup menu are now hidden, as illustrated by the before and after screenshots of the settings flyout below:

**Before**

![filter menu before](https://github.com/user-attachments/assets/8e930247-3fec-4ff2-b4dc-0d49f7248b8f)

**After**

![filter menu after](https://github.com/user-attachments/assets/b874ff2c-8000-4f0f-a542-0366acbdcce2)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport:version Backport to applied version labels release_note:skip Skip the PR/issue when compiling release notes Team:Security Generative AI Security Generative AI Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. v8.18.0 v8.18.1 v8.19.0 v9.0.0 v9.1.0

4 participants