Misc. small fixes (#8730)
This commit is contained in:
parent
f84dc45704
commit
2f4f6f675e
@ -36,7 +36,7 @@
|
||||
--bg-sidebar: #1a1b20;
|
||||
--bg-static-extra: rgba(200, 200, 200, 0.1);
|
||||
--border-input: rgba(234, 236, 238, .15);
|
||||
--border-table: #26272c; /* #343536; */
|
||||
--border-table: #343536;
|
||||
--border-tabs: #343536;
|
||||
--color-checkbox: rgba(78, 78, 78, 0.66);
|
||||
--color-error: rgba(255, 83, 83, 0.8);
|
||||
@ -59,7 +59,7 @@
|
||||
--bg-sidebar: #fafafa;
|
||||
--bg-static-extra: rgba(200, 200, 200, 0.1);
|
||||
--border-input: rgba(34, 36, 38, .15);
|
||||
--border-table: #f5f3f1; /* #f1efed; */
|
||||
--border-table: #efedeb; /* #f1efed; */
|
||||
--border-tabs: #f1efed;
|
||||
--color-checkbox: rgba(34, 36, 38, 0.15);
|
||||
--color-error: rgba(139, 0, 0);
|
||||
|
||||
@ -119,4 +119,10 @@ export default React.memo(styled(NetworkDisplay)`
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// we jiggle our labels somewhat...
|
||||
label {
|
||||
font-size: var(--font-size-small);
|
||||
text-transform: none;
|
||||
}
|
||||
`);
|
||||
|
||||
@ -155,6 +155,7 @@ function PayButton ({ className, isAll, isDisabled, payout }: Props): React.Reac
|
||||
|
||||
export default React.memo(styled(PayButton)`
|
||||
.ui--AddressMini.padded.addressStatic {
|
||||
display: inline-block;
|
||||
padding-top: 0.5rem;
|
||||
|
||||
.ui--AddressMini-info {
|
||||
|
||||
@ -38,7 +38,6 @@ function Table ({ children, className = '', empty, emptySpinner, filter, footer,
|
||||
[bodyChildren, isEmpty, isSplit]
|
||||
);
|
||||
|
||||
const tableClassName = `${(isFixed && !isEmpty) ? 'isFixed' : 'isNotFixed'} ${isInline ? 'isInline' : ''}`;
|
||||
const headerNode = (
|
||||
<Head
|
||||
filter={filter}
|
||||
@ -49,18 +48,20 @@ function Table ({ children, className = '', empty, emptySpinner, filter, footer,
|
||||
</Head>
|
||||
);
|
||||
|
||||
const tableClassName = `${(isFixed && !isEmpty) ? 'isFixed' : 'isNotFixed'} ${isInline ? 'isInline' : ''} ${splitBody ? 'noMargin' : ''}`;
|
||||
|
||||
return (
|
||||
<div className={`ui--Table ${className} ${splitBody ? 'isSplit' : ''}`}>
|
||||
{legend}
|
||||
{splitBody
|
||||
? (
|
||||
<>
|
||||
<table className={`${tableClassName} noMargin`}>
|
||||
<table className={tableClassName}>
|
||||
{headerNode}
|
||||
</table>
|
||||
<Columar isPadded={false}>
|
||||
<Columar.Column>
|
||||
<table className={`${tableClassName} noMargin`}>
|
||||
<table className={tableClassName}>
|
||||
<Body>
|
||||
{splitBody[0]}
|
||||
</Body>
|
||||
@ -98,7 +99,7 @@ function Table ({ children, className = '', empty, emptySpinner, filter, footer,
|
||||
}
|
||||
|
||||
const BORDER_RADIUS = '0.5rem';
|
||||
const BORDER_WIDTH = '1px';
|
||||
const BORDER_SOLID = '1px solid var(--bg-page)'; // var(--border-table)
|
||||
|
||||
export default React.memo(styled(Table)`
|
||||
max-width: 100%;
|
||||
@ -185,11 +186,11 @@ export default React.memo(styled(Table)`
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
border-left: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-left: ${BORDER_SOLID};
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-right: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-right: ${BORDER_SOLID};
|
||||
}
|
||||
|
||||
label {
|
||||
@ -382,8 +383,8 @@ export default React.memo(styled(Table)`
|
||||
tr {
|
||||
&:not(.isExpanded) {
|
||||
td {
|
||||
border-top: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-bottom: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-top: ${BORDER_SOLID};
|
||||
border-bottom: ${BORDER_SOLID};
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: ${BORDER_RADIUS};
|
||||
@ -400,7 +401,7 @@ export default React.memo(styled(Table)`
|
||||
&.isExpanded {
|
||||
&.isFirst {
|
||||
td {
|
||||
border-top: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-top: ${BORDER_SOLID};
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: ${BORDER_RADIUS};
|
||||
@ -414,7 +415,7 @@ export default React.memo(styled(Table)`
|
||||
|
||||
&.isLast {
|
||||
td {
|
||||
border-bottom: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-bottom: ${BORDER_SOLID};
|
||||
|
||||
&:first-child {
|
||||
border-bottom-left-radius: ${BORDER_RADIUS};
|
||||
@ -474,7 +475,7 @@ export default React.memo(styled(Table)`
|
||||
tr {
|
||||
&:first-child {
|
||||
th {
|
||||
border-top: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-top: ${BORDER_SOLID};
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: ${BORDER_RADIUS};
|
||||
@ -488,7 +489,7 @@ export default React.memo(styled(Table)`
|
||||
|
||||
&:last-child {
|
||||
th {
|
||||
border-bottom: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-bottom: ${BORDER_SOLID};
|
||||
padding-top: 1rem;
|
||||
|
||||
&:first-child {
|
||||
@ -503,11 +504,11 @@ export default React.memo(styled(Table)`
|
||||
|
||||
th {
|
||||
&:first-child {
|
||||
border-left: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-left: ${BORDER_SOLID};
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-right: ${BORDER_WIDTH} solid var(--border-table);
|
||||
border-right: ${BORDER_SOLID};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user