Improve active states for admin tabs and filters
This commit is contained in:
@@ -129,7 +129,7 @@ export default function MobileBrandingPage() {
|
||||
const slug = slugParam ?? null;
|
||||
const navigate = useNavigate();
|
||||
const { t } = useTranslation('management');
|
||||
const { textStrong, muted, subtle, border, primary, accentSoft, danger, surfaceMuted, surface } = useAdminTheme();
|
||||
const { textStrong, text, muted, subtle, border, primary, accentSoft, danger, surfaceMuted, surface } = useAdminTheme();
|
||||
|
||||
const [event, setEvent] = React.useState<TenantEvent | null>(null);
|
||||
const [form, setForm] = React.useState<BrandingFormValues>(() => buildBrandingFormBase(BRANDING_FORM_DEFAULTS));
|
||||
@@ -645,13 +645,41 @@ export default function MobileBrandingPage() {
|
||||
>
|
||||
<MobileCard gap="$2">
|
||||
<Tabs.List gap="$2">
|
||||
<Tabs.Tab value="branding" flex={1} paddingVertical="$2.5" paddingHorizontal="$3" borderRadius="$4">
|
||||
<Text fontSize="$sm" fontWeight="600" textAlign="center">
|
||||
<Tabs.Tab
|
||||
value="branding"
|
||||
flex={1}
|
||||
paddingVertical="$2.5"
|
||||
paddingHorizontal="$3"
|
||||
borderRadius="$4"
|
||||
hoverStyle={{ backgroundColor: '$backgroundHover' }}
|
||||
pressStyle={{ backgroundColor: '$backgroundPress' }}
|
||||
activeStyle={{ backgroundColor: '$backgroundPress' }}
|
||||
>
|
||||
<Text
|
||||
fontSize="$sm"
|
||||
fontWeight={activeTab === 'branding' ? '700' : '600'}
|
||||
color={activeTab === 'branding' ? text : muted}
|
||||
textAlign="center"
|
||||
>
|
||||
{t('events.branding.titleShort', 'Branding')}
|
||||
</Text>
|
||||
</Tabs.Tab>
|
||||
<Tabs.Tab value="watermark" flex={1} paddingVertical="$2.5" paddingHorizontal="$3" borderRadius="$4">
|
||||
<Text fontSize="$sm" fontWeight="600" textAlign="center">
|
||||
<Tabs.Tab
|
||||
value="watermark"
|
||||
flex={1}
|
||||
paddingVertical="$2.5"
|
||||
paddingHorizontal="$3"
|
||||
borderRadius="$4"
|
||||
hoverStyle={{ backgroundColor: '$backgroundHover' }}
|
||||
pressStyle={{ backgroundColor: '$backgroundPress' }}
|
||||
activeStyle={{ backgroundColor: '$backgroundPress' }}
|
||||
>
|
||||
<Text
|
||||
fontSize="$sm"
|
||||
fontWeight={activeTab === 'watermark' ? '700' : '600'}
|
||||
color={activeTab === 'watermark' ? text : muted}
|
||||
textAlign="center"
|
||||
>
|
||||
{t('events.watermark.tab', 'Wasserzeichen')}
|
||||
</Text>
|
||||
</Tabs.Tab>
|
||||
|
||||
Reference in New Issue
Block a user