feat(mobile): integrate QrTemplate5 with 5.png background image and dynamic texts

2026-08-21 00:52:26 +03:00
parent d2846ed628
commit b72846bd91
6 changed files with 361 additions and 0 deletions
@@ -0,0 +1,156 @@
+import Svg, { SvgProps, Image, G, Rect, Path, Text } from "react-native-svg"
+import { memo } from "react"
+const SvgComponent = (props: SvgProps) => (
+    <Svg width={380} height={500} {...props}>
+        <Image
+            width={380}
+            height={500}
+            href="arka_plan_rengini_deg\u0306is\u0327_202608210045 1.jpg"
+            preserveAspectRatio="none"
+        />
+        <G transform="translate(108 206)">
+            <Rect
+                width={164}
+                height={164}
+                fill="#fff"
+                stroke="#dce5ea"
+                strokeWidth={1.2}
+                rx={16}
+            />
+            <Path
+                fill="none"
+                stroke="#003554"
+                strokeLinecap="round"
+                strokeWidth={3}
+                d="M6 30V12a6 6 0 0 1 6-6h18m128 24V12a6 6 0 0 0-6-6h-18M6 134v18a6 6 0 0 0 6 6h18m128-24v18a6 6 0 0 1-6 6h-18"
+            />
+            <Rect
+                width={140}
+                height={140}
+                x={12}
+                y={12}
+                fill="#fafcfd"
+                stroke="#003554"
+                strokeDasharray="4 3"
+                strokeOpacity={0.2}
+                rx={10}
+            />
+            <Text
+                x={82}
+                y={87}
+                fill="#003554"
+                fontFamily="Inter, Arial, sans-serif"
+                fontSize={11}
+                fontWeight={700}
+                letterSpacing={1}
+                textAnchor="middle"
+            >
+                {"QR KOD ALANI"}
+            </Text>
+        </G>
+        <G fill="#003554" textAnchor="middle">
+            <Text
+                x={190}
+                y={50}
+                fontFamily="'Arial Black', 'Montserrat', sans-serif"
+                fontSize={13}
+                fontWeight={900}
+                letterSpacing={2}
+            >
+                {"THE"}
+            </Text>
+            <Text
+                x={190}
+                y={80}
+                fontFamily="'Arial Black', 'Impact', sans-serif"
+                fontSize={27}
+                fontWeight={900}
+                letterSpacing={0.5}
+            >
+                {"URBAN"}
+            </Text>
+            <Text
+                x={190}
+                y={110}
+                fontFamily="'Arial Black', 'Impact', sans-serif"
+                fontSize={27}
+                fontWeight={900}
+                letterSpacing={0.5}
+            >
+                {"FORK"}
+            </Text>
+            <Text
+                x={190}
+                y={148}
+                fontFamily="'Arial Black', 'Montserrat', sans-serif"
+                fontSize={15.5}
+                fontWeight={900}
+                letterSpacing={0.2}
+            >
+                {"SCAN TO VIEW"}
+            </Text>
+            <Text
+                x={190}
+                y={172}
+                fontFamily="'Arial Black', 'Montserrat', sans-serif"
+                fontSize={15.5}
+                fontWeight={900}
+                letterSpacing={0.2}
+            >
+                {"DIGITAL MENU"}
+            </Text>
+            <Text
+                x={190}
+                y={402}
+                fontFamily="'Arial Black', 'Montserrat', sans-serif"
+                fontSize={15.5}
+                fontWeight={900}
+                letterSpacing={0.8}
+            >
+                {"FRESH FLAVORS DAILY"}
+            </Text>
+            <Text
+                x={190}
+                y={420}
+                fontFamily="Inter, Arial, sans-serif"
+                fontSize={8.5}
+                fontWeight={600}
+                letterSpacing={0.2}
+            >
+                {"Contactless ordering to scancnal bresers"}
+            </Text>
+            <Text
+                x={190}
+                y={432}
+                fontFamily="Inter, Arial, sans-serif"
+                fontSize={8.5}
+                fontWeight={600}
+                letterSpacing={0.2}
+            >
+                {"and enstand mes with your menu."}
+            </Text>
+            <Text
+                x={190}
+                y={454}
+                fontFamily="'Arial Black', Inter, sans-serif"
+                fontSize={10}
+                fontWeight={900}
+                letterSpacing={0.2}
+            >
+                {"contactless ordering"}
+            </Text>
+            <Text
+                x={190}
+                y={468}
+                fontFamily="'Arial Black', Inter, sans-serif"
+                fontSize={10}
+                fontWeight={900}
+                letterSpacing={0.2}
+            >
+                {"scan with camera"}
+            </Text>
+        </G>
+    </Svg>
+)
+const Memo = memo(SvgComponent)
+export default Memo