Change copy on jump back button in /connect (#5001) [deploy]

app/assets/stylesheets/chat.scss

@@ -1205,24 +1205,25 @@
   }
 }
 
-.jumpback{
+.chatchanneljumpback{
   position: relative;
 }
 
-.jumpback__messages{
+.chatchanneljumpback__messages{
   position: absolute;
-  bottom: 10px;
-  right: 20px;
+  bottom: 12px;
+  right: 8px;
   background: var(--theme-background, #f5f6f7);
-  border: 2px solid #111;
-  padding: 10px;
+  color: var(--theme-color, $black);
+  border: 2px solid $black;
+  padding: 7px 15px;
   border-radius: 20px;
   cursor: pointer;
-  font-size: 14px;
+  font-size: 13px;
   text-transform: uppercase;
   font-weight: bold;
 }
 
-.jumpback__hide{
+.chatchanneljumpback__hide{
   display: none;
 }

app/javascript/chat/__tests__/__snapshots__/chat.test.jsx.snap

@@ -185,17 +185,17 @@ exports[`<Chat /> should load chat 1`] = `
           />
         </div>
         <div
-          class="jumpback jumpback__hide"
+          class="chatchanneljumpback chatchanneljumpback__hide"
           id="jumpback_button"
         >
           <div
-            class="jumpback__messages"
+            class="chatchanneljumpback__messages"
             onClick={[Function]}
             onKeyUp={[Function]}
             role="button"
             tabIndex="0"
           >
-            Jump Back
+            Scroll to Bottom
           </div>
         </div>
         <div

app/javascript/chat/chat.jsx

@@ -879,9 +879,9 @@ export default class Chat extends Component {
         this.scroller.scrollHeight;
 
       if (scrolledRatio < 0.7) {
-        jumpbackButton.classList.remove('jumpback__hide');
+        jumpbackButton.classList.remove('chatchanneljumpback__hide');
       } else if (scrolledRatio > 0.8) {
-        jumpbackButton.classList.add('jumpback__hide');
+        jumpbackButton.classList.add('chatchanneljumpback__hide');
       }
 
       if (this.scroller.scrollTop === 0 && !allMessagesLoaded) {
@@ -914,7 +914,7 @@ export default class Chat extends Component {
     scrollToBottom();
     document
       .getElementById('jumpback_button')
-      .classList.remove('jumpback__hide');
+      .classList.remove('chatchanneljumpback__hide');
   };
 
   renderActiveChatChannel = (channelHeader, incomingCall) => {
@@ -935,17 +935,20 @@ export default class Chat extends Component {
             {incomingCall}
             <div className="messagelist__sentinel" id="messagelist__sentinel" />
           </div>
-          <div className="jumpback jumpback__hide" id="jumpback_button">
+          <div
+            className="chatchanneljumpback chatchanneljumpback__hide"
+            id="jumpback_button"
+          >
             <div
               role="button"
-              className="jumpback__messages"
+              className="chatchanneljumpback__messages"
               onClick={this.jumpBacktoBottom}
               tabIndex="0"
               onKeyUp={e => {
                 if (e.keyCode === 13) this.jumpBacktoBottom();
               }}
             >
-              Jump Back
+              Scroll to Bottom
             </div>
           </div>
           <div className="activechatchannel__alerts">