Normal view

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

@@ -1,8 +1,6 @@
 import * as React from "react";
 import { StatelessComponent } from "react";
 
-import { Flex } from "talk-ui/components";
-
 import PermalinkViewQuery from "../queries/PermalinkViewQuery";
 import StreamQuery from "../queries/StreamQuery";
 
@@ -18,11 +16,7 @@ const App: StatelessComponent<AppProps> = props => {
   ) : (
     <StreamQuery />
   );
-  return (
-    <Flex justifyContent="center" className={styles.root}>
-      {view}
-    </Flex>
-  );
+  return <div className={styles.root}>{view}</div>;
 };
 
 export default App;

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

@@ -14,7 +14,7 @@ const UserBoxUnauthenticated: StatelessComponent<
   UserBoxUnauthenticatedProps
 > = props => {
   return (
-    <Flex>
+    <Flex itemGutter>
       <Localized id="comments-userBoxUnauthenticated-joinTheConversation">
         <Typography
           className={styles.joinText}

src/core/client/ui/components/TextField/TextField.tsx

@@ -33,6 +33,10 @@ export interface TextFieldProps {
    * Placeholder
    */
   placeholder?: string;
+  /**
+   * readOnly
+   */
+  readOnly?: boolean;
 }
 
 const TextField: StatelessComponent<TextFieldProps> = props => {

src/core/client/ui/components/Typography/Typography.tsx

@@ -14,6 +14,7 @@ type Variant =
   | "heading4"
   | "bodyCopy"
   | "bodyCopyBold"
+  | "inputLabel"
   | "timestamp";
 
 // Based on Typography Component of Material UI.
@@ -133,6 +134,7 @@ Typography.defaultProps = {
     bodyCopy: "p",
     bodyCopyBold: "p",
     timestamp: "span",
+    inputLabel: "label",
   },
   noWrap: false,
   paragraph: false,