modified: files to ios26 ui/ux

components/discovery/TagChip.tsx

@@ -1,20 +1,45 @@
-import { FontAwesome } from "@expo/vector-icons";
+import Feather from "@expo/vector-icons/Feather";
 import React from "react";
 import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
 
-export default function TagChip({ icon, label, onPress }: { icon: any; label: string; onPress: () => void }) {
+export default function TagChip({
+  icon: _icon,
+  label,
+  onPress,
+}: {
+  icon: any;
+  label: string;
+  onPress: () => void;
+}) {
   return (
-    <TouchableOpacity onPress={onPress}>
+    <TouchableOpacity onPress={onPress} activeOpacity={0.7}>
       <View style={styles.tag}>
-        <FontAwesome name={icon} size={16} color="#bbb" style={{ marginRight: 6 }} />
         <Text style={styles.tagLabel}>{label}</Text>
-        <FontAwesome name="times-circle" size={16} color="#bbb" style={{ marginLeft: 6 }} />
+        <Feather
+          name="x"
+          size={14}
+          color="rgba(255,255,255,0.5)"
+          style={{ marginLeft: 4 }}
+        />
       </View>
     </TouchableOpacity>
   );
 }
 
 const styles = StyleSheet.create({
-  tag: { flexDirection: "row", alignItems: "center", backgroundColor: "#333", borderRadius: 999, paddingHorizontal: 10, paddingVertical: 6, marginRight: 8, marginBottom: 8 },
-  tagLabel: { color: "white" },
+  tag: {
+    flexDirection: "row",
+    alignItems: "center",
+    backgroundColor: "rgba(255,255,255,0.12)",
+    borderRadius: 8,
+    paddingHorizontal: 12,
+    paddingVertical: 7,
+    marginRight: 8,
+    marginBottom: 8,
+  },
+  tagLabel: {
+    color: "white",
+    fontSize: 15,
+    fontWeight: "400",
+  },
 });