Merge pull request #16862 from newrelic/liz/fix-top-padding

Padding adjustments
newrelic · Apr 12, 2024 · b6380ad · b6380ad
2 parents 4137194 + dd1e287
commit b6380ad
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 5 deletions.
diff --git a/src/components/MachineTranslationCallout.js b/src/components/MachineTranslationCallout.js
@@ -17,7 +17,7 @@ const MachineTranslationCallout = ({ englishHref }) => {
       variant="important"
       title=" "
       css={css`
-        margin: 2em 0;
+        margin-bottom: 2em;
         padding: 0.5em;
       `}
     >
@@ -40,8 +40,12 @@ const MachineTranslationCallout = ({ englishHref }) => {
           }
         `}
       >
-        <Icon name="globe" size="2em" />
-        <div>
+        <Icon name="globe" size="3em" />
+        <div
+          css={css`
+            font-size: 0.875em;
+          `}
+        >
           <h4>{t('machineTranslation.calloutHeading')}</h4>
           <Trans i18nKey="machineTranslation.calloutBody" parent="p">
             In the event of any inconsistency between the English version and

diff --git a/src/components/PageTitle.js b/src/components/PageTitle.js
@@ -6,6 +6,11 @@ const PageTitle = (props) => (
   <h1
     css={css`
       grid-area: page-title;
+      &::before {
+        content: '';
+        display: block;
+        margin-top: -5px;
+      }
     `}
     {...props}
   />

diff --git a/src/layouts/MainLayout.js b/src/layouts/MainLayout.js
@@ -241,6 +241,7 @@ const MainLayout = ({ children, pageContext }) => {
                 css={css`
                   display: ${isMobileNavOpen ? 'none' : 'block'};
                   position: relative;
+                  padding-top: 2.75rem;
 
                   @media (min-width: 760px) {
                     ${!sidebar &&

diff --git a/src/templates/docPage.js b/src/templates/docPage.js
@@ -90,7 +90,7 @@ const BasicDoc = ({ data, location, pageContext }) => {
         css={css`
           display: grid;
           grid-template-areas:
-            'mt-disclaimer mt-disclaimer'
+            'mt-disclaimer page-tools'
             'page-title page-tools'
             'content page-tools';
           grid-template-columns: minmax(0, 1fr) 12.8125rem;
@@ -134,7 +134,7 @@ const BasicDoc = ({ data, location, pageContext }) => {
           <Layout.PageTools
             css={css`
               background: var(--primary-background-color);
-
+              top: calc(var(--global-header-height) + 3rem);
               &.page-tools-transition-enter {
                 translate: calc(var(--sidebar-width) - 50px);
               }