Add some global css classes

plugins/talk-plugin-author-menu/client/components/AuthorName.js

@@ -2,13 +2,14 @@ import React from 'react';
 import Menu from './Menu';
 import styles from './AuthorName.css';
 import {ClickOutside} from 'plugin-api/beta/client/components';
+import cn from 'classnames';
 
 export default ({data, root, asset, comment, contentSlot, menuVisible, toggleMenu, hideMenu}) => {
   return (
     <ClickOutside onClickOutside={hideMenu}>
-      <div className={styles.root}>
+      <div className={cn(styles.root, 'talk-plugin-author-menu')}>
         <button
-          className={styles.button}
+          className={cn(styles.button, 'talk-plugin-author-menu-button')}
           onClick={toggleMenu}
         >
           <span className={styles.name}>

plugins/talk-plugin-author-menu/client/components/Menu.js

@@ -1,11 +1,12 @@
 import React from 'react';
 import styles from './Menu.css';
 import {Slot} from 'plugin-api/beta/client/components';
+import cn from 'classnames';
 
 export default ({data, root, asset, comment, contentSlot}) => {
   if (contentSlot) {
     return (
-      <div className={styles.menu}>
+      <div className={cn(styles.menu, 'talk-plugin-author-menu-popup')}>
         <Slot
           fill={contentSlot}
           data={data}
@@ -16,14 +17,15 @@ export default ({data, root, asset, comment, contentSlot}) => {
   }
 
   return (
-    <div className={styles.menu}>
+    <div className={cn(styles.menu, 'talk-plugin-author-menu-popup')}>
       <Slot
+        className={cn('talk-plugin-author-menu-infos')}
         fill={'authorMenuInfos'}
         data={data}
         queryData={{asset, root, comment}}
       />
       <Slot
-        className={styles.actions}
+        className={cn(styles.actions, 'talk-plugin-author-menu-actions')}
         fill={'authorMenuActions'}
         data={data}
         queryData={{asset, root, comment}}

plugins/talk-plugin-ignore-user/client/components/IgnoreUserAction.js

@@ -1,9 +1,12 @@
 import React from 'react';
 import styles from './IgnoreUserAction.css';
 import {t} from 'plugin-api/beta/client/services';
+import cn from 'classnames';
 
 export default ({ignoreUser}) => (
-  <button className={styles.button} onClick={ignoreUser}>
+  <button
+    className={cn(styles.button, 'talk-plugin-ignore-user-action')}
+    onClick={ignoreUser}>
     {t('talk-plugin-ignore-user.ignore_user')}
   </button>
 );

plugins/talk-plugin-ignore-user/client/components/IgnoreUserConfirmation.js

@@ -1,20 +1,21 @@
 import React from 'react';
 import styles from './IgnoreUserConfirmation.css';
 import {t} from 'plugin-api/beta/client/services';
+import cn from 'classnames';
 
 export default ({ignoreUser, cancel, username}) => (
-  <aside className={styles.root}>
+  <aside className={cn(styles.root, 'talk-plugin-ignore-user-confirmation')}>
     <div className={styles.message}>
       <h1 className={styles.title}>
         {t('talk-plugin-ignore-user.confirmation_title', username)}
       </h1>
       {t('talk-plugin-ignore-user.confirmation')}
     </div>
-    <div className={styles.actions}>
-      <button className={styles.cancel} onClick={cancel}>
+    <div className={cn(styles.actions, 'talk-plugin-ignore-user-confirmation-actions')}>
+      <button className={cn(styles.cancel, 'talk-plugin-ignore-user-confirmation-cancel')} onClick={cancel}>
         {t('talk-plugin-ignore-user.cancel')}
       </button>
-      <button className={styles.button} onClick={ignoreUser}>
+      <button className={cn(styles.button, 'talk-plugin-ignore-user-confirmation-button')} onClick={ignoreUser}>
         {t('talk-plugin-ignore-user.ignore_user')}
       </button>
     </div>

plugins/talk-plugin-ignore-user/client/components/IgnoredUserSection.js

@@ -3,7 +3,7 @@ import styles from './IgnoredUserSection.css';
 import {t} from 'plugin-api/beta/client/services';
 
 export default ({ignoredUsers, stopIgnoringUser}) => (
-  <section>
+  <section className={'talk-plugin-ignore-user-section'}>
     <h3>{t('talk-plugin-ignore-user.section_title')}</h3>
     <p>{t('talk-plugin-ignore-user.section_info')}</p>
     <ul className={styles.list}>

plugins/talk-plugin-member-since/client/components/MemberSinceInfo.js

@@ -2,12 +2,13 @@ import React from 'react';
 import styles from './MemberSinceInfo.css';
 import {t} from 'plugin-api/beta/client/services';
 import {Icon} from 'plugin-api/beta/client/components/ui';
+import cn from 'classnames';
 import moment from 'moment';
 
 export default ({memberSinceDate}) => (
-  <div className={styles.root}>
-    <Icon name="date_range" className={styles.icon} />
-    <span className={styles.memberSince}>
+  <div className={cn(styles.root, 'talk-plugin-member-since')}>
+    <Icon name="date_range" className={cn(styles.icon, 'talk-plugin-member-since-icon')} />
+    <span className={cn(styles.memberSince, 'talk-plugin-member-since-date')}>
       {t('talk-plugin-member-since.member_since')}: {moment(new Date(memberSinceDate)).format('MMM DD, YYYY')}
     </span>
   </div>

pluginsa.json

@@ -0,0 +1,25 @@
+{
+  "server": [
+    "talk-plugin-auth",
+    "talk-plugin-respect",
+    "talk-plugin-offtopic",
+    "talk-plugin-facebook-auth",
+    "talk-plugin-featured-comments"
+  ],
+  "client": [
+    "talk-plugin-respect",
+    "talk-plugin-auth",
+    "talk-plugin-offtopic",
+    "talk-plugin-viewing-options",
+    "talk-plugin-comment-content",
+    "talk-plugin-permalink",
+    "talk-plugin-featured-comments",
+    "talk-plugin-sort-newest",
+    "talk-plugin-sort-oldest",
+    "talk-plugin-sort-most-respected",
+    "talk-plugin-sort-most-replied",
+    "talk-plugin-author-menu",
+    "talk-plugin-member-since",
+    "talk-plugin-ignore-user"
+  ]
+}