💄 limit width of right-aligned cells

Author: ghalestrilo

client/modules/IDE/components/SketchList.jsx

@@ -23,9 +23,7 @@ import ArrowDownIcon from '../../../images/sort-arrow-down.svg';
 import DownFilledTriangleIcon from '../../../images/down-filled-triangle.svg';
 
 
-const formatDateCell = (date, mobile = false) =>
-  format(new Date(date), mobile ? 'MMM D, YYYY' : 'MMM D, YYYY h:mm A')
-    .replace(', ', mobile ? '\n' : ', ');
+const formatDateCell = (date, mobile = false) => format(new Date(date), mobile ? 'MMM D, YYYY' : 'MMM D, YYYY h:mm A');
 
 class SketchListRowBase extends React.Component {
   constructor(props) {

client/modules/Mobile/MobileDashboardView.jsx

@@ -20,29 +20,40 @@ import Button from '../../common/Button';
 const EXAMPLE_USERNAME = 'p5';
 
 const ContentWrapper = styled(Content)`
-  td,thead button {
+  table {
+    table-layout: fixed;
+    /* white-space: nowrap; */
+  }
+  
+  td ,thead button {
     font-size: ${remSize(10)};
     padding-left: 0;
     text-align: left;
   };
 
   thead th { padding-left: 0; }
 
-  tbody th {
+  thead th:not(:first-child) {
+    width: 48px !important;
+}
+
+  .sketches-table__row th {
     font-size: ${remSize(12)};
-    /* font-weight: bold; */
     width: 100%;
-    max-width: 70%;
+    padding-right: ${remSize(12)}
   };
 
+  .sketches-table__row td {
+    text-align: center;
+    width: ${remSize(24)} !important;
+  }
+
   .sketch-list__sort-button { padding: 0 }
   .sketches-table__row {
     height: ${remSize(48)};
   }
 
   .sketches-table-container { padding-bottom: ${remSize(160)} }
-
-  /* td.sketch-list__dropdown-column { min-width: unset; } */
 `;
 
 const FooterTab = styled(Link)`