opensource/graylog2-server
1
0
Fork 0
mirror of https://github.com/Graylog2/graylog2-server.git synced 2026-03-13 09:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve modal footer styling (#24203)

Browse Source 
* Improve modal footer styling

* Improve texting

* roll back

* add changelog
This commit is contained in:
Maksym Yadlovskyi
2025-12-10 14:18:04 +01:00
committed by GitHub
parent 679c47ecc2
commit 7aeeca3203
2 changed files with 15 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
changelog/unreleased/issue-24370.toml Normal file
View File

@@ -0,0 +1,5 @@
type = "f"
message = "Make modal footer sticky to always show modal action buttons."
pulls = ["24303"]
issues = ["24370"]

11
graylog2-web-interface/src/components/bootstrap/Modal.tsx
View File

@@ -33,6 +33,15 @@ const ModalContent = styled(MantineModal.Content)`
border-radius: 10px;
`;
const StyledModalFooter = styled(MantineModal.Body)(
({ theme }) => css`
position: sticky;
bottom: 0;
background-color: ${theme.colors.global.contentBackground};
padding: ${theme.spacings.md};
`,
);
const StyledModalRoot = styled(MantineModal.Root)<{ $scrollInContent: boolean }>(
({ theme, $scrollInContent }) => css`
--mantine-color-body: ${theme.colors.global.contentBackground};
@@ -115,6 +124,6 @@ Modal.Title = styled(MantineModal.Title)`
`;
Modal.Body = MantineModal.Body;
Modal.Footer = MantineModal.Body;
Modal.Footer = StyledModalFooter;
export default Modal;