diff --git a/packages/grafana-ui/src/components/Modal/getModalStyles.ts b/packages/grafana-ui/src/components/Modal/getModalStyles.ts index c1a229cc33f..9774a3943ff 100644 --- a/packages/grafana-ui/src/components/Modal/getModalStyles.ts +++ b/packages/grafana-ui/src/components/Modal/getModalStyles.ts @@ -68,9 +68,7 @@ export const getModalStyles = stylesFactory((theme: GrafanaTheme2) => { `, modalContent: css` padding: ${theme.spacing(3)}; - overflow: auto; width: 100%; - max-height: calc(90vh - ${theme.spacing(4)}); `, modalButtonRow: css` padding-top: ${theme.spacing(3)}; diff --git a/public/app/core/components/OrgSwitcher.tsx b/public/app/core/components/OrgSwitcher.tsx index a9337bf84bd..861e455218e 100644 --- a/public/app/core/components/OrgSwitcher.tsx +++ b/public/app/core/components/OrgSwitcher.tsx @@ -2,10 +2,11 @@ import React from 'react'; import { getBackendSrv } from '@grafana/runtime'; import { UserOrgDTO } from '@grafana/data'; -import { Modal, Button } from '@grafana/ui'; +import { Modal, Button, CustomScrollbar } from '@grafana/ui'; import { contextSrv } from 'app/core/services/context_srv'; import config from 'app/core/config'; +import { css } from '@emotion/css'; interface Props { onDismiss: () => void; @@ -43,35 +44,47 @@ export class OrgSwitcher extends React.PureComponent { const { orgs } = this.state; const currentOrgId = contextSrv.user.orgId; + const contentClassName = css({ + display: 'flex', + maxHeight: 'calc(85vh - 42px)', + }); return ( - - - - - - - - - - {orgs.map((org) => ( - - - - + + +
NameRole -
{org.name}{org.role} - {org.orgId === currentOrgId ? ( - - ) : ( - - )} -
+ + + + + - ))} - -
NameRole
+ + + {orgs.map((org) => ( + + {org.name} + {org.role} + + {org.orgId === currentOrgId ? ( + + ) : ( + + )} + + + ))} + + +
); }