diff --git a/client/modules/Mobile/MobileDashboardView.jsx b/client/modules/Mobile/MobileDashboardView.jsx index aeb66d5c..7bae38f4 100644 --- a/client/modules/Mobile/MobileDashboardView.jsx +++ b/client/modules/Mobile/MobileDashboardView.jsx @@ -31,11 +31,9 @@ const ContentWrapper = styled(Content)` td ,thead button { font-size: ${remSize(10)}; - padding-left: 0; text-align: left; }; - tbody th { font-size: ${remSize(16)}; width: 100%; @@ -46,17 +44,20 @@ const ContentWrapper = styled(Content)` }; tbody td, thead th { - justify-self: stretch; + justify-self: center; align-self: flex-end; color: ${prop('primaryTextColor')} } - tbody td { justify-self: center; padding-left: ${remSize(12)}} thead th svg { margin-left: ${remSize(8)} } - tbody td:last-child { justify-self: end; text-align: end; }; - .sketches-table .sketch-list__dropdown-column { min-width: unset }; + + tbody td { justify-self: start; text-align: start; padding: 0 } + tbody td:nth-child(2) { justify-self: start; text-align: start; padding-left: ${remSize(12)}}; + tbody td:last-child { justify-self: end; text-align: end; }; + + .sketch-list__dropdown-column { width: auto; }; tbody { height: ${remSize(48)}; } @@ -65,8 +66,11 @@ const ContentWrapper = styled(Content)` background: ${prop('SketchList.background')}; } .sketches-table__row { - background: ${prop('SketchList.card.background')} !important; height: auto + background: ${prop('SketchList.card.background')} !important; + height: auto } + + tr { align-self: start; @@ -75,17 +79,18 @@ const ContentWrapper = styled(Content)` }; thead tr { - grid-template-columns: auto ${remSize(100)} ${remSize(100)} 0fr; + grid-template-columns: 1fr 1fr 1fr 0fr; } tbody tr { padding: ${remSize(8)}; border-radius: ${remSize(4)}; - grid-template-columns: 5fr 5fr 2fr; + grid-template-columns: 5fr 5fr 1fr; grid-template-areas: "name name name" "content content content"; } .loader-container { position: fixed ; padding-bottom: 32% } + `; const Subheader = styled.div`