Misc. small fixes (#8730)

This commit is contained in:
Jaco 2023-01-08 18:08:18 +02:00 committed by GitHub
parent f84dc45704
commit 2f4f6f675e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 16 deletions

View File

@ -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);

View File

@ -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;
}
`);

View File

@ -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 {

View File

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