From 0b3dc2d25db1fed9ae61b1e058082e0c5b11b6ec Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Fri, 10 Sep 2021 17:32:56 -0400 Subject: [PATCH 1/3] fix: hremove hardcoded min height in page header Signed-off-by: Ryan Vazquez --- packages/core-components/src/layout/Header/Header.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/core-components/src/layout/Header/Header.tsx b/packages/core-components/src/layout/Header/Header.tsx index 3b2771e299..4090644403 100644 --- a/packages/core-components/src/layout/Header/Header.tsx +++ b/packages/core-components/src/layout/Header/Header.tsx @@ -22,13 +22,10 @@ import { Helmet } from 'react-helmet'; import { Link } from '../../components/Link'; import { Breadcrumbs } from '../Breadcrumbs'; -const minHeaderHeight = 118; - const useStyles = makeStyles(theme => ({ header: { gridArea: 'pageHeader', padding: theme.spacing(3), - minHeight: minHeaderHeight, width: '100%', boxShadow: '0 0 8px 3px rgba(20, 20, 20, 0.3)', position: 'relative', From 005510dabe0f07fda5e16cb232f77d53eeb35f25 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Fri, 10 Sep 2021 17:47:39 -0400 Subject: [PATCH 2/3] changeset Signed-off-by: Ryan Vazquez --- .changeset/six-crabs-sit.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/six-crabs-sit.md diff --git a/.changeset/six-crabs-sit.md b/.changeset/six-crabs-sit.md new file mode 100644 index 0000000000..9389906ee9 --- /dev/null +++ b/.changeset/six-crabs-sit.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +remove hard coded min height in page header From 87e63d8181fcfe986e29544f21016eef5f00e24c Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Sat, 11 Sep 2021 14:57:07 -0400 Subject: [PATCH 3/3] fix: remove title and wrapper margins; add subtitle margins Signed-off-by: Ryan Vazquez --- packages/core-components/src/layout/Header/Header.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/core-components/src/layout/Header/Header.tsx b/packages/core-components/src/layout/Header/Header.tsx index 4090644403..6cd3b588c2 100644 --- a/packages/core-components/src/layout/Header/Header.tsx +++ b/packages/core-components/src/layout/Header/Header.tsx @@ -41,7 +41,6 @@ const useStyles = makeStyles(theme => ({ leftItemsBox: { maxWidth: '100%', flexGrow: 1, - marginBottom: theme.spacing(1), }, rightItemsBox: { width: 'auto', @@ -50,11 +49,13 @@ const useStyles = makeStyles(theme => ({ color: theme.palette.bursts.fontColor, wordBreak: 'break-all', fontSize: 'calc(24px + 6 * ((100vw - 320px) / 680))', - marginBottom: theme.spacing(1), + marginBottom: 0, }, subtitle: { color: 'rgba(255, 255, 255, 0.8)', lineHeight: '1.0em', + display: 'inline-block', // prevents margin collapse of adjacent siblings + marginTop: theme.spacing(1), }, type: { textTransform: 'uppercase',