ui fixes: fix tables on mobile devices

This commit is contained in:
Chika 2020-12-10 15:01:23 +03:00
parent 6141d1158e
commit baf4535318

View File

@ -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]};