隐私 音效开关

src/App.js

@@ -186,6 +186,7 @@ const App = () => {
     //初始化
     useEffect(() => {
         appInitData();
+
         return ()=>{
 
         }

src/assets/singlesvg/sound-off.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>sound-off-filled</title>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="icon" fill="#000000" transform="translate(42.666667, 59.581722)">
+            <path d="M47.0849493,-1.42108547e-14 L298.668,251.583611 L304.101001,257.015597 L304.101,257.016 L353.573532,306.488791 C353.573732,306.488458 353.573933,306.488124 353.574133,306.48779 L384.435257,337.348961 L384.434,337.349 L409.751616,362.666662 L379.581717,392.836561 L191.749,205.003 L191.749973,369.105851 L81.0208,283.647505 L7.10542736e-15,283.647505 L7.10542736e-15,112.980838 L80.8957867,112.980838 L91.433,104.688 L16.9150553,30.169894 L47.0849493,-1.42108547e-14 Z M361.298133,28.0146513 C429.037729,103.653701 443.797162,209.394226 405.578884,298.151284 L372.628394,265.201173 C396.498256,194.197542 381.626623,113.228555 328.013013,54.642278 L361.298133,28.0146513 Z M276.912853,95.5237713 C305.539387,127.448193 318.4688,168.293162 315.701304,208.275874 L266.464558,159.040303 C261.641821,146.125608 254.316511,133.919279 244.488548,123.156461 L243.588693,122.182545 L276.912853,95.5237713 Z M191.749973,25.7516113 L191.749,84.3256113 L158.969,51.5456113 L191.749973,25.7516113 Z" id="Combined-Shape">
+
+</path>
+        </g>
+    </g>
+</svg>

src/assets/singlesvg/sound-on.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>sound-loud-filled</title>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="icon" fill="#000000" transform="translate(42.666667, 85.333333)">
+            <path d="M361.299413,341.610667 L328.014293,314.98176 C402.206933,233.906133 402.206933,109.96608 328.013013,28.8906667 L361.298133,2.26304 C447.910187,98.97536 447.908907,244.898347 361.299413,341.610667 Z M276.912853,69.77216 L243.588693,96.4309333 C283.38432,138.998613 283.38304,204.87488 243.589973,247.44256 L276.914133,274.101333 C329.118507,215.880107 329.118507,127.992107 276.912853,69.77216 Z M191.749973,1.42108547e-14 L80.8957867,87.2292267 L7.10542736e-15,87.2292267 L7.10542736e-15,257.895893 L81.0208,257.895893 L191.749973,343.35424 L191.749973,1.42108547e-14 L191.749973,1.42108547e-14 Z" id="Shape">
+
+</path>
+        </g>
+    </g>
+</svg>

src/constants/routes.js

@@ -35,6 +35,9 @@ const ROUTE_PATH={
     AGENT:"#/agent",
     AGENT_POLICY:"#/agentPolicy",
     AGENT_HISTORY:"#/agentHistory",
+    PRIVACY:"#/privacy",
+    SERVICES:"#/services",
+    KYC:"#/kyc"
 }
 
 export {

src/contexts/themeContext.js

@@ -5,6 +5,7 @@ import {APP_THEME} from "@constants/app";
 import {ROUTE_PATH} from "@constants/routes";
 import {useSelector} from "react-redux";
 import {getUserInfo, isLogined} from "@features/mainSlice";
+import SoundHelp from "@utils/SoundManger";
 
 const ThemeContext = createContext(undefined);
 
@@ -37,6 +38,8 @@ export const ThemeProvider = ({children}) => {
 
     const [installOpen,setInstallOpen]=useState(persisted&&(persisted.installOpen!=null)?persisted.installOpen:true);
 
+    const [soundOpen,setSoundOpen]=useState(persisted&&(persisted.soundOpen!=null)?persisted.soundOpen:true);
+
     const [headerHeight,setHeaderHeight]=useState('64px');
 
     //GameSearch
@@ -59,7 +62,7 @@ export const ThemeProvider = ({children}) => {
 
     //show wd pass box
     const [isShowWDPassBox,setIsShowWDPassBox]=useState(false);
-    const [isOpenSub, setIsOpenSub]=useState(false)
+    const [isOpenSub, setIsOpenSub]=useState(false);
     const isLogin=useSelector(isLogined);
     const user=useSelector(getUserInfo);
     const initWindowSize=()=>{
@@ -80,7 +83,8 @@ export const ThemeProvider = ({children}) => {
             theme,
             fontScale,
             direction,
-            installOpen
+            installOpen,
+            soundOpen
         }));
     }
 
@@ -139,6 +143,9 @@ export const ThemeProvider = ({children}) => {
     const toggleInstallOpen=()=>{
         setInstallOpen(!installOpen);
     }
+    const toggleSoundOpen=()=>{
+        setSoundOpen(!soundOpen);
+    }
 
     useEffect(() => {
 
@@ -146,6 +153,7 @@ export const ThemeProvider = ({children}) => {
         // page.style.setProperty('--widget-scale', fontScale === 1 ? '0px' : `${fontScale * 3}px`);
         page.setAttribute('dir', direction);
         savePreferences();
+        SoundHelp.setSoundOn(soundOpen);
 
         // window
         //     .matchMedia('(prefers-color-scheme: light)')
@@ -155,7 +163,7 @@ export const ThemeProvider = ({children}) => {
         //         savePreferences();
         //     })
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [theme, fontScale, direction,installOpen]);
+    }, [theme, fontScale, direction,installOpen,soundOpen]);
     useEffect(()=>{
         initWindowSize();
     },[width]);
@@ -194,7 +202,10 @@ export const ThemeProvider = ({children}) => {
                 setIsShowWDPassBox,
                 //是否打开sub
                 isOpenSub,
-                setIsOpenSub
+                setIsOpenSub,
+                //sound
+                soundOpen,
+                toggleSoundOpen,
             }}>
             {children}
         </ThemeContext.Provider>

src/db/routes.js

@@ -360,4 +360,43 @@ export const routes=[
         lpath:"#/signin",//登录path
         subs:[]
     },
+    {
+        path: "#/privacy",
+        type: 1,
+        side: 0,
+        block:1,//块排序
+        title: "Privacy Policy",
+        icon:"",
+        fill:";;",//icon 颜色 默认 选中 本身颜色
+        component:"privacy",
+        login:0,//0,1 检不检查登录
+        lpath:"#/signin",//登录path
+        subs:[]
+    },
+    {
+        path: "#/services",
+        type: 1,
+        side: 0,
+        block:1,//块排序
+        title: "Game lovers paradise",
+        icon:"",
+        fill:";;",//icon 颜色 默认 选中 本身颜色
+        component:"services",
+        login:0,//0,1 检不检查登录
+        lpath:"#/signin",//登录path
+        subs:[]
+    },
+    {
+        path: "#/kyc",
+        type: 1,
+        side: 0,
+        block:1,//块排序
+        title: "AML & KYC Policy",
+        icon:"",
+        fill:";;",//icon 颜色 默认 选中 本身颜色
+        component:"kycPolicy",
+        login:0,//0,1 检不检查登录
+        lpath:"#/signin",//登录path
+        subs:[]
+    },
 ]

src/layout/Footer/index.jsx

@@ -1,4 +1,6 @@
 import styles from './styles.module.scss';
+import {NavLink} from "react-router-dom";
+import {ROUTE_PATH} from "@constants/routes";
 const i18n=global.i18n;
 const Footer=()=>{
     const renderGameing=()=>{
@@ -34,11 +36,11 @@ const Footer=()=>{
         return (
             <div className={styles.footer_block}>
                 <div>
-                    <a href="https://cdn.ouro777.com/privacy.html">{i18n.t("footer.privacy_policy")}</a>
+                    <NavLink to={ROUTE_PATH.PRIVACY}>{i18n.t("footer.privacy_policy")}</NavLink>
                     {" | "}
-                    <a href="https://cdn.ouro777.com/service.html">{i18n.t("footer.terms_of_service")}</a>
+                    <NavLink to={ROUTE_PATH.SERVICES}>{i18n.t("footer.terms_of_service")}</NavLink>
                     {" | "}
-                    <a href="https://cdn.ouro777.com/kyc.html">{i18n.t("footer.kyc_policy")}</a>
+                    <NavLink to={ROUTE_PATH.KYC}>{i18n.t("footer.kyc_policy")}</NavLink>
                 </div>
             </div>
         )

src/layout/Layout.jsx

@@ -48,9 +48,12 @@ const Layout=()=>{
         global.msgBox=msgBoxRef.current;
     },[msgBoxRef])
     const renderIn=()=>{
+        let isShowSub=false;
+        if (isMobile()&&isOpenSub)isShowSub=true;
+        if (hash==null||hash==="")isShowSub=false;
         return (
             <>
-                <div className={`app ${isMobile()&&isOpenSub ? 'app_openSub' : ''}`} ref={appRef}>
+                <div className={`app ${isShowSub ? 'app_openSub' : ''}`} ref={appRef}>
                     <ScrollToTop/>
                     <AppContainer>
                         <div className="app_container-content d-flex flex-column flex-1">
@@ -62,7 +65,7 @@ const Layout=()=>{
                     </AppContainer>
                     <GameSearchPanel/>
                 </div>
-                <div className={`app-top  ${isMobile()&&isOpenSub ? 'app_openSub' : ''}`}>
+                <div className={`app-top  ${isShowSub ? 'app_openSub' : ''}`}>
                     <Sidebar/>
                     <Navbar/>
                     {isMobile() && <BottomNav/>}

src/locales/languages/en_US.json

@@ -132,7 +132,8 @@
     "phone": "Phone",
     "email": "Email",
     "security": "Security",
-    "install_banner": "Show Install Notice"
+    "install_banner": "Show Install Notice",
+    "sound": "Sound"
   },
   "copy_success": "Copy successful",
   "user": {

src/locales/languages/es_MX.json

@@ -130,7 +130,8 @@
     "phone": "Teléfono",
     "email": "Correo Electrónico",
     "security": "Seguridad",
-    "install_banner": "Mostrar Aviso de Instalación"
+    "install_banner": "Mostrar Aviso de Instalación",
+    "sound": "Sonido"
   },
   "copy_success": "Copia exitosa",
   "user": {

src/locales/languages/pt_BR.json

@@ -131,7 +131,8 @@
     "phone": "Telefone",
     "email": "E-mail",
     "security": "Segurança",
-    "install_banner": "Mostrar Aviso de Instalação"
+    "install_banner": "Mostrar Aviso de Instalação",
+    "sound": "Som"
   },
   "copy_success": "Cópia bem-sucedida",
   "user": {

src/locales/languages/ru_RU.json

@@ -130,7 +130,8 @@
     "phone": "Телефон",
     "email": "Электронная почта",
     "security": "Безопасность",
-    "install_banner": "Показать уведомление об установке"
+    "install_banner": "Показать уведомление об установке",
+    "sound": "Звук"
   },
   "copy_success": "Копирование успешно",
   "user": {

src/locales/languages/zh_TW.json

@@ -130,7 +130,8 @@
     "phone": "電話",
     "email": "電子郵件",
     "security": "安全",
-    "install_banner": "顯示安裝通知"
+    "install_banner": "顯示安裝通知",
+    "sound": "聲音"
   },
   "copy_success": "複製成功",
   "user": {

src/pages/KycPolicy.jsx

@@ -0,0 +1,10 @@
+import WKycPolicy from "@widgets/WKycPolicy";
+
+const KycPolicy=({...props})=>{
+    return (
+        <>
+            <WKycPolicy {...props}/>
+        </>
+    )
+}
+export default KycPolicy;

src/pages/Privacy.jsx

@@ -0,0 +1,10 @@
+import WPrivacy from "@widgets/WPrivacy";
+
+const Privacy=({...props})=>{
+    return (
+        <>
+            <WPrivacy {...props}/>
+        </>
+    )
+}
+export default Privacy;

src/pages/Services.jsx

@@ -0,0 +1,10 @@
+import WServices from "@widgets/WServices";
+
+const Services=({...props})=>{
+    return (
+        <>
+            <WServices {...props}/>
+        </>
+    )
+}
+export default Services;

src/pages/index.jsx

@@ -26,6 +26,9 @@ const MoneyRain=lazy(()=>import("@pages/MoneyRain"));
 const AgentPolicy=lazy(()=>import("@pages/AgentPolicy"));
 const Agent=lazy(()=>import("@pages/Agent"));
 const AgentHistory=lazy(()=>import("@pages/AgentHistory"));
+const Privacy=lazy(()=>import("@pages/Privacy"));
+const Services=lazy(()=>import("@pages/Services"));
+const KycPolicy=lazy(()=>import("@pages/KycPolicy"));
 export default {
     ModulePage:ModulePage,
     Home:Home,
@@ -51,6 +54,9 @@ export default {
     agentPolicy:AgentPolicy,
     agent:Agent,
     agentHistory:AgentHistory,
+    privacy:Privacy,
+    services:Services,
+    kycPolicy:KycPolicy,
 }
 export const Header={
     deposit: DepositHeader,

src/utils/SoundManger.js

@@ -17,6 +17,9 @@ class SoundManger {
         window.AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext || window.msAudioContext
         this.audioContext = new window.AudioContext;
     }
+    setSoundOn(isOpen){
+        this.audioOn=isOpen;
+    }
     stopSound(name){
         let audio = this.audioBuffers[name];
         if(audio && audio.source)
@@ -26,6 +29,7 @@ class SoundManger {
         }
     }
     playSound(name,loop=false){
+        if (!this.audioOn)return;
         let audio = this.audioBuffers[name];
         if (audio)
             try {

src/widgets/UserSettings/index.jsx

@@ -15,6 +15,8 @@ import {ReactComponent as GenderIcon} from '@assets/singlesvg/gener/gender.svg';
 import {ReactComponent as MobileIcon} from '@assets/singlesvg/mobile.svg';
 import {ReactComponent as EmailIcon} from '@assets/singlesvg/email.svg';
 import {ReactComponent as InstallIcon} from "@assets/singlesvg/install.svg";
+import {ReactComponent as SoundOnIcon} from "@assets/singlesvg/sound-on.svg";
+import {ReactComponent as SoundOffIcon} from "@assets/singlesvg/sound-off.svg";
 import {CopyToClipboard} from 'react-copy-to-clipboard';
 import {toast} from "react-toastify";
 import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
@@ -35,7 +37,7 @@ const UserSettings=()=>{
     const logoutStatus=useSelector(getLogoutStatus);
     const dispatch = useDispatch();
     const navigate=useNavigate();
-    const {theme, toggleTheme,setIsShowLang,installOpen,toggleInstallOpen} = useThemeProvider();
+    const {theme, toggleTheme,setIsShowLang,installOpen,toggleInstallOpen,soundOpen,toggleSoundOpen} = useThemeProvider();
     const renderEmpty=()=>{
         return (
             <div className={styles.wrap_item}>
@@ -300,11 +302,29 @@ const UserSettings=()=>{
             </div>
         )
     }
+    const renderItemSound=()=>{
+        return (
+            <div className={styles.action_item}>
+                <div className={styles.action_left}>
+                    {
+                        soundOpen?(<SoundOnIcon className={styles.icon}></SoundOnIcon>):(<SoundOffIcon className={styles.icon}></SoundOffIcon>)
+                    }
+                    <div>{i18n.t("settings.sound")}</div>
+                </div>
+                <div className={styles.action_right}>
+                    <AntSwitch checked={soundOpen} onChange={()=>{
+                        toggleSoundOpen();
+                    }}></AntSwitch>
+                </div>
+            </div>
+        )
+    }
     const renderSetting=()=>{
         return (
             <div className={`${styles.wrap_item} ${styles.action_wrap}`}>
                 {renderItemSecurity()}
                 {renderItemInstallBanner()}
+                {renderItemSound()}
                 {renderItemLang()}
                 {/*{renderItemGender()}*/}
                 {renderItemTheme()}

src/widgets/WKycPolicy/index.jsx

@@ -0,0 +1,168 @@
+import styles from './styles.module.scss';
+import Spring from "@components/Spring";
+import Footer from "@layout/Footer";
+const WKycPolicy=({close})=>{
+    const text=[
+
+    ]
+
+    return (
+        <div className={styles.container}>
+            <Spring className={styles.content}>
+                <div className={styles.text_con}>
+                    <p>
+                        AML & KYC Policy For Cash Deposits and Cash Withdraws</p>
+                    <p>
+                        AMLI Anti-Money-Laundering policy of www.24680.com</p>
+                    <p>
+                        Introduction:</p>
+                    <p>
+                        24680.com is operated by ANGRY EVIL GAMES KFT. by ANGRY EVIL GAMES KFT. with a registration
+                        number
+                        01-09-395964 and registered office located at 1135 Budapest, Reitter Ferenc utca 27. Objective
+                        of the AML
+                        Policy: We seek to offer the highest security to all of our users and customers on 24680.com
+                        for that a
+                        three step account verification is done in order to insure the identity of our customers. The
+                        reason behind
+                        this is to prove that the details of the person registered are correct and the deposit methods
+                        used are not
+                        stolen or being used by someone else, which is to create the general framework for the fight
+                        against money
+                        laundering. We also take into accord that depending on the nationality and origin, the way of
+                        payment and
+                        for withdrawing different safety measurements must be taken. 24680.com also puts reasonable
+                        measures in
+                        place to control and limit ML risk, including dedicating the appropriate means.</p>
+                    <p>
+                    </p>
+                    <p>
+                    </p>
+                    <p>24680.com is committed to high standards of anti-money laundering (AML) according to the EU
+                        guidelines,
+                        compliance and requires management & employees to enforce these standards in preventing the use
+                        of its
+                        services for money laundering purposes.The AML program of 24680.com is designed to be
+                        compliant with : EU
+                        : “Directive 2015/849 of the European Parliament and of The Council of 20 May 2015 on the
+                        prevention of the
+                        use of the financial system for the purposes of money laundering” EU : “Regulation 2015/847 on
+                        information
+                        accompanying transfers of funds” EU : Various regulations imposing sanctions or restrictive
+                        measures against
+                        persons and embargo on certain goods and technology, including all dual-use goods BE : “Law of
+                        18 September
+                        2017 on the prevention of money laundering limitation of the use of cash
+                    </p>
+                    <p>
+                    </p>
+                    <p>Definition of money laundering:
+                    </p>
+                    <p>Money Laundering is understood as:
+                    </p>
+                    <p>
+                    </p>
+                    <p>The conversion or transfer of property, especially money, knowing that such property is derived
+                        from criminal
+                        activity or from taking part in such activity, for the purpose of concealing or disguising the
+                        illegal
+                        origin of the property or of helping any person who is involved in the commission of such an
+                        activity to
+                        evade the legal consequences of that person’s or companies action; The concealment or disguise
+                        of the true
+                        nature, source, location, disposition, movement, rights with respect to, or ownership of,
+                        property, knowing
+                        that such property is derived from criminal activity or from an act of participation in such an
+                        activity;
+                        The acquisition, possession or use of property, knowing, at the time of receipt, that such
+                        property was
+                        derived from criminal activity or from assisting in such an activity; Participation in,
+                        association to
+                        commit, attempts to commit and aiding, abetting, facilitating and counselling the commission of
+                        any of the
+                        actions referred to in points before. Money laundering shall be regarded as such even when the
+                        activities
+                        which generated the property to be laundered were carried out in the territory of another Member
+                        State or in
+                        that of a third country.
+                    </p>
+                    <p>
+                    </p>
+                    <p>Organization of the AML for 24680.com:
+                    </p>
+                    <p>In accordance with the AML legislation, 24680.com has appointed the “highest level” for the
+                        prevention of
+                        ML: The full management of ANGRY EVIL GAMES KFT. are in charge. Furthermore, an AMLCO (Anti
+                        Money Laundering
+                        Compliance Officer) is in charge of the enforcement of the AML policy and procedures within the
+                        System. The
+                        AMLCO is placed under the direct responsibility of the general Management: AML policy changes
+                        and
+                        implementation requirements: Each major change of 24680.com AML policy is subject to be
+                        approval by the
+                        general management of ANGRY EVIL GAMES KFT. and the Anti money laundering compliance officer.
+                    </p>
+                    <p><b>KYC policy of www.24680.com</b>
+                    </p>
+                    <p>There are three steps of Verification on www.24680.com:
+                    </p>
+                    <p>Step one verification:
+                    </p>
+                    <p>Step one verification must be done by every user and customer to withdraw. Regarding of the
+                        choice of
+                        payment, the amount of payment, the amount of withdraw, the choice of withdraw and nationality
+                        of the
+                        user/customer step one verification must be done first. Step one verification is a document that
+                        must be
+                        filled out by the user/customer himself. Following information’s must be filled in: first name,
+                        second name,
+                        date of birth, country of usual residence, gender and full address.
+                    </p>
+                    <p>Step two verification:
+                    </p>
+                    <p>Step two verification must be done by every user which deposit over 2000$ (two thousand Dollar)
+                        or withdraws
+                        over 2000$ (two thousand Dollar) or sends another user over 1000$ (one thousand Dollar) Until
+                        step two
+                        verification is done the withdraw, tip or deposit will be hold. Step to verification will lead
+                        the user or
+                        customer to a subpage where he must send in his ID. The user/customer must make a picture of his
+                        ID. While a
+                        paperclip with a six-digit random generated number is next to his ID: Only an official ID may be
+                        used for ID
+                        verification, depending on the country the variety of accepted IDs may be different. There will
+                        also be an
+                        electronic check if the filled in Data from the step one verification is correct. The electronic
+                        check will
+                        check via two different databanks to insure the given information’s matches with the filled
+                        document and the
+                        name from the ID: If the electronic test fails or is not possible the user/customer is required
+                        to send in a
+                        conformation of his current resident. A certificate of registration by the government or a
+                        similar document
+                        is required.
+                    </p>
+                    <p>Step three verification:
+                    </p>
+                    <p>Step three verification must be done by every user which deposit over 5000$ (five thousand Dollar
+                        or (crypto)
+                        equivalent) or withdraws over 5000$ (five thousand Dollar or (crypto) equivalent) or sends
+                        another user over
+                        3000$ (three thousand Dollar or (crypto) equivalent) Until step three verification is done the
+                        withdraw, tip
+                        or deposit will be hold. For step 3 a user/customer will be asked for a source of wealth.
+                    </p>
+                    <p>
+                    </p>
+                    <p>Contact us:
+                    </p>
+                    <p>If you have any questions or complaints about our AML Policy, please contact us by email:
+                        aries@ouro777.com
+                    </p>
+                </div>
+                <Footer/>
+            </Spring>
+        </div>
+    )
+}
+export default WKycPolicy;

src/widgets/WKycPolicy/styles.module.scss

@@ -0,0 +1,21 @@
+.container{
+  width: 100%;
+  min-height: 100%;
+  background-color: var(--widget-bg);
+}
+.content{
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  color: var(--header);
+  & .text_con{
+    display: flex;
+    flex-direction: column;
+    padding: 1rem;
+    gap: 1rem;
+    line-height: 1.3rem;
+    white-space: pre-line;
+    word-wrap: break-word;
+    word-break: break-all;
+  }
+}

src/widgets/WPrivacy/index.jsx

@@ -0,0 +1,89 @@
+import styles from './styles.module.scss';
+import Spring from "@components/Spring";
+import Footer from "@layout/Footer";
+const WPrivacy=({close})=>{
+    const text=[
+    ]
+
+    return (
+        <div className={styles.container}>
+            <Spring className={styles.content}>
+                <div className={styles.text_con}>
+                    <p>
+                        This privacy policy explains how information about you is collected, used and disclosed by us
+                        when you use our website, mobile applications and other online products and services or when you
+                        interact with us.
+                    </p>
+                    <p>
+                        We respect your right to privacy and will never sell or pass on your name, email address or
+                        other information to third parties without your consent, except when it is necessary to provide
+                        the Service you requested.
+                    </p>
+                    <p>personal data
+                    </p>
+
+                    <p>
+                        Personal Data means data about a living individual who can be identified from that data (or from
+                        this and other information in our possession or likely to be in our possession).
+                    </p>
+                    <p>
+                        usage data
+                    </p>
+                    <p>
+                        Usage data is automatically collected data generated by the use of the Service or the
+                        infrastructure of the Service itself (for example, the duration of a page visit).
+                    </p>
+                    <p>
+                        1. Personal Data
+                    </p>
+                    <p>
+                        When using our Service, we may ask you to provide us with certain personally identifiable
+                        information that can be used to contact or identify you ("Personal Data").
+                        Personally identifiable information may include, but is not limited to:
+                    </p>
+                    <p>
+                        2. Usage data
+                    </p>
+                    <p>
+                        When you access the Service with a mobile device, we may automatically collect certain
+                        information, including but not limited to the type of mobile device you use, your mobile
+                        device's unique ID, your mobile device's IP address, your operating system mobile, the type of
+                        mobile Internet browser you use, unique device identifiers and other diagnostic data ("Usage
+                        Data").
+                    </p>
+                    <p>
+                        3.Cookies
+                    </p>
+                    <p>
+                        We use cookies and similar tracking technologies to track activity on our Service and we retain
+                        certain information.
+                    </p>
+                    <p>Cookies are files with a small amount of data that may include an anonymous unique
+                        identifier.</p>
+                    <p>Cookies are sent to your browser from a website and stored on your device. Other tracking
+                        technologies are also used, such as beacons, tags and scripts, to collect and track information
+                        and to improve and analyze our Service.</p>
+                    <p>You can instruct your browser to refuse all cookies or to indicate when a cookie is being sent.
+                        However, if you do not accept cookies, you may not be able to use some parts of our Service.
+                    </p>
+                    <p>4. Security and information</p>
+                    <p>
+                        we will take reasonable steps to protect your personal information from loss, misuse,
+                        unauthorized access, unauthorized disclosure or alteration. By downloading the Games software or
+                        creating an account or accessing or using the Service, you accept and agree to be bound by this
+                        Privacy Policy.
+                        We will take all steps reasonably necessary to ensure that your data is treated securely and
+                        accordingly.
+                        Changes to this Privacy Policy
+                        I may update our Privacy Policy from time to time. Therefore, we recommend that you periodically
+                        review this page for any changes. I will notify you of any changes by posting the new Privacy
+                        Policy on this page.
+                        These changes are effective immediately after being posted on this page.
+                    </p>
+                </div>
+                <Footer/>
+            </Spring>
+        </div>
+    )
+}
+export default WPrivacy;

src/widgets/WPrivacy/styles.module.scss

@@ -0,0 +1,21 @@
+.container{
+  width: 100%;
+  min-height: 100%;
+  background-color: var(--widget-bg);
+}
+.content{
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  color: var(--header);
+  & .text_con{
+    display: flex;
+    flex-direction: column;
+    padding: 1rem;
+    gap: 1rem;
+    line-height: 1.3rem;
+    white-space: pre-line;
+    word-wrap: break-word;
+    word-break: break-all;
+  }
+}

src/widgets/WServices/styles.module.scss

@@ -0,0 +1,21 @@
+.container{
+  width: 100%;
+  min-height: 100%;
+  background-color: var(--widget-bg);
+}
+.content{
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  color: var(--header);
+  & .text_con{
+    display: flex;
+    flex-direction: column;
+    padding: 1rem;
+    gap: 1rem;
+    line-height: 1.3rem;
+    white-space: pre-line;
+    word-wrap: break-word;
+    word-break: break-all;
+  }
+}