UI fixes afer homepage updates (#289)

This PR fixes a few issues across docs from recent home page updates:

- restores margin above the `.content` element and `h1` to preserve
whitespace between breadcrumbs and page content
- restores margins for all headers
- removes `height` property from labels to center-align text vertically
- comments out properties in labels that have no effect
- updates border-radius for pseudo-class labels to match other labels

Author: recrwplay

src/css/doc.css

@@ -32,7 +32,7 @@ body {
   font-weight: var(--heading-font-weight);
   hyphens: none;
   line-height: calc((var(--doc-line-height) + 1) / 2);
-  margin: 17px 0 8px;
+  margin: 2rem 0 1rem;
 }
 
 .doc h1 {
@@ -78,8 +78,8 @@ body {
 }
 
 @media screen and (min-width: 769px) {
-  .doc > .sect-header > h1.page:first-child {
-    /* margin-top: 2.5rem; */
+  .has-banner .doc > .sect-header > h1.page:first-child {
+    margin-top: 2.5rem;
   }
 }
 

src/css/docs-ndl.css

@@ -4,13 +4,13 @@
 }
 
 @media screen and (min-width: 1024px) {
-  body:not(.landing) main > .content {
+  body.docs-ndl:not(.explainer) main > .content {
     margin-top: 0;
   }
 }
 
 @media screen and (min-width: 769px) {
-  .doc > .sect-header > h1.page:first-child {
+  body.docs-ndl .doc > .sect-header > h1.page:first-child {
     margin-top: 0;
   }
 }

src/css/labels.css

@@ -84,10 +84,10 @@ h2 > .flex-label {
 
 .label {
   display: inline-block;
-  height: 24px;
+  /* height: 24px; */
   padding: 0.2rem 0.8rem;
-  justify-content: center;
-  align-items: center;
+  /* justify-content: center; */
+  /* align-items: center; */
   flex-shrink: 0;
   border-radius: 9999px;
   background: rgba(var(--colors-baltic-50));

src/css/neo4j-docs.css

@@ -118,7 +118,7 @@ span.fabric::after {
   font-size: 0.7rem;
   line-height: var(--doc-line-height);
   padding: 0.2rem 0.8rem;
-  border-radius: 0.25rem;
+  border-radius: 9999px;
   position: relative;
   bottom: 2px;
   margin-left: 0.5rem;