You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
	
	
		
	
		
			
				
				
					
						
						
						
							|  |  | import React from "react"; | 
						
						
						
							|  |  | import { connect } from "react-redux"; | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  | //assets | 
						
						
						
							|  |  | import iosImage from "./assets/ios.svg"; | 
						
						
						
							|  |  | import androidImage from "./assets/android.svg"; | 
						
						
						
							|  |  | import pwaImage from "./assets/pwa.svg"; | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  | export const CrossPlatform = ({}) => { | 
						
						
						
							|  |  |   const links = React.useMemo(() => { | 
						
						
						
							|  |  |     return [ | 
						
						
						
							|  |  |       { | 
						
						
						
							|  |  |         link: "/android", | 
						
						
						
							|  |  |         image: androidImage, | 
						
						
						
							|  |  |         width: "calc(14.43vw)", | 
						
						
						
							|  |  |         height: "calc(14.43vw * 0.4379)", | 
						
						
						
							|  |  |       }, | 
						
						
						
							|  |  |       { | 
						
						
						
							|  |  |         link: "/ios", | 
						
						
						
							|  |  |         image: iosImage, | 
						
						
						
							|  |  |         width: "calc(14.43vw * 0.8148)", | 
						
						
						
							|  |  |         height: "calc(14.43vw * 0.2554)", | 
						
						
						
							|  |  |       }, | 
						
						
						
							|  |  |       { | 
						
						
						
							|  |  |         link: "/pwa", | 
						
						
						
							|  |  |         image: pwaImage, | 
						
						
						
							|  |  |         width: "calc(14.43vw * 0.8759)", | 
						
						
						
							|  |  |         height: "calc(14.43vw * 0.2919)", | 
						
						
						
							|  |  |       }, | 
						
						
						
							|  |  |     ]; | 
						
						
						
							|  |  |   }); | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  |   return ( | 
						
						
						
							|  |  |     <div | 
						
						
						
							|  |  |       className="w-10/12 flex items-center justify-between my-28" | 
						
						
						
							|  |  |     > | 
						
						
						
							|  |  |       <div className="flex flex-col"> | 
						
						
						
							|  |  |         <strong className="text-primary-3 font-6 text-5x"> | 
						
						
						
							|  |  |           قابل استفاده برای{" "} | 
						
						
						
							|  |  |         </strong> | 
						
						
						
							|  |  |         <strong className="text-primary-6 font-6 text-2x my-2"> | 
						
						
						
							|  |  |           گوشیهای اندرویدی و آی او اس و PWA | 
						
						
						
							|  |  |         </strong> | 
						
						
						
							|  |  |       </div> | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  |       <div className="flex gap-4 items-center"> | 
						
						
						
							|  |  |         {links.map((link, index) => ( | 
						
						
						
							|  |  |           <a href={link.link} download> | 
						
						
						
							|  |  |             <img | 
						
						
						
							|  |  |               src={link.image} | 
						
						
						
							|  |  |               alt={link} | 
						
						
						
							|  |  |               key={index} | 
						
						
						
							|  |  |               style={{ | 
						
						
						
							|  |  |                 width: link.width, | 
						
						
						
							|  |  |                 height: link.height, | 
						
						
						
							|  |  |               }} | 
						
						
						
							|  |  |             /> | 
						
						
						
							|  |  |           </a> | 
						
						
						
							|  |  |         ))} | 
						
						
						
							|  |  |       </div> | 
						
						
						
							|  |  |     </div> | 
						
						
						
							|  |  |   ); | 
						
						
						
							|  |  | }; | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  | const mapStateToProps = (state) => ({}); | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  | const mapDispatchToProps = {}; | 
						
						
						
							|  |  | 
 | 
						
						
						
							|  |  | export default connect(mapStateToProps, mapDispatchToProps)(CrossPlatform);
 | 
						
						
						
							|  |  | 
 |