From 203707124c87b36d5d4595d5e4c830ab23f24a38 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Fri, 4 Aug 2017 16:55:02 +0700
Subject: [PATCH] More css classes

---
 client/coral-embed-stream/src/components/Toggleable.js | 10 +++++-----
 .../coral-embed-stream/src/components/TopRightMenu.js  |  2 +-
 .../talk-plugin-auth/client/components/SignInButton.js |  2 +-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/client/coral-embed-stream/src/components/Toggleable.js b/client/coral-embed-stream/src/components/Toggleable.js
index 1c70f2468..49f2a701b 100644
--- a/client/coral-embed-stream/src/components/Toggleable.js
+++ b/client/coral-embed-stream/src/components/Toggleable.js
@@ -1,10 +1,10 @@
 import React from 'react';
 import ClickOutside from 'coral-framework/components/ClickOutside';
 import styles from './Toggleable.css';
-import classnames from 'classnames';
+import cn from 'classnames';
 
-const upArrow = <span className={classnames(styles.chevron, styles.up)}></span>;
-const downArrow = <span className={classnames(styles.chevron, styles.down)}></span>;
+const upArrow = <span className={cn(styles.chevron, styles.up)}></span>;
+const downArrow = <span className={cn(styles.chevron, styles.down)}></span>;
 
 export default class Toggleable extends React.Component {
   constructor(props) {
@@ -23,11 +23,11 @@ export default class Toggleable extends React.Component {
   }
 
   render() {
-    const {children} = this.props;
+    const {children, className, ...rest} = this.props;
     const {isOpen} = this.state;
     return (
       <ClickOutside onClickOutside={this.close}>
-        <span className={styles.Toggleable}>
+        <span {...rest} className={cn(className, styles.Toggleable)} >
           <button className={styles.toggler} onClick={this.toggle}>{isOpen ? upArrow : downArrow}</button>
           {isOpen ? children : null}
         </span>
diff --git a/client/coral-embed-stream/src/components/TopRightMenu.js b/client/coral-embed-stream/src/components/TopRightMenu.js
index 4cd544379..64acb2290 100644
--- a/client/coral-embed-stream/src/components/TopRightMenu.js
+++ b/client/coral-embed-stream/src/components/TopRightMenu.js
@@ -45,7 +45,7 @@ export class TopRightMenu extends React.Component {
       }
     };
     return (
-      <Toggleable key={this.state.timesReset}>
+      <Toggleable key={this.state.timesReset} className="talk-stream-comment-chevron">
         <div style={{position: 'absolute', right: 0, zIndex: 1}}>
           <IgnoreUserWizard
             user={comment.user}
diff --git a/plugins/talk-plugin-auth/client/components/SignInButton.js b/plugins/talk-plugin-auth/client/components/SignInButton.js
index 944796e88..0adb300a7 100644
--- a/plugins/talk-plugin-auth/client/components/SignInButton.js
+++ b/plugins/talk-plugin-auth/client/components/SignInButton.js
@@ -6,7 +6,7 @@ import {showSignInDialog} from 'coral-framework/actions/auth';
 import t from 'coral-framework/services/i18n';
 
 const SignInButton = ({loggedIn, showSignInDialog}) => (
-  <div>
+  <div className="talk-stream-auth-sign-in-button">
     {!loggedIn
       ? <Button id="coralSignInButton" onClick={showSignInDialog} full>
           {t('sign_in.sign_in_to_comment')}