Mirror/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2025-01-18 20:21:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix host filter overflow on small displays

Browse Source
This commit is contained in:
Reckless_Satoshi 2024-01-24 13:25:51 +00:00
parent bee30eafa9
commit edbc290fb4
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
1 changed files with 54 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

106
frontend/src/components/BookTable/BookControl.tsx
View File

@ -316,61 +316,63 @@ const BookControl = ({
) : null}
{width > large ? (
<Grid item sx={{ position: 'relative', top: '0.5em' }}>
<Typography variant='caption' color='text.secondary'>
{fav.currency === 1000 ? t(fav.type === 0 ? 'to' : 'from') : t('hosted by')}
</Typography>
</Grid>
) : null}
<Grid item>
<Select
autoWidth
sx={{
height: '2.3em',
border: '0.5px solid',
backgroundColor: theme.palette.background.paper,
borderRadius: '4px',
borderColor: 'text.disabled',
'&:hover': {
borderColor: 'text.primary',
},
}}
size='small'
label={t('Select Host')}
required={true}
value={fav.coordinator}
inputProps={{
style: { textAlign: 'center' },
}}
onChange={handleHostChange}
>
<MenuItem value='any'>
<div style={{ display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>
<FlagWithProps code='ANY' />
</div>
</MenuItem>
{Object.values(federation.coordinators).map((coordinator) =>
coordinator.enabled ? (
<MenuItem
key={coordinator.shortAlias}
value={coordinator.shortAlias}
color='text.secondary'
>
<>
<Grid item sx={{ position: 'relative', top: '0.5em' }}>
<Typography variant='caption' color='text.secondary'>
{fav.currency === 1000 ? t(fav.type === 0 ? 'to' : 'from') : t('hosted by')}
</Typography>
</Grid>
<Grid item>
<Select
autoWidth
sx={{
height: '2.3em',
border: '0.5px solid',
backgroundColor: theme.palette.background.paper,
borderRadius: '4px',
borderColor: 'text.disabled',
'&:hover': {
borderColor: 'text.primary',
},
}}
size='small'
label={t('Select Host')}
required={true}
value={fav.coordinator}
inputProps={{
style: { textAlign: 'center' },
}}
onChange={handleHostChange}
>
<MenuItem value='any'>
<div style={{ display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>
<RobotAvatar
shortAlias={coordinator.shortAlias}
style={{ width: '1.55em', height: '1.55em' }}
smooth={true}
small={true}
/>
<FlagWithProps code='ANY' />
</div>
</MenuItem>
) : (
<></>
),
)}
</Select>
</Grid>
{Object.values(federation.coordinators).map((coordinator) =>
coordinator.enabled ? (
<MenuItem
key={coordinator.shortAlias}
value={coordinator.shortAlias}
color='text.secondary'
>
<div style={{ display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>
<RobotAvatar
shortAlias={coordinator.shortAlias}
style={{ width: '1.55em', height: '1.55em' }}
smooth={true}
small={true}
/>
</div>
</MenuItem>
) : (
<></>
),
)}
</Select>
</Grid>
</>
) : null}
</Grid>
<Divider />
</Box>