neptune/ghost-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust parent media breakpoint (#3234)

Browse Source
This commit is contained in:
Jaco Greeff 2020-07-19 21:28:37 +02:00 committed by GitHub
parent 62f63bd57d
commit cf03e360a7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/page-accounts/src/Accounts/Account.tsx
View File

@ -360,7 +360,7 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
/>
)}
</td>
<td className='address ui--media-1200'>
<td className='address ui--media-1400'>
{meta.parentAddress && (
<AddressMini value={meta.parentAddress} />
)}

4
packages/page-accounts/src/Accounts/index.tsx
View File

@ -123,7 +123,7 @@ function Overview ({ className = '', onStatusChange }: Props): React.ReactElemen
const header = useMemo(() => [
[t('accounts'), 'start', 3],
[t('parent'), 'address ui--media-1200'],
[t('parent'), 'address ui--media-1400'],
[t('type')],
[t('tags'), 'start'],
[t('transactions'), 'ui--media-1500'],
@ -135,7 +135,7 @@ function Overview ({ className = '', onStatusChange }: Props): React.ReactElemen
const footer = useMemo(() => (
<tr>
<td colSpan={3} />
<td className='ui--media-1200' />
<td className='ui--media-1400' />
<td colSpan={2} />
<td className='ui--media-1500' />
<td className='number'>

22
packages/react-components/src/AddressSmall.tsx
View File

@ -54,34 +54,38 @@ export default React.memo(styled(AddressSmall)`
.ui--AccountName {
display: inline-block;
max-width: 24rem;
max-width: 26rem;
overflow: hidden;
&.withSidebar {
cursor: help;
}
@media only screen and (max-width: 1800px) {
max-width: 22rem;
}
@media only screen and (max-width: 1700px) {
max-width: 20rem;
max-width: 24rem;
}
@media only screen and (max-width: 1600px) {
max-width: 18rem;
max-width: 22rem;
}
@media only screen and (max-width: 1500px) {
max-width: 16rem;
max-width: 20rem;
}
@media only screen and (max-width: 1400px) {
max-width: 14rem;
max-width: 18rem;
}
@media only screen and (max-width: 1300px) {
max-width: 16rem;
}
@media only screen and (max-width: 1200px) {
max-width: 14rem;
}
@media only screen and (max-width: 1200px) {
max-width: 12rem;
}
}