github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-06-27 18:51:07 -04:00
Code Issues Projects Releases Packages Wiki Activity

[SecuritySolution][EA][PrivMon]Changes to replace hard coded css values to use euiTheme instead (#225307)

Browse source 
## Summary

Change to use EuiTheme instead of hardcoded css values

## Screenshot after the change:


![image](https://github.com/user-attachments/assets/e21421dc-1a84-4134-9221-69a280ca9a07)



### Checklist

Check the PR satisfies following conditions. 

Reviewers should verify this PR satisfies this list as well.

- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)
This commit is contained in:
Abhishek Bhatia 2025-06-27 18:05:23 +05:30 • committed by GitHub
parent ac8b1c5b5f
commit a88d7f02bd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 20 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

58
x-pack/solutions/security/plugins/security_solution/public/entity_analytics/components/privileged_user_monitoring/components/key_insights_panel/index.tsx
View file

@ -6,8 +6,7 @@
*/
import React from 'react';
import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
import { css } from '@emotion/react';
import { EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
import type { DataViewSpec } from '@kbn/data-views-plugin/public';
import { ActivePrivilegedUsersTile } from './active_privileged_users_tile';
@ -17,58 +16,41 @@ import { GrantedRightsTile } from './granted_rights_tile';
import { AccountSwitchesTile } from './account_switches_tile';
import { AuthenticationsTile } from './authentications_tile';
const tileStyles = css`
border: 1px solid #d3dae6;
border-radius: 6px;
padding: 12px;
height: 100%;
`;
export const KeyInsightsPanel: React.FC<{ spaceId: string; sourcerDataView: DataViewSpec }> = ({
spaceId,
sourcerDataView,
}) => {
return (
<EuiFlexGroup
wrap
css={css`
width: 100%;
gap: 16px;
& > * {
min-width: calc(33.33% - 11px) !important;
max-width: calc(33.33% - 11px) !important;
}
`}
>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexGroup wrap gutterSize="l" responsive={false}>
<EuiFlexItem>
<EuiPanel hasBorder>
<ActivePrivilegedUsersTile spaceId={spaceId} sourcerDataView={sourcerDataView} />
</div>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexItem>
<EuiPanel hasBorder>
<AlertsTriggeredTile spaceId={spaceId} />
</div>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexItem>
<EuiPanel hasBorder>
<AnomaliesDetectedTile spaceId={spaceId} />
</div>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexItem>
<EuiPanel hasBorder>
<GrantedRightsTile spaceId={spaceId} sourcerDataView={sourcerDataView} />
</div>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexItem>
<EuiPanel hasBorder>
<AccountSwitchesTile spaceId={spaceId} sourcerDataView={sourcerDataView} />
</div>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<div css={tileStyles}>
<EuiFlexItem>
<EuiPanel hasBorder>
<AuthenticationsTile spaceId={spaceId} sourcerDataView={sourcerDataView} />
</div>
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
);