soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Update control room filter pill styling
Some checks failed
linter / quality (push) Has been cancelled
Details
tests / ci (push) Has been cancelled
Details
tests / ui (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Codex Agent
2026-01-20 16:20:54 +01:00
parent dd459aa381
commit 52c2aa0e9b
1 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
resources/js/admin/mobile/EventControlRoomPage.tsx
View File

@@ -344,8 +344,7 @@ export default function MobileEventControlRoomPage() {
const back = useBackNavigation(slug ? adminPath(`/mobile/events/${slug}`) : adminPath('/mobile/events'));
const infoBg = accentSoft;
const infoBorder = accent;
const activeFilterBg = accentSoft;
const activeFilterBorder = accent;
const activeFilterBg = primary;
const saveControlRoomSettings = React.useCallback(
async (nextSettings: ControlRoomSettings) => {
@@ -1418,13 +1417,16 @@ export default function MobileEventControlRoomPage() {
value={option.value}
borderRadius={999}
borderWidth={1}
borderColor={active ? activeFilterBorder : 'transparent'}
borderColor="transparent"
backgroundColor={active ? activeFilterBg : 'transparent'}
paddingVertical="$1.5"
paddingHorizontal="$3"
{...(active
? ({ style: { boxShadow: `0 8px 18px ${withAlpha(primary, 0.35)}` } } as any)
: {})}
>
<XStack alignItems="center" space="$1.5">
<Text fontSize="$xs" fontWeight="700" color={active ? primary : muted}>
<Text fontSize="$xs" fontWeight="700" color={active ? '#fff' : muted}>
{t(option.labelKey, option.fallback)}
</Text>
<XStack
@@ -1432,10 +1434,10 @@ export default function MobileEventControlRoomPage() {
paddingVertical="$0.5"
borderRadius={999}
borderWidth={1}
borderColor={active ? activeFilterBorder : border}
backgroundColor={surface}
borderColor={active ? 'transparent' : border}
backgroundColor={active ? withAlpha('#ffffff', 0.2) : surface}
>
<Text fontSize={10} fontWeight="800" color={active ? primary : muted}>
<Text fontSize={10} fontWeight="800" color={active ? '#fff' : muted}>
{count}
</Text>
</XStack>
@@ -1598,13 +1600,16 @@ export default function MobileEventControlRoomPage() {
value={option.value}
borderRadius={999}
borderWidth={1}
borderColor={active ? activeFilterBorder : 'transparent'}
borderColor="transparent"
backgroundColor={active ? activeFilterBg : 'transparent'}
paddingVertical="$1.5"
paddingHorizontal="$3"
{...(active
? ({ style: { boxShadow: `0 8px 18px ${withAlpha(primary, 0.35)}` } } as any)
: {})}
>
<XStack alignItems="center" space="$1.5">
<Text fontSize="$xs" fontWeight="700" color={active ? primary : muted}>
<Text fontSize="$xs" fontWeight="700" color={active ? '#fff' : muted}>
{t(option.labelKey, option.fallback)}
</Text>
<XStack
@@ -1612,10 +1617,10 @@ export default function MobileEventControlRoomPage() {
paddingVertical="$0.5"
borderRadius={999}
borderWidth={1}
borderColor={active ? activeFilterBorder : border}
backgroundColor={surface}
borderColor={active ? 'transparent' : border}
backgroundColor={active ? withAlpha('#ffffff', 0.2) : surface}
>
<Text fontSize={10} fontWeight="800" color={active ? primary : muted}>
<Text fontSize={10} fontWeight="800" color={active ? '#fff' : muted}>
{count}
</Text>
</XStack>