add role diff calculations, add action buttons, fix a few regressions

UI/src/components/servers/Navigation.js

@@ -3,6 +3,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'
 import PropTypes from 'prop-types'
 import ServerCard from './ServerCard'
 import UserCard from './UserCard'
+import { Scrollbars } from 'react-custom-scrollbars';
 
 class ServersNavigation extends Component {
   static propTypes = {
@@ -16,12 +17,14 @@ class ServersNavigation extends Component {
     return <Fragment>
       <UserCard user={this.props.user} />
       <div className={this.props.className}>
-        { 
-          this.props.servers.reduce((acc, s, i) => {
-            acc.push(<ServerCard server={s} user={this.props.user} key={i} />)
-            return acc
-          }, [])
-        }
+        <Scrollbars autoHeight autoHeightMax='calc(100vh - 180px)'>
+          { 
+            this.props.servers.reduce((acc, s, i) => {
+              acc.push(<ServerCard server={s} user={this.props.user} key={i} />)
+              return acc
+            }, [])
+          }
+        </Scrollbars>
       </div>
     </Fragment>
   }

UI/src/components/servers/index.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react'
 import { Route } from 'react-router-dom'
+import { Scrollbars } from 'react-custom-scrollbars'
 import { connect } from 'react-redux'
 import './index.sass'
 
@@ -21,10 +22,12 @@ class Servers extends Component {
   render () {
     return <div className="servers">
       <Navigation className="servers__nav" servers={this.props.servers} user={this.props.user} />
-      <div className="servers__content">
-        <Route path='/s/:server' component={RolePicker} />
-        <Route path='/s/:server/edit' component={RolePicker} />
-      </div>
+        <div className="servers__content">
+          <Scrollbars autoHeight autoHeightMax='calc(100vh - 80px)'>
+            <Route path='/s/:server' component={RolePicker} />
+            <Route path='/s/:server/edit' component={RolePicker} />
+          </Scrollbars>
+        </div>
     </div>
   }
 }

UI/src/components/servers/index.sass

@@ -10,13 +10,17 @@
 
   &__nav
     grid-area: listing
-    overflow-y: scroll
-    height: $fullH
-
-
+    overflow: hidden
+    // height: $fullH
+  
   &__content
-    grid-area: content
     background-color: var(--c-3)
-    padding: 15px
-    overflow-y: scroll
+    // padding: 15px
+    grid-area: content
+    position: relative
+    // height: $fullH 
+    overflow: hidden
     box-sizing: border-box
+
+    .inner
+      padding: 15px