chore: switch chat links to slack (#2782)

website/src/components/layout.js

@@ -8,7 +8,7 @@ import Notification from './notification';
 
 import '../css/imports/base.css';
 import '../css/imports/utilities.css';
-import '../css/imports/gitter.css';
+import '../css/imports/chat.css';
 
 const Layout = ({ children }) => {
   return (

website/src/css/imports/chat.css

@@ -0,0 +1,7 @@
+.chat-button {
+  z-index: 100;
+  position: fixed;
+  bottom: 10px;
+  right: 10px;
+  cursor: pointer;
+}

website/src/css/imports/gitter.css

@@ -1,26 +0,0 @@
-.gitter-open-chat-button {
-  &,
-  &:visited {
-    padding: $tiny $small;
-    font-family: $roboto;
-    font-size: $tiny;
-    letter-spacing: 0.5px;
-    color: $grey;
-    background-color: $green;
-    box-shadow: 0 2px 16px 0 rgba(68, 74, 87, 0.15), 0 1px 4px 0 rgba(68, 74, 87, 0.3);
-  }
-
-  &:hover {
-    background-color: $lightGreen;
-    box-shadow: 0 2px 16px 0 rgba(68, 74, 87, 0.25), 0 1px 4px 0 rgba(68, 74, 87, 0.5);
-  }
-
-  &:focus {
-    box-shadow: 0 0 6px 3px rgba(62, 160, 127, 0.6);
-    transition: none;
-  }
-
-  &:active {
-    color: $lightGrey;
-  }
-}

website/src/html.js

@@ -1,7 +1,4 @@
 import React from 'react';
-// gatsby throws some error when importing just react-sidecar.
-// Maybe because jsx file ext?
-import Gitter from 'react-sidecar/dist-modules/index.js';
 
 class HTML extends React.Component {
   render() {
@@ -27,7 +24,9 @@ class HTML extends React.Component {
           {this.props.preBodyComponents}
           <div key={'body'} id="___gatsby" dangerouslySetInnerHTML={{ __html: this.props.body }} />
           {this.props.postBodyComponents}
-          <Gitter room="netlify/NetlifyCMS" />
+          <a className="chat-button" href="/chat">
+            <img src="/img/slack.svg"/>
+          </a>
           <script src="//unpkg.com/docsearch.js@2.4.1/dist/cdn/docsearch.min.js" />
         </body>
       </html>