Adding styling

src/core/client/stream/components/App.css

@@ -14,3 +14,7 @@
 .root {
   width: 100%;
 }
+
+.tabContent {
+  padding-top: var(--spacing-unit);
+}

src/core/client/stream/components/App.tsx

@@ -30,7 +30,7 @@ const App: StatelessComponent<AppProps> = props => {
         <Tab tabId="COMMENTS">Comments</Tab>
         <Tab tabId="PROFILE">My Profile</Tab>
       </TabBar>
-      <TabContent activeTab={props.activeTab}>
+      <TabContent activeTab={props.activeTab} className={styles.tabContent}>
         <TabPane tabId="COMMENTS">
           <CommentsPaneContainer />
         </TabPane>

src/core/client/stream/components/HTMLContent.tsx

@@ -1,3 +1,4 @@
+import cn from "classnames";
 import dompurify from "dompurify";
 import React, { StatelessComponent } from "react";
 
@@ -5,11 +6,15 @@ import styles from "./HTMLContent.css";
 
 interface HTMLContentProps {
   children: string;
+  className?: string;
 }
 
-const HTMLContent: StatelessComponent<HTMLContentProps> = ({ children }) => (
+const HTMLContent: StatelessComponent<HTMLContentProps> = ({
+  children,
+  className,
+}) => (
   <div
-    className={styles.root}
+    className={cn(styles.root, className)}
     dangerouslySetInnerHTML={{ __html: dompurify.sanitize(children) }}
   />
 );