mirror of
https://github.com/streamwall/streamwall.git
synced 2026-04-03 20:32:08 -04:00
Control layout tweaks for small grid boxes
This commit is contained in:
@@ -725,6 +725,7 @@ export function ControlUI({
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isSmall = pos.height < 200
|
||||||
return (
|
return (
|
||||||
<StyledGridPreviewBox
|
<StyledGridPreviewBox
|
||||||
color={idColor(streamId)}
|
color={idColor(streamId)}
|
||||||
@@ -740,7 +741,7 @@ export function ControlUI({
|
|||||||
isListening={isListening}
|
isListening={isListening}
|
||||||
isError={matchesState('displaying.error', state.state)}
|
isError={matchesState('displaying.error', state.state)}
|
||||||
>
|
>
|
||||||
<StyledGridInfo>
|
<StyledGridInfo className={isSmall ? 'small' : undefined}>
|
||||||
<StyledGridLabel>
|
<StyledGridLabel>
|
||||||
{streamId}
|
{streamId}
|
||||||
<OrientationIndicator
|
<OrientationIndicator
|
||||||
@@ -748,7 +749,7 @@ export function ControlUI({
|
|||||||
className={`orientation-${(data?.orientation ?? 'unknown').toLowerCase()}`}
|
className={`orientation-${(data?.orientation ?? 'unknown').toLowerCase()}`}
|
||||||
/>
|
/>
|
||||||
</StyledGridLabel>
|
</StyledGridLabel>
|
||||||
<div>{data?.source}</div>
|
{!isSmall && <div>{data?.source}</div>}
|
||||||
{data?.city && (
|
{data?.city && (
|
||||||
<StyledGridLocation>
|
<StyledGridLocation>
|
||||||
{data?.city} {data?.state}
|
{data?.city} {data?.state}
|
||||||
@@ -1514,6 +1515,10 @@ const StyledGridLabel = styled.div`
|
|||||||
.orientation-v {
|
.orientation-v {
|
||||||
margin-left: -4px;
|
margin-left: -4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
${StyledGridInfo}.small & {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
const StyledGridLocation = styled.div`
|
const StyledGridLocation = styled.div`
|
||||||
@@ -1574,7 +1579,7 @@ const StyledGridControlsContainer = styled.div`
|
|||||||
user-select: none;
|
user-select: none;
|
||||||
|
|
||||||
& > * {
|
& > * {
|
||||||
z-index: 200;
|
z-index: 1001; // Above StyledGridInfo
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user