diff --git a/apps/mobile/src/app/menu/qr.tsx b/apps/mobile/src/app/menu/qr.tsx
index 235aa40..09d9280 100644
--- a/apps/mobile/src/app/menu/qr.tsx
+++ b/apps/mobile/src/app/menu/qr.tsx
@@ -410,44 +410,78 @@ export default function QrScreen() {
- {/* Hızlı Katman Seçici (Tıklayınca Modal Açar) */}
-
-
- DÜZENLEMEK VE KONUMUNU DEĞİŞTİRMEK İÇİN TIKLAYIN:
-
+ {/* Hızlı Katman Seçici (Canlı Seçim) */}
+
+
+
+ CANLI DÜZENLENECEK ALANI SEÇİN:
+
+ {selectedEditField && (
+ setSelectedEditField(null)}
+ style={{
+ backgroundColor: "rgba(255,255,255,0.08)",
+ paddingHorizontal: 8,
+ paddingVertical: 3,
+ borderRadius: 6,
+ }}
+ >
+ Kapat
+
+ )}
+
+
{FIELD_DEFINITIONS.map(({ key, label, icon }) => {
const item = fields[key];
+ const isSelected = selectedEditField === key;
return (
setSelectedEditField(key)}
+ onPress={() => setSelectedEditField(isSelected ? null : key)}
style={({ pressed }) => ({
- backgroundColor: item.visible ? "#242429" : "#1A1A1E",
+ backgroundColor: isSelected ? "#D4AF37" : item.visible ? "#242429" : "#1A1A1E",
paddingHorizontal: 12,
paddingVertical: 9,
borderRadius: 12,
borderWidth: 1.5,
- borderColor: item.visible ? "rgba(212, 175, 55, 0.4)" : "#2B2B32",
+ borderColor: isSelected ? "#D4AF37" : item.visible ? "rgba(212, 175, 55, 0.3)" : "#2B2B32",
flexDirection: "row",
alignItems: "center",
gap: 6,
opacity: pressed ? 0.8 : 1,
})}
>
-
+
{label}
{item.offsetY ? (
-
-
+
+
{item.offsetY > 0 ? `+${item.offsetY}` : item.offsetY}px
@@ -458,421 +492,295 @@ export default function QrScreen() {
- {/* Metin & Font & Boyut Özelleştirme Kartı (Açılır/Kapanır Liste) */}
-
- setShowCustomizePanel(!showCustomizePanel)}
- style={{
- flexDirection: "row",
- alignItems: "center",
- justifyContent: "space-between",
- }}
- >
-
-
-
-
-
-
- Tüm Katmanları Listele
-
-
- Tıkla & Düzenle, dikey konum kaydırma ve font ayarı
-
-
-
-
-
+ {/* CANLI DÜZENLEYİCİ KARTI (Sayfa İçinde Anında Görsel Geri Bildirim) */}
+ {selectedEditField && (() => {
+ const def = FIELD_DEFINITIONS.find((d) => d.key === selectedEditField)!;
+ const item = fields[selectedEditField];
- {showCustomizePanel && (
-
- {FIELD_DEFINITIONS.map(({ key, label, icon }) => {
- const item = fields[key];
- return (
- setSelectedEditField(key)}
- style={({ pressed }) => ({
- backgroundColor: "#141417",
- borderRadius: 14,
- padding: 12,
- borderWidth: 1,
- borderColor: "rgba(255,255,255,0.06)",
- flexDirection: "row",
+ return (
+
+ {/* Başlık & Görünürlük */}
+
+
+
-
-
-
-
- {label}
-
-
- {item.text || "Boş"}
-
-
-
-
-
-
- {item.fontSize || 12}px
-
-
-
-
-
- );
- })}
-
- )}
-
+
+
+
+ {def.label}
+
+
- {/* Modal: Tıklanan Metin Katmanını Detaylı Düzenleme */}
- setSelectedEditField(null)}
- >
-
- {selectedEditField && (() => {
- const def = FIELD_DEFINITIONS.find((d) => d.key === selectedEditField)!;
- const item = fields[selectedEditField];
+ {/* Stantta Göster / Gizle */}
+
+
+ {item.visible ? "Görünür" : "Gizli"}
+
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: { ...prev[selectedEditField], visible: v },
+ }))
+ }
+ trackColor={{ false: "#27272A", true: "#D4AF37" }}
+ thumbColor="#FFFFFF"
+ ios_backgroundColor="#27272A"
+ />
+
+
- return (
-
- {/* Modal Başlığı & Kapat Butonu */}
-
-
-
-
- {def.label}
-
-
- setSelectedEditField(null)}
+ {item.visible && (
+ <>
+ {/* Metin Girişi (Enter ile alt satır destekli) */}
+
+
+ METİN İÇERİĞİ (ENTER İLE YENİ SATIRA GEÇEBİLİR):
+
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: { ...prev[selectedEditField], text: t },
+ }))
+ }
+ placeholder={def.placeholder}
+ placeholderTextColor="#71717A"
+ multiline
style={{
- width: 32,
- height: 32,
- borderRadius: 16,
- backgroundColor: "#242429",
- alignItems: "center",
- justifyContent: "center",
+ backgroundColor: "#121215",
+ borderWidth: 1,
+ borderColor: "rgba(255,255,255,0.12)",
+ borderRadius: 12,
+ paddingHorizontal: 12,
+ paddingVertical: 10,
+ color: "#FFFFFF",
+ fontSize: 14,
+ minHeight: 46,
}}
- >
-
-
+ />
-
- {/* Görünürlük Anahtarı */}
-
-
- Stantta Göster
+ {/* DİKEY KONUM / YUKARI - AŞAĞI TAŞIMA (offsetY) */}
+
+
+
+ DİKEY KONUM (YUKARI / AŞAĞI TAŞIMA)
+
+
+ {item.offsetY ? `${item.offsetY > 0 ? "+" : ""}${item.offsetY} px` : "Orijinal (0px)"}
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: { ...prev[selectedEditField], visible: v },
- }))
- }
- trackColor={{ false: "#27272A", true: "#D4AF37" }}
- thumbColor="#FFFFFF"
- ios_backgroundColor="#27272A"
- />
-
- {/* Metin Girişi (Multiline / Enter Destekli) */}
-
-
- METİN İÇERİĞİ (ENTER İLE YENİ SATIR)
-
-
+
+
setFields((prev) => ({
...prev,
- [selectedEditField]: { ...prev[selectedEditField], text: t },
+ [selectedEditField]: {
+ ...prev[selectedEditField],
+ offsetY: (prev[selectedEditField].offsetY || 0) - 3,
+ },
}))
}
- placeholder={def.placeholder}
- placeholderTextColor="#71717A"
- multiline
style={{
- backgroundColor: "#121215",
- borderWidth: 1,
- borderColor: "rgba(255,255,255,0.12)",
- borderRadius: 14,
- paddingHorizontal: 14,
- paddingVertical: 12,
- color: "#FFFFFF",
- fontSize: 14,
- minHeight: 60,
+ flex: 1,
+ backgroundColor: "#242429",
+ paddingVertical: 8,
+ borderRadius: 8,
+ alignItems: "center",
+ flexDirection: "row",
+ justifyContent: "center",
+ gap: 4,
}}
- />
+ >
+
+ Yukarı (-3px)
+
+
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: {
+ ...prev[selectedEditField],
+ offsetY: (prev[selectedEditField].offsetY || 0) + 3,
+ },
+ }))
+ }
+ style={{
+ flex: 1,
+ backgroundColor: "#242429",
+ paddingVertical: 8,
+ borderRadius: 8,
+ alignItems: "center",
+ flexDirection: "row",
+ justifyContent: "center",
+ gap: 4,
+ }}
+ >
+
+ Aşağı (+3px)
+
+
+ {item.offsetY ? (
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: {
+ ...prev[selectedEditField],
+ offsetY: 0,
+ },
+ }))
+ }
+ style={{
+ backgroundColor: "#3A2A2A",
+ paddingHorizontal: 12,
+ paddingVertical: 8,
+ borderRadius: 8,
+ alignItems: "center",
+ justifyContent: "center",
+ }}
+ >
+ Sıfırla
+
+ ) : null}
+
- {/* DİKEY KONUM / YUKARI - AŞAĞI TAŞIMA (offsetY) */}
-
-
-
- DİKEY KONUM (YUKARI / AŞAĞI)
-
-
- {item.offsetY ? `${item.offsetY > 0 ? "+" : ""}${item.offsetY} px` : "Orijinal (0px)"}
-
-
-
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: {
- ...prev[selectedEditField],
- offsetY: (prev[selectedEditField].offsetY || 0) - 3,
- },
- }))
- }
- style={{
- flex: 1,
- backgroundColor: "#242429",
- paddingVertical: 10,
- borderRadius: 10,
- alignItems: "center",
- flexDirection: "row",
- justifyContent: "center",
- gap: 4,
- }}
- >
-
- Yukarı (-3px)
-
-
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: {
- ...prev[selectedEditField],
- offsetY: (prev[selectedEditField].offsetY || 0) + 3,
- },
- }))
- }
- style={{
- flex: 1,
- backgroundColor: "#242429",
- paddingVertical: 10,
- borderRadius: 10,
- alignItems: "center",
- flexDirection: "row",
- justifyContent: "center",
- gap: 4,
- }}
- >
-
- Aşağı (+3px)
-
-
- {item.offsetY ? (
+ {/* YAZI TİPİ (FONT) & BOYUT YAN YANA */}
+
+
+ YAZI TİPİ (TÜRKÇE DESTEKLİ FONT)
+
+
+ {FONT_OPTIONS.map((f) => {
+ const isSelected = item.fontId === f.id;
+ return (
setFields((prev) => ({
...prev,
- [selectedEditField]: {
- ...prev[selectedEditField],
- offsetY: 0,
- },
+ [selectedEditField]: { ...prev[selectedEditField], fontId: f.id },
}))
}
style={{
- backgroundColor: "#3A2A2A",
+ backgroundColor: isSelected ? "#D4AF37" : "#242429",
paddingHorizontal: 12,
- paddingVertical: 10,
+ paddingVertical: 7,
borderRadius: 10,
- alignItems: "center",
- justifyContent: "center",
+ borderWidth: 1.5,
+ borderColor: isSelected ? "#D4AF37" : "rgba(255,255,255,0.06)",
}}
>
- Sıfırla
-
- ) : null}
-
-
-
- {/* YAZI TİPİ (FONT) SEÇİMİ */}
-
-
- YAZI TİPİ (TÜRKÇE DESTEKLİ FONT)
-
-
- {FONT_OPTIONS.map((f) => {
- const isSelected = item.fontId === f.id;
- return (
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: { ...prev[selectedEditField], fontId: f.id },
- }))
- }
+
-
- {f.label}
-
-
- );
- })}
-
-
+ {f.label}
+
+
+ );
+ })}
+
+
- {/* YAZI BOYUTU (FONT SIZE) */}
-
-
- YAZI BOYUTU
+ {/* YAZI BOYUTU (FONT SIZE) */}
+
+
+ YAZI BOYUTU:
+
+
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: {
+ ...prev[selectedEditField],
+ fontSize: Math.max(def.min, (prev[selectedEditField].fontSize || 12) - 1),
+ },
+ }))
+ }
+ style={{
+ backgroundColor: "#242429",
+ paddingHorizontal: 14,
+ paddingVertical: 6,
+ borderRadius: 8,
+ }}
+ >
+
+
+
+
+ {item.fontSize || 12} px
-
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: {
- ...prev[selectedEditField],
- fontSize: Math.max(def.min, (prev[selectedEditField].fontSize || 12) - 1),
- },
- }))
- }
- style={{
- backgroundColor: "#242429",
- paddingHorizontal: 16,
- paddingVertical: 10,
- borderRadius: 10,
- }}
- >
-
-
-
- {item.fontSize || 12} px
-
-
-
- setFields((prev) => ({
- ...prev,
- [selectedEditField]: {
- ...prev[selectedEditField],
- fontSize: Math.min(def.max, (prev[selectedEditField].fontSize || 12) + 1),
- },
- }))
- }
- style={{
- backgroundColor: "#242429",
- paddingHorizontal: 16,
- paddingVertical: 10,
- borderRadius: 10,
- }}
- >
-
-
-
+
+ setFields((prev) => ({
+ ...prev,
+ [selectedEditField]: {
+ ...prev[selectedEditField],
+ fontSize: Math.min(def.max, (prev[selectedEditField].fontSize || 12) + 1),
+ },
+ }))
+ }
+ style={{
+ backgroundColor: "#242429",
+ paddingHorizontal: 14,
+ paddingVertical: 6,
+ borderRadius: 8,
+ }}
+ >
+
+
+
+
+ )}
+
+ );
+ })()}
- {/* Kaydet & Tamamla Butonu */}
- setSelectedEditField(null)}
- style={{
- backgroundColor: "#D4AF37",
- borderRadius: 14,
- paddingVertical: 14,
- alignItems: "center",
- marginTop: 6,
- }}
- >
-
- Tamamla & Uygula
-
-
-
-
- );
- })()}
-
-
diff --git a/apps/mobile/svgcomponentlist/7.tsx b/apps/mobile/svgcomponentlist/7.tsx
new file mode 100644
index 0000000..e69de29