alteropen/streamyfin
1
0
Fork 0
mirror of https://github.com/streamyfin/streamyfin.git synced 2026-06-25 23:30:33 +01:00
Code Issues Actions 7 Packages Projects Releases Wiki Activity

fix(settings): tidy spacing, uniform Android row heights & toggle layout

Browse Source 
- spacing: top padding + inter-group gaps so section titles, descriptions
  and buttons no longer touch (playback buffer, audio/subtitles, music,
  marlin, kefin, streamystats, storage, hide-libraries)
- ListGroup: skip empty section titles
- SettingSwitch: cap the native Android switch in a fixed centered box so
  toggle rows match the other rows and stay put when toggled; iOS unchanged
- Appearance: move "Hide libraries" to the end of the list
This commit is contained in:
Gauvain
2026-06-24 22:21:06 +02:00
parent 91ea791663
commit 2ac664de5a
21 changed files with 128 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/list/ListGroup.tsx
View File

@@ -23,9 +23,11 @@ export const ListGroup: React.FC<PropsWithChildren<Props>> = ({
return (
<View {...props}>
<Text className='ml-4 mb-1 uppercase text-[#8E8D91] text-xs'>
{title}
</Text>
{title ? (
<Text className='ml-4 mb-1 uppercase text-[#8E8D91] text-xs'>
{title}
</Text>
) : null}
<View
style={[]}
className='flex flex-col rounded-xl overflow-hidden pl-0 bg-neutral-900'

11
components/list/ListItem.tsx
View File

@@ -1,6 +1,6 @@
import { Ionicons } from "@expo/vector-icons";
import type { PropsWithChildren, ReactNode } from "react";
import { TouchableOpacity, View, type ViewProps } from "react-native";
import { Platform, TouchableOpacity, View, type ViewProps } from "react-native";
import { Text } from "../common/Text";
interface Props extends ViewProps {
@@ -34,12 +34,17 @@ export const ListItem: React.FC<PropsWithChildren<Props>> = ({
}) => {
const effectiveSubtitle = disabledByAdmin ? "Disabled by admin" : subtitle;
const isDisabled = disabled || disabledByAdmin;
// Keep the row floor uniform; Android trims padding slightly (its native
// controls sit taller). Switch height is capped via SettingSwitch so toggle
// rows match non-toggle rows.
const rowSizing =
Platform.OS === "android" ? "min-h-[42px] py-1.5" : "min-h-[42px] py-2";
if (onPress)
return (
<TouchableOpacity
disabled={isDisabled}
onPress={onPress}
className={`flex flex-row items-center justify-between bg-neutral-900 min-h-[42px] py-2 pr-4 pl-4 ${isDisabled ? "opacity-50" : ""}`}
className={`flex flex-row items-center justify-between bg-neutral-900 ${rowSizing} pr-4 pl-4 ${isDisabled ? "opacity-50" : ""}`}
{...(viewProps as any)}
>
<ListItemContent
@@ -58,7 +63,7 @@ export const ListItem: React.FC<PropsWithChildren<Props>> = ({
);
return (
<View
className={`flex flex-row items-center justify-between bg-neutral-900 min-h-[42px] py-2 pr-4 pl-4 ${isDisabled ? "opacity-50" : ""}`}
className={`flex flex-row items-center justify-between bg-neutral-900 ${rowSizing} pr-4 pl-4 ${isDisabled ? "opacity-50" : ""}`}
{...viewProps}
>
<ListItemContent