ui fixes: fix tables on mobile devices
This commit is contained in:
parent
6141d1158e
commit
baf4535318
@ -3,13 +3,18 @@ import colors from 'client/UIKit/colors';
|
||||
import { Box } from 'client/UIKit/grid';
|
||||
import React from 'react';
|
||||
import styled from 'styled-components';
|
||||
import mq from 'client/UIKit/mq';
|
||||
|
||||
// import { Button as AntButton } from 'antd';
|
||||
|
||||
const TableWrapper = styled(Box)`
|
||||
overflow-x: auto;
|
||||
table {
|
||||
${mq.desktop`
|
||||
width: 100%;
|
||||
overflow-x: none;
|
||||
`}
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border-radius: 2px 2px 0 0;
|
||||
border-collapse: separate;
|
||||
@ -39,7 +44,9 @@ const TableWrapper = styled(Box)`
|
||||
|
||||
th,
|
||||
td {
|
||||
width: 25% !important;
|
||||
${mq.desktop`
|
||||
width: 25% !important;
|
||||
`}
|
||||
position: relative;
|
||||
overflow-wrap: break-word;
|
||||
border-bottom: 1px solid ${colors.white[50]};
|
||||
|
||||
Reference in New Issue
Block a user