diff --git a/app/(tabs)/services.tsx b/app/(tabs)/services.tsx index 1cd4216..935e98b 100644 --- a/app/(tabs)/services.tsx +++ b/app/(tabs)/services.tsx @@ -5,6 +5,8 @@ import { FontAwesome5 } from '@expo/vector-icons'; import ServiceCard from '@/components/ServiceCard'; import React, { useState } from 'react'; import CurrencyConverterModal from '@/components/CurrencyConverterModal'; +import HotelBusinessCardModal from '@/components/HotelBusinessCardModal'; +import LostKeyModal from '@/components/LostKeyModal'; export default function ServicesScreen() { const [currencyModalVisible, setCurrencyModalVisible] = useState(false); @@ -54,6 +56,14 @@ export default function ServicesScreen() { visible={currencyModalVisible} onClose={() => setCurrencyModalVisible(false)} /> + setHotelModalVisible(false)} + /> + setLostKeyModalVisible(false)} + /> ); } diff --git a/components/HotelBusinessCardModal.tsx b/components/HotelBusinessCardModal.tsx new file mode 100644 index 0000000..3223cda --- /dev/null +++ b/components/HotelBusinessCardModal.tsx @@ -0,0 +1,77 @@ +import React from 'react'; +import { Modal, View, Image, StyleSheet, TouchableOpacity, Dimensions, SafeAreaView } from 'react-native'; +import { FontAwesome5 } from '@expo/vector-icons'; + +const { width, height } = Dimensions.get('window'); + +interface HotelBusinessCardModalProps { + visible: boolean; + onClose: () => void; +} + +const HotelBusinessCardModal: React.FC = ({ visible, onClose }) => { + return ( + + + + + + + + + + + + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + backgroundColor: '#f0f0f0', + }, + closeButton: { + position: 'absolute', + top: 50, + right: 20, + zIndex: 1, + }, + cardsContainer: { + justifyContent: 'center', + alignItems: 'center', + width: '100%', + }, + card: { + backgroundColor: '#e3e3e3', + borderRadius: 10, + padding: 10, + marginVertical: 15, + width: width * 0.8, + height: height * 0.3, + justifyContent: 'center', + alignItems: 'center', + shadowColor: '#000', + shadowOffset: { width: 0, height: 2 }, + shadowOpacity: 0.25, + shadowRadius: 3.84, + elevation: 5, + }, + image: { + width: '100%', + height: '100%', + resizeMode: 'contain', + }, +}); + +export default HotelBusinessCardModal; diff --git a/components/LostKeyModal.tsx b/components/LostKeyModal.tsx new file mode 100644 index 0000000..869b725 --- /dev/null +++ b/components/LostKeyModal.tsx @@ -0,0 +1,61 @@ +import React from 'react'; +import { Modal, View, Text, StyleSheet, TouchableOpacity, Dimensions } from 'react-native'; + +const { width, height } = Dimensions.get('window'); + +interface LostKeyModalProps { + visible: boolean; + onClose: () => void; +} + +const LostKeyModal: React.FC = ({ visible, onClose }) => { + return ( + + + + Mastercard + ماستركارد + + + + ); +}; + +const styles = StyleSheet.create({ + overlay: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + backgroundColor: 'rgba(0, 0, 0, 0.5)', + }, + modalContainer: { + width: width * 0.6, + padding: 20, + backgroundColor: 'white', + borderRadius: 10, + alignItems: 'center', + shadowColor: '#000', + shadowOffset: { + width: 0, + height: 2, + }, + shadowOpacity: 0.25, + shadowRadius: 3.84, + elevation: 5, + }, + text: { + fontSize: 40, + marginBottom: 10, + }, + arabicText: { + fontFamily: 'System', + writingDirection: 'rtl', + } +}); + +export default LostKeyModal; diff --git a/locales/tk.json b/locales/tk.json index 041bffc..a2400cf 100644 --- a/locales/tk.json +++ b/locales/tk.json @@ -41,6 +41,6 @@ "sarToTmt": "SAR-dan TMT-a", "Money": "Pul", "Hotel": "Otel", - "Lost room key": "Açar içinde galdy", + "Lost room key": "Açar otagyň içinde galdy", "Translator": "Perewod" }