fix - blurColor web

This commit is contained in:
Victor
2025-09-17 17:07:58 +02:00
parent f40d5c8051
commit dd8e8049c4
+13 -13
View File
@@ -1,9 +1,10 @@
import { View, Text, StyleSheet, Platform } from "react-native"; import { View, Text, StyleSheet, Platform } from 'react-native';
import React from "react"; import React from 'react';
import BorderGradient from "../BorderGradient/BorderGradient"; import BorderGradient from '../BorderGradient/BorderGradient';
import { BlurView } from "expo-blur"; import { BlurView } from 'expo-blur';
import { responsiveHeight } from "react-native-responsive-dimensions"; import { responsiveHeight } from 'react-native-responsive-dimensions';
import { useKeyboard } from "@react-native-community/hooks"; import { useKeyboard } from '@react-native-community/hooks';
import { isWeb } from '../../hooks/useLayoutType';
const ItemContainer = ({ const ItemContainer = ({
height = responsiveHeight(40), height = responsiveHeight(40),
@@ -17,7 +18,7 @@ const ItemContainer = ({
return ( return (
<BorderGradient <BorderGradient
gradientProps={{ gradientProps={{
colors: ["#FFFFFF00", "#FFFFFF"], colors: ['#FFFFFF00', '#FFFFFF'],
start: { x: 0.3, y: 0 }, start: { x: 0.3, y: 0 },
end: { x: 1, y: 1 }, end: { x: 1, y: 1 },
...gradientProps, ...gradientProps,
@@ -31,12 +32,11 @@ const ItemContainer = ({
: height, : height,
...style, ...style,
}} }}>
>
<View style={styles.blurContainer}> <View style={styles.blurContainer}>
<BlurView <BlurView
intensity={Platform.OS !== "ios" ? 10 : 40} intensity={Platform.OS !== 'ios' ? 80 : 40}
tint="dark" tint={isWeb ? 'light' : 'dark'}
style={{ flex: 1, padding: 6 }} style={{ flex: 1, padding: 6 }}
// experimentalBlurMethod={ // experimentalBlurMethod={
// Platform.OS !== "ios" ? "dimezisBlurView" : "none" // Platform.OS !== "ios" ? "dimezisBlurView" : "none"
@@ -55,7 +55,7 @@ const styles = StyleSheet.create({
borderGradientStyle: { borderGradientStyle: {
borderWidth: 1, borderWidth: 1,
borderRadius: 20, borderRadius: 20,
shadowColor: "#000", shadowColor: '#000',
shadowOffset: { shadowOffset: {
width: 0, width: 0,
height: 2, height: 2,
@@ -67,7 +67,7 @@ const styles = StyleSheet.create({
blurContainer: { blurContainer: {
flex: 1, flex: 1,
borderRadius: 20, borderRadius: 20,
overflow: "hidden", overflow: 'hidden',
zIndex: 1, zIndex: 1,
}, },
}); });