mobile app web view

2026-03-10 00:40:39 +07:00
parent 6f4dd88a8e
commit c9dfc681e8
45 changed files with 6539 additions and 135 deletions
@@ -0,0 +1,37 @@
+import { useTranslation } from "react-i18next";
+
+export function About() {
+  const { t } = useTranslation();
+
+  return (
+    <div className="flex flex-col items-center gap-6 p-6 max-w-[320px] text-center">
+      <h2 className="text-2xl font-bold tracking-tight">{t("about_title")}</h2>
+
+      <p className="text-sm text-muted-foreground leading-relaxed">
+        {t("about_desc")}
+      </p>
+
+      <div className="w-full flex flex-col gap-3">
+        <div className="p-4 rounded-xl bg-white/5 border border-white/10 backdrop-blur-sm">
+          <h4 className="text-xs font-bold uppercase tracking-widest text-primary mb-1">
+            {t("proto_title")}
+          </h4>
+          <p className="text-[11px] text-muted-foreground">{t("proto_desc")}</p>
+        </div>
+
+        <div className="p-4 rounded-xl bg-white/5 border border-white/10 backdrop-blur-sm">
+          <h4 className="text-xs font-bold uppercase tracking-widest text-primary mb-1">
+            {t("zk_title")}
+          </h4>
+          <p className="text-[11px] text-muted-foreground">{t("zk_desc")}</p>
+        </div>
+      </div>
+
+      <div className="text-[10px] text-muted-foreground/60 mt-2">
+        {t("version_info")}
+        <br />
+        {t("footer_text")}
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,13 @@
+import { VpnControl } from "../features/VpnControl";
+import { VpnStats } from "../features/VpnStats";
+import { CountrySelect } from "../features/CountrySelect";
+
+export function Home() {
+  return (
+    <>
+      <VpnControl />
+      <CountrySelect />
+      <VpnStats received="0" sent="0" />
+    </>
+  );
+}
@@ -0,0 +1,62 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { SettingsToggle } from "@/components/shared/SettingsToggle";
+import { ThemeToggle } from "@/features/ThemeToggle";
+import { LanguageToggle } from "@/features/ToggleLanguge";
+import { useSettings } from "@/hooks/SettingsContext";
+
+export function Settings() {
+  const { t } = useTranslation();
+  const [killSwitch, setKillSwitch] = useState(false);
+  const [stealthMode, setStealthMode] = useState(true);
+  const { reduceMotion, setReduceMotion } = useSettings();
+
+  return (
+    <div className="w-full max-w-[320px] flex flex-col gap-8 p-6 z-5">
+      <h2 className="text-xl font-bold">{t("settings")}</h2>
+
+      {/* Секция: Сеть 
+      <div className="space-y-4">
+        <h3 className="text-[10px] font-bold text-muted-foreground uppercase tracking-wider">
+          {t("section_network")}
+        </h3>
+        <SettingsToggle
+          label={t("kill_switch")}
+          description={t("kill_switch_desc")}
+          checked={killSwitch}
+          onCheckedChange={setKillSwitch}
+        />
+        <SettingsToggle
+          label={t("stealth_mode")}
+          description={t("stealth_mode_desc")}
+          checked={stealthMode}
+          onCheckedChange={setStealthMode}
+        />
+      </div>
+*/}
+      {/* Секция: Интерфейс */}
+      <div className="space-y-4">
+        <h3 className="text-[10px] font-bold text-muted-foreground uppercase tracking-wider">
+          {t("section_interface")}
+        </h3>
+
+        <SettingsToggle
+          label={t("reduce_motion")}
+          description={t("reduce_motion_desc")}
+          checked={reduceMotion}
+          onCheckedChange={setReduceMotion}
+        />
+
+        <div className="flex items-center justify-between p-4 rounded-xl bg-white/5 border border-white/10">
+          <span className="text-sm font-medium">{t("theme_toggle")}</span>
+          <ThemeToggle />
+        </div>
+
+        <div className="flex items-center justify-between p-4 rounded-xl bg-white/5 border border-white/10">
+          <span className="text-sm font-medium">{t("language_toggle")}</span>
+          <LanguageToggle />
+        </div>
+      </div>
+    </div>
+  );
+}