up

2025-06-05 10:09:29 +07:00
parent eb69d8bbc4
commit bee191d7c6
40 changed files with 69930 additions and 823 deletions
--- a/src/components/footer/Footer.tsx
+++ b/src/components/footer/Footer.tsx
@@ -0,0 +1,102 @@
+import * as React from "react";
+import { View, Text, StyleSheet, Image, TouchableOpacity } from "react-native";
+
+type FooterItemProps = {
+  label: string;
+  icon: string;
+};
+
+const FooterItem = ({ label, icon }: FooterItemProps) => (
+  <TouchableOpacity style={styles.footerItem}>
+    <Text style={styles.footerItemText}>{label}</Text>
+    <Image
+      source={{ uri: icon }}
+      style={styles.footerItemIcon}
+      resizeMode="contain"
+    />
+  </TouchableOpacity>
+);
+
+const Footer = () => {
+  return (
+    <View style={styles.container}>
+      <View style={styles.spacer} />
+      <View style={styles.content}>
+        <FooterItem
+          label="Về chúng tôi"
+          icon="https://cdn.builder.io/api/v1/image/assets/TEMP/0f5cda0be55412240422e2274330e3f6e64023d3?placeholderIfAbsent=true&apiKey=1fa9f06a1e81406d92148011750a3756"
+        />
+        <FooterItem
+          label="Tuyển dụng"
+          icon="https://cdn.builder.io/api/v1/image/assets/TEMP/0f5cda0be55412240422e2274330e3f6e64023d3?placeholderIfAbsent=true&apiKey=1fa9f06a1e81406d92148011750a3756"
+        />
+        <FooterItem
+          label="Liên kết"
+          icon="https://cdn.builder.io/api/v1/image/assets/TEMP/0f5cda0be55412240422e2274330e3f6e64023d3?placeholderIfAbsent=true&apiKey=1fa9f06a1e81406d92148011750a3756"
+        />
+        <FooterItem
+          label="Giới thiệu"
+          icon="https://cdn.builder.io/api/v1/image/assets/TEMP/5263024b89e68e21be091071a684ede939b2cbf7?placeholderIfAbsent=true&apiKey=1fa9f06a1e81406d92148011750a3756"
+        />
+        <Image
+          source={{
+            uri: "https://cdn.builder.io/api/v1/image/assets/TEMP/e7727a56c76a2e7c02cd1646e68e8b20cefb30e1?placeholderIfAbsent=true&apiKey=1fa9f06a1e81406d92148011750a3756",
+          }}
+          style={styles.logo}
+          resizeMode="contain"
+        />
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    alignSelf: "stretch",
+    marginTop: 28,
+    width: "100%",
+    paddingBottom: 21,
+  },
+  spacer: {
+    display: "flex",
+    minHeight: 10,
+    width: "100%",
+  },
+  content: {
+    marginTop: 17,
+    width: "100%",
+    paddingLeft: 10,
+    paddingRight: 10,
+  },
+  footerItem: {
+    borderRadius: 4,
+    display: "flex",
+    paddingLeft: 9,
+    paddingRight: 9,
+    paddingTop: 6,
+    paddingBottom: 13,
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: 8,
+  },
+  footerItemText: {
+    color: "#444",
+    fontFamily: "Shopee Display, -apple-system, Roboto, Helvetica, sans-serif",
+    fontSize: 13,
+    fontWeight: "700",
+  },
+  footerItemIcon: {
+    width: 11,
+    height: 6,
+    marginTop: 7,
+  },
+  logo: {
+    width: 95,
+    height: 40,
+    marginTop: 17,
+    marginLeft: 10,
+  },
+});
+
+export default Footer;