From 2fd85e005f0e980aed78ed1b434af2292cf0b812 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Thu, 10 Oct 2024 16:36:26 -0400 Subject: [PATCH 1/4] re-center entity header content --- .../entityHeader/EntityHeaderContent/EntityHeaderContent.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx b/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx index 9d38915dc7..0341ce31cd 100644 --- a/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx +++ b/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx @@ -217,6 +217,7 @@ function EntityHeaderContent({ view, setView }: { view: SummaryViewsType; setVie ({ ...(view !== 'narrow' && { borderBottom: `1px solid ${theme.palette.primary.lowEmphasis}` }) })} From d649284deb0d12070035384411e936d98b6c4df4 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Thu, 10 Oct 2024 17:14:53 -0400 Subject: [PATCH 2/4] fix header bug --- context/app/static/js/components/Header/Header/Header.tsx | 5 +++-- .../components/detailPage/entityHeader/EntityHeader/style.ts | 2 +- context/app/static/js/theme/theme.tsx | 4 ++-- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/context/app/static/js/components/Header/Header/Header.tsx b/context/app/static/js/components/Header/Header/Header.tsx index fd20fa4ce0..f041e7754e 100644 --- a/context/app/static/js/components/Header/Header/Header.tsx +++ b/context/app/static/js/components/Header/Header/Header.tsx @@ -1,5 +1,6 @@ import React from 'react'; +import Box from '@mui/material/Box'; import EntityHeader from 'js/components/detailPage/entityHeader/EntityHeader'; import HeaderAppBar from '../HeaderAppBar'; import HeaderContent from '../HeaderContent'; @@ -9,12 +10,12 @@ function Header() { const { shouldDisplayHeader, ...props } = useEntityHeaderVisibility(); return ( - <> + ({ position: 'fixed', width: '100%', zIndex: theme.zIndex.header })}> {shouldDisplayHeader && } - + ); } diff --git a/context/app/static/js/components/detailPage/entityHeader/EntityHeader/style.ts b/context/app/static/js/components/detailPage/entityHeader/EntityHeader/style.ts index 8cd749ed3d..0c8d0fc0a4 100644 --- a/context/app/static/js/components/detailPage/entityHeader/EntityHeader/style.ts +++ b/context/app/static/js/components/detailPage/entityHeader/EntityHeader/style.ts @@ -7,7 +7,7 @@ const StyledPaper = styled(Paper)(({ theme }) => ({ position: 'sticky', width: '100%', top: headerHeight, - zIndex: theme.zIndex.entityHeader, + zIndex: theme.zIndex.header, })); export { StyledPaper }; diff --git a/context/app/static/js/theme/theme.tsx b/context/app/static/js/theme/theme.tsx index f79df3dfc4..eee6ac1c56 100644 --- a/context/app/static/js/theme/theme.tsx +++ b/context/app/static/js/theme/theme.tsx @@ -42,7 +42,7 @@ declare module '@mui/material/styles' { export interface ZIndex { tutorial: number; dropdownOffset: number; - entityHeader: number; + header: number; dropdown: number; visualization: number; fileBrowserHeader: number; @@ -264,7 +264,7 @@ const theme = createTheme({ zIndex: { tutorial: 1101, // one higher than AppBar zIndex provided by MUI dropdownOffset: 1001, - entityHeader: 1000, + header: 1000, dropdown: 50, visualization: 3, fileBrowserHeader: 1, From 3faef51d14eec4339c9925ab15c6d86d41a98c76 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Thu, 10 Oct 2024 17:20:40 -0400 Subject: [PATCH 3/4] add changelog --- CHANGELOG-entity-header-styling.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 CHANGELOG-entity-header-styling.md diff --git a/CHANGELOG-entity-header-styling.md b/CHANGELOG-entity-header-styling.md new file mode 100644 index 0000000000..d7f8bde1a3 --- /dev/null +++ b/CHANGELOG-entity-header-styling.md @@ -0,0 +1 @@ +- Fix Webkit-specific bugs that caused the entity header to become misaligned. \ No newline at end of file From ffa7c55d8233d958ad73ef23975918b475b9bb47 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Fri, 11 Oct 2024 11:38:26 -0400 Subject: [PATCH 4/4] Update context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx Co-authored-by: Nikolay Akhmetov --- .../entityHeader/EntityHeaderContent/EntityHeaderContent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx b/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx index 0341ce31cd..26911cd1b2 100644 --- a/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx +++ b/context/app/static/js/components/detailPage/entityHeader/EntityHeaderContent/EntityHeaderContent.tsx @@ -217,7 +217,7 @@ function EntityHeaderContent({ view, setView }: { view: SummaryViewsType; setVie ({ ...(view !== 'narrow' && { borderBottom: `1px solid ${theme.palette.primary.lowEmphasis}` }) })}