feat(mobile): integrate QrTemplate8 Emerald & Gold Special with 8.jpeg background and live editing

2026-08-21 01:10:40 +03:00
parent b0645c0ac3
commit 102a9a744b
6 changed files with 387 additions and 0 deletions
@@ -0,0 +1,158 @@
+import Svg, {
+    SvgProps,
+    Path,
+    Image,
+    G,
+    Rect,
+    Circle,
+    Text,
+} from "react-native-svg"
+import { memo } from "react"
+const SvgComponent = (props: SvgProps) => (
+    <Svg width={1024} height={1024} {...props}>
+        <Path fill="#0c4443" d="M0 0h1024v1024H0z" />
+        <Image
+            width={1024}
+            height={1024}
+            href="8.jpeg"
+            preserveAspectRatio="none"
+        />
+        <G transform="translate(348 305)">
+            <Rect
+                width={328}
+                height={336}
+                fill="#f9f5eb"
+                stroke="#d1a752"
+                strokeWidth={1.5}
+                rx={16}
+            />
+            <Rect
+                width={304}
+                height={312}
+                x={12}
+                y={12}
+                fill="#faf8f2"
+                stroke="#0c4443"
+                strokeDasharray="6 4"
+                strokeOpacity={0.3}
+                strokeWidth={1.5}
+                rx={12}
+            />
+            <Circle cx={164} cy={148} r={28} fill="#0c4443" />
+            <G fill="#d1a752">
+                <Path d="M164 132.6c4.4 6.6 4.4 15.4 0 24.2-4.4-8.8-4.4-17.6 0-24.2" />
+                <Path d="M161.8 150.2c-8.8-4.4-13.2 4.4-6.6 8.8 6.6 0 8.8-6.6 6.6-8.8m4.4 0c8.8-4.4 13.2 4.4 6.6 8.8-6.6 0-8.8-6.6-6.6-8.8" />
+            </G>
+            <Text
+                x={164}
+                y={218}
+                fill="#0c4443"
+                fontFamily="Inter, Arial, sans-serif"
+                fontSize={14}
+                fontWeight={800}
+                letterSpacing={2}
+                textAnchor="middle"
+            >
+                {"QR KOD ALANI"}
+            </Text>
+        </G>
+        <Text
+            x={512}
+            y={142}
+            fill="#fff"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={52}
+            fontWeight={900}
+            letterSpacing={2}
+            textAnchor="middle"
+        >
+            {"EXPLORE OUR MENU"}
+        </Text>
+        <Path
+            stroke="#d1a752"
+            strokeLinecap="round"
+            strokeWidth={2}
+            d="M210 188h240"
+        />
+        <Text
+            x={512}
+            y={194}
+            fill="#d1a752"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={24}
+            fontWeight={900}
+            letterSpacing={2}
+            textAnchor="middle"
+        >
+            {"OR"}
+        </Text>
+        <Path
+            stroke="#d1a752"
+            strokeLinecap="round"
+            strokeWidth={2}
+            d="M574 188h240"
+        />
+        <Text
+            x={512}
+            y={242}
+            fill="#d1a752"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={44}
+            fontWeight={900}
+            letterSpacing={2}
+            textAnchor="middle"
+        >
+            {"THE DAILY SPECIALS"}
+        </Text>
+        <Text
+            x={512}
+            y={738}
+            fill="#fff"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={28}
+            fontWeight={900}
+            letterSpacing={1}
+            textAnchor="middle"
+        >
+            {"SCAN TO VIEW OUR"}
+        </Text>
+        <Text
+            x={512}
+            y={776}
+            fill="#fff"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={28}
+            fontWeight={900}
+            letterSpacing={1}
+            textAnchor="middle"
+        >
+            {"FULL MENU & SPECIALS"}
+        </Text>
+        <Text
+            x={512}
+            y={842}
+            fill="#d1a752"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={21}
+            fontWeight={900}
+            letterSpacing={1.5}
+            textAnchor="middle"
+        >
+            {"SCAN TO ORDER"}
+        </Text>
+        <Text
+            x={512}
+            y={872}
+            fill="#d1a752"
+            fontFamily="'Arial Black', 'Montserrat', sans-serif"
+            fontSize={21}
+            fontWeight={900}
+            letterSpacing={1.5}
+            textAnchor="middle"
+        >
+            {"& BROWSE"}
+        </Text>
+    </Svg>
+)
+const Memo = memo(SvgComponent)
+export default Memo