diff --git a/web/app/js/components/BaseTable.jsx b/web/app/js/components/BaseTable.jsx
index cba7cc277..25ae818da 100644
--- a/web/app/js/components/BaseTable.jsx
+++ b/web/app/js/components/BaseTable.jsx
@@ -8,6 +8,7 @@ import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import TableSortLabel from '@material-ui/core/TableSortLabel';
 import _ from 'lodash';
+import classNames from 'classnames';
 import { withStyles } from '@material-ui/core/styles';
 
 const styles = theme => ({
@@ -24,6 +25,10 @@ const styles = theme => ({
   inactiveSortIcon: {
     opacity: 0.4,
   },
+  denseTable: {
+    paddingRight: "8px",
+    paddingLeft: "8px"
+  }
 });
 
 class BaseTable extends React.Component {
@@ -56,14 +61,17 @@ class BaseTable extends React.Component {
     return order === 'desc' ? _.reverse(sorted) : sorted;
   }
 
-  renderHeaderCell = (col, order, orderBy, classes) => {
+  renderHeaderCell = (col, order, orderBy) => {
     let active = orderBy === col.dataIndex;
+    const { classes, padding } = this.props;
+
     if (col.sorter) {
       return (
         <TableCell
           key={col.key || col.dataIndex}
           numeric={col.isNumeric}
-          sortDirection={orderBy === col.dataIndex ? order : false}>
+          sortDirection={orderBy === col.dataIndex ? order : false}
+          className={classNames({[classes.denseTable]: padding === 'dense'})}>
           <TableSortLabel
             active={active}
             direction={active ? order : col.defaultSortOrder || 'asc'}
@@ -77,7 +85,8 @@ class BaseTable extends React.Component {
       return (
         <TableCell
           key={col.key || col.dataIndex}
-          numeric={col.isNumeric}>
+          numeric={col.isNumeric}
+          className={classNames({[classes.denseTable]: padding === 'dense'})}>
           {col.title}
         </TableCell>
       );
@@ -95,7 +104,7 @@ class BaseTable extends React.Component {
           <TableHead>
             <TableRow>
               { _.map(tableColumns, c => (
-                this.renderHeaderCell(c, order, orderBy, classes)
+                this.renderHeaderCell(c, order, orderBy)
               ))}
             </TableRow>
           </TableHead>
@@ -107,6 +116,7 @@ class BaseTable extends React.Component {
                 <TableRow key={key}>
                   { _.map(tableColumns, c => (
                     <TableCell
+                      className={classNames({[classes.denseTable]: padding === 'dense'})}
                       key={`table-${key}-${c.key || c.dataIndex}`}
                       numeric={c.isNumeric}>
                       {c.render ? c.render(d) : _.get(d, c.dataIndex)}
diff --git a/web/app/js/components/ErrorModal.jsx b/web/app/js/components/ErrorModal.jsx
index e8368239b..a89d61191 100644
--- a/web/app/js/components/ErrorModal.jsx
+++ b/web/app/js/components/ErrorModal.jsx
@@ -15,7 +15,7 @@ import _ from 'lodash';
 import { friendlyTitle } from './util/Utils.js';
 
 // max characters we display for error messages before truncating them
-const maxErrorLength = 50;
+const maxErrorLength = 500;
 
 class ErrorModal extends React.Component {
   state = {
diff --git a/web/app/js/components/ExpandableTable.jsx b/web/app/js/components/ExpandableTable.jsx
index b0181bd62..146c6d294 100644
--- a/web/app/js/components/ExpandableTable.jsx
+++ b/web/app/js/components/ExpandableTable.jsx
@@ -59,7 +59,9 @@ class ExpandableTable extends React.Component {
 
     return (
       <Paper className={classes.root}>
-        <Table className={`${classes.table} ${tableClassName}`}>
+        <Table
+          className={`${classes.table} ${tableClassName}`}
+          padding="dense">
           <TableHead>
             <TableRow>
               {
diff --git a/web/app/js/components/MetricsTable.jsx b/web/app/js/components/MetricsTable.jsx
index bd84c36f5..41ef7c330 100644
--- a/web/app/js/components/MetricsTable.jsx
+++ b/web/app/js/components/MetricsTable.jsx
@@ -105,7 +105,7 @@ const columnDefinitions = (resource, showNamespaceColumn, PrefixedLink) => {
         b.tlsRequestPercent ? b.tlsRequestPercent.get() : -1)
     },
     {
-      title: "Grafana Dashboard",
+      title: "Grafana",
       key: "grafanaDashboard",
       isNumeric: true,
       render: row => {
diff --git a/web/app/js/components/TopEventTable.jsx b/web/app/js/components/TopEventTable.jsx
index e33795cf1..1f17df3ed 100644
--- a/web/app/js/components/TopEventTable.jsx
+++ b/web/app/js/components/TopEventTable.jsx
@@ -95,7 +95,8 @@ class TopEventTable extends React.Component {
         tableColumns={columns}
         tableClassName="metric-table"
         defaultOrderBy="count"
-        defaultOrder="desc" />
+        defaultOrder="desc"
+        padding="dense" />
     );
   }
 }