👌 update card fields alignment
This commit is contained in:
parent
4a1eb0e3c5
commit
9c25daac8c
3 changed files with 12 additions and 9 deletions
|
@ -214,8 +214,8 @@ class CollectionListRowBase extends React.Component {
|
|||
</span>
|
||||
</th>
|
||||
{(!mobile) && <td>{format(new Date(collection.createdAt), 'MMM D, YYYY')}</td>}
|
||||
<td>{formatDateCell(collection.updatedAt)}</td>
|
||||
<td>{(collection.items || []).length}</td>
|
||||
<td>{mobile && 'Updated: '}{formatDateCell(collection.updatedAt)}</td>
|
||||
<td>{mobile && '# sketches: '}{(collection.items || []).length}</td>
|
||||
<td className="sketch-list__dropdown-column">
|
||||
{this.renderActions()}
|
||||
</td>
|
||||
|
|
|
@ -293,8 +293,8 @@ class SketchListRowBase extends React.Component {
|
|||
<th scope="row">
|
||||
{name}
|
||||
</th>
|
||||
<td>{formatDateCell(sketch.createdAt, mobile)}</td>
|
||||
<td>{formatDateCell(sketch.updatedAt, mobile)}</td>
|
||||
<td>{mobile && 'Created: '}{formatDateCell(sketch.createdAt, mobile)}</td>
|
||||
<td>{mobile && 'Updated: '}{formatDateCell(sketch.updatedAt, mobile)}</td>
|
||||
{this.renderDropdown()}
|
||||
</tr>
|
||||
</React.Fragment>);
|
||||
|
|
|
@ -50,10 +50,13 @@ const ContentWrapper = styled(Content)`
|
|||
color: ${prop('primaryTextColor')}
|
||||
}
|
||||
|
||||
thead th svg { margin-left: ${remSize(8)}}
|
||||
tbody td { justify-self: center; padding-left: ${remSize(12)}}
|
||||
|
||||
tbody td:nth-child(2) { grid-column-start: 2 }
|
||||
tbody td:last-child { justify-self: end; text-align: end; }
|
||||
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 { height: ${remSize(48)}; }
|
||||
|
||||
|
@ -68,8 +71,8 @@ const ContentWrapper = styled(Content)`
|
|||
tr {
|
||||
align-self: start;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3,5fr) 1fr;
|
||||
grid-template-areas: "name name name name" "none content content content";
|
||||
grid-template-columns: 5fr 5fr 2fr;
|
||||
grid-template-areas: "name name name" "content content content";
|
||||
|
||||
border-radius: ${remSize(4)}; padding: ${remSize(8)};
|
||||
box-shadow: 0 0 18px 0 ${prop('shadowColor')};
|
||||
|
|
Loading…
Reference in a new issue