fix(plugins/plugin-client-common): some small tweaks to Commentary headers would help

Fixes #5893

Author: starpit

plugins/plugin-client-common/src/components/Content/Markdown.tsx

@@ -114,7 +114,11 @@ export default class Markdown extends React.PureComponent<Props> {
               return <Link {...props} href={href} target={target} onClick={onClick} />
             }
           },
-          code: props => <CodeSnippet value={props.value} onCopy={this.onCopy.bind(this, props.value)} />,
+          code: props => (
+            <p>
+              <CodeSnippet value={props.value} onCopy={this.onCopy.bind(this, props.value)} />
+            </p>
+          ),
           heading: props => {
             const valueChild =
               props.children && props.children.length === 1

plugins/plugin-client-common/web/scss/components/Terminal/Commentary.scss

@@ -76,18 +76,26 @@
 @include Scrollback {
   @include h1 {
     font-weight: 500;
-    font-size: 2.125rem;
+    font-size: 1.875rem;
     letter-spacing: 0.32px;
-    padding: 0.5rem 1rem 0.5rem 0.25rem;
+    padding: 0.875rem 1rem 0.875rem 0.25rem;
     border-bottom: 1px solid var(--color-table-border2);
-    margin-bottom: 0.5rem;
+    margin-bottom: 0.875rem;
+
+    &:first-child {
+      padding-top: 0;
+    }
   }
 
   @include h2 {
-    font-weight: 400;
-    font-size: 1.5rem;
+    font-weight: 500;
+    font-size: 1.625rem;
     letter-spacing: 0.32px;
-    margin: 0 0 0.5rem;
+    margin: 0.5rem 0;
+
+    &:first-child {
+      margin-top: 0;
+    }
 
     &:before {
       display: none;