feat: settings toggle for safe areas in controls

This commit is contained in:
Fredrik Burmester
2024-12-23 10:26:15 +01:00
parent 8608ad02f7
commit dd09f3d4d9
4 changed files with 49 additions and 41 deletions

View File

@@ -258,6 +258,21 @@ export const SettingToggles: React.FC<Props> = ({ ...props }) => {
</DropdownMenu.Root>
</View>
<View className="flex flex-row items-center justify-between bg-neutral-900 p-4">
<View className="shrink">
<Text className="font-semibold">Safe area in controls</Text>
<Text className="text-xs opacity-50">
Enable safe area in video player controls
</Text>
</View>
<Switch
value={settings.safeAreaInControlsEnabled}
onValueChange={(value) =>
updateSettings({ safeAreaInControlsEnabled: value })
}
/>
</View>
<View className="flex flex-col">
<View className="flex flex-row items-center justify-between bg-neutral-900 p-4">
<View className="flex flex-col">

View File

@@ -513,8 +513,8 @@ export const Controls: React.FC<Props> = ({
style={[
{
position: "absolute",
top: insets.top,
left: insets.left,
top: settings?.safeAreaInControlsEnabled ? insets.top : 0,
left: settings?.safeAreaInControlsEnabled ? insets.left : 0,
opacity: showControls ? 1 : 0,
zIndex: 1000,
},
@@ -543,8 +543,8 @@ export const Controls: React.FC<Props> = ({
style={[
{
position: "absolute",
top: insets.top,
right: insets.right,
top: settings?.safeAreaInControlsEnabled ? insets.top : 0,
right: settings?.safeAreaInControlsEnabled ? insets.right : 0,
opacity: showControls ? 1 : 0,
},
]}
@@ -606,8 +606,8 @@ export const Controls: React.FC<Props> = ({
style={{
position: "absolute",
top: "50%", // Center vertically
left: insets.left,
right: insets.right,
left: settings?.safeAreaInControlsEnabled ? insets.left : 0,
right: settings?.safeAreaInControlsEnabled ? insets.right : 0,
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
@@ -720,9 +720,9 @@ export const Controls: React.FC<Props> = ({
style={[
{
position: "absolute",
right: insets.right,
left: insets.left,
bottom: insets.bottom,
right: settings?.safeAreaInControlsEnabled ? insets.right : 0,
left: settings?.safeAreaInControlsEnabled ? insets.left : 0,
bottom: settings?.safeAreaInControlsEnabled ? insets.bottom : 0,
},
]}
className={`flex flex-col p-4`}