소스 검색

样式优化

username 1 년 전
부모
커밋
24776e8c2e

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 2969 - 108
pnpm-lock.yaml


+ 1 - 1
src/app/[locale]/(ordinary)/layout.tsx

@@ -13,7 +13,7 @@ export default async function LocaleLayout({
     const messages = await getMessages();
     return (
         <div style={{width:'100%', height:'100vh', display: 'flex', flexDirection:'column'}}>
-            <HeaderBack />
+            <HeaderBack showBack={false}/>
             {children}
             <Footer />
         </div>

+ 0 - 119
src/app/[locale]/(ordinary)/withdraw/page.tsx

@@ -1,119 +0,0 @@
-"use client";
-import ButtonOwn from "@/components/ButtonOwn";
-import { ActionSheet } from "antd-mobile";
-import type { Action } from "antd-mobile/es/components/action-sheet";
-import { useTranslations } from "next-intl";
-import Link from "next/link";
-import { ChangeEvent, FC, useState } from "react";
-import "./page.scss";
-
-interface Props {}
-
-const Withdraw: FC<Props> = () => {
-    const t = useTranslations("WithdrawPage");
-
-    const actions: Action[] = [
-        { text: "CPF", key: "CPF" },
-        { text: t("Número"), key: "Celular" },
-        { text: "EMAIL", key: "EMAIL" },
-    ];
-    let amount = 50;
-    let [account, setAccount] = useState({
-        secretKey: "",
-        money: "",
-    });
-    const setInputVal = (e: ChangeEvent<HTMLInputElement>) => {
-        const { name, value } = e.target;
-        setAccount({
-            ...account,
-            [name]: value,
-        });
-    };
-
-    let [visible, setVisible] = useState(false);
-    let [prefix, setPrefix] = useState("CPF");
-    let [placeholder, setPlaceholder] = useState("000.000.000-00");
-    const onAction = (action: any) => {
-        setPrefix(action.text as any);
-        if (action.key == "CPF") {
-            setPlaceholder("000.000.000-00");
-            return;
-        }
-        if (action.key == "Celular") {
-            setPlaceholder("11 dígitos");
-            return;
-        }
-        if (action.key == "EMAIL") {
-            setPlaceholder("EMAIL");
-            return;
-        }
-    };
-
-    return (
-        <div className="withdraw-box">
-            <div className="img-box"></div>
-            <p className="btn-box" color="primary">
-                PIX V
-            </p>
-            <h1>{t("Certifique")}</h1>
-            <div className="amount-box">
-                <span>{t("Tipo")}</span>
-                <div className="input-box">
-                    <label onClick={() => setVisible(true)}>
-                        {prefix} <span className="iconfont icon-xialaxuanze"></span>
-                    </label>
-                    <input
-                        name="secretKey"
-                        type="number"
-                        value={account.secretKey}
-                        onChange={setInputVal}
-                        placeholder={placeholder}
-                    />
-                </div>
-            </div>
-            <h1>{t("Vincule")}</h1>
-            <div className="amount-box">
-                <span>{t("Montante")} (BRL):</span>
-                <div className="input-box">
-                    <input
-                        name="money"
-                        type="number"
-                        value={account.money}
-                        onChange={setInputVal}
-                        placeholder="Mín. 10.00"
-                    />
-                </div>
-            </div>
-            <ul className="ul-box">
-                <li>
-                    {t("SaqueDisponivel")} <span className="tip">0 BRL</span>
-                </li>
-                <li>
-                    {t("Valor")} <span className="tip">0 BRL</span>{" "}
-                    <span className="iconfont icon-iconhelp"></span>
-                </li>
-                <li>
-                    {t("Para")},{" "}
-                    <Link href="/" className="toHome router-link-active" replace>
-                        {t("Aposte")}
-                    </Link>
-                </li>
-            </ul>
-            <div className="topUp">
-                <ButtonOwn active={amount > 0 ? true : false}>{t("Saque")}</ButtonOwn>
-            </div>
-
-            <ActionSheet
-                extra=""
-                cancelText={t("Cancelar")}
-                visible={visible}
-                actions={actions}
-                closeOnAction={true}
-                onAction={onAction}
-                onClose={() => setVisible(false)}
-            />
-        </div>
-    );
-};
-
-export default Withdraw;

+ 13 - 0
src/app/[locale]/layout.tsx

@@ -4,6 +4,7 @@ import { NextIntlClientProvider } from "next-intl";
 import { getMessages } from "next-intl/server";
 import { Inter as FontSans } from "next/font/google";
 import { ReactNode } from "react";
+import Head from "next/head";
 import "../globals.css";
 
 import PageTransitionEffect from "@/components/PageTransitionEffect";
@@ -31,6 +32,18 @@ export default async function LocaleLayout({
 
     return (
         <html lang={locale} suppressHydrationWarning>
+            <Head>
+                <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+                <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
+                <meta name="keywords" content=""/>
+                <meta name="description" content=""/>
+                <meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate"/>
+                <meta http-equiv="Pragma" content="no-cache"/>
+                <meta http-equiv="Expires" content="0"/>
+                <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+                <meta name="format-detection" content="telphone=no, email=no" />
+                <meta name="viewport" content="viewport-fil=cover" />
+            </Head>
             <body className={clsx("font-sans", fontSans.variable)}>
                 <Providers themeProps={{ defaultTheme: "dark", attribute: "class" }}>
                     <NextIntlClientProvider messages={messages}>

+ 1 - 1
src/app/[locale]/login/page.tsx

@@ -49,7 +49,7 @@ const Login: FC<Props> = () => {
 
     return (
         <div className="login-box">
-            <HeaderBack />
+            <HeaderBack showBack={false}/>
             <div className="content-box">
                 <GoogleCom />
                 <FromCom callbackFun={loginRequest} msgError={msgError} />

+ 3 - 2
src/app/[locale]/(ordinary)/withdraw/page.scss → src/app/[locale]/withdraw/page.scss

@@ -1,7 +1,8 @@
 .withdraw-box {
     width: 100%;
-    min-height: 100vh;
-    padding: .44rem .18rem .6rem;
+    height: calc(100vh - .44rem);
+    overflow-y: auto;
+    padding: 0 .18rem .6rem;
     background-color: #1f1f1f;
     display: flex;
     flex-direction: column;

+ 124 - 0
src/app/[locale]/withdraw/page.tsx

@@ -0,0 +1,124 @@
+"use client";
+import ButtonOwn from "@/components/ButtonOwn";
+import { ActionSheet } from "antd-mobile";
+import type { Action } from "antd-mobile/es/components/action-sheet";
+import { useTranslations } from "next-intl";
+import Link from "next/link";
+import { ChangeEvent, FC, useState } from "react";
+import HeaderBack from "@/components/HeaderBack";
+import "./page.scss";
+
+interface Props {}
+
+const Withdraw: FC<Props> = () => {
+    const t = useTranslations("WithdrawPage");
+
+    const actions: Action[] = [
+        { text: "CPF", key: "CPF" },
+        { text: t("Número"), key: "Celular" },
+        { text: "EMAIL", key: "EMAIL" },
+    ];
+    let amount = 50;
+    let [account, setAccount] = useState({
+        secretKey: "",
+        money: "",
+    });
+    const setInputVal = (e: ChangeEvent<HTMLInputElement>) => {
+        const { name, value } = e.target;
+        setAccount({
+            ...account,
+            [name]: value,
+        });
+    };
+
+    let [visible, setVisible] = useState(false);
+    let [prefix, setPrefix] = useState("CPF");
+    let [placeholder, setPlaceholder] = useState("000.000.000-00");
+    const onAction = (action: any) => {
+        setPrefix(action.text as any);
+        if (action.key == "CPF") {
+            setPlaceholder("000.000.000-00");
+            return;
+        }
+        if (action.key == "Celular") {
+            setPlaceholder("11 dígitos");
+            return;
+        }
+        if (action.key == "EMAIL") {
+            setPlaceholder("EMAIL");
+            return;
+        }
+    };
+
+    return (
+        <>
+            <HeaderBack />
+            <div className="withdraw-box">
+                
+                <div className="img-box"></div>
+                <p className="btn-box" color="primary">
+                    PIX V
+                </p>
+                <h1>{t("Certifique")}</h1>
+                <div className="amount-box">
+                    <span>{t("Tipo")}</span>
+                    <div className="input-box">
+                        <label onClick={() => setVisible(true)}>
+                            {prefix} <span className="iconfont icon-xialaxuanze"></span>
+                        </label>
+                        <input
+                            name="secretKey"
+                            type="number"
+                            value={account.secretKey}
+                            onChange={setInputVal}
+                            placeholder={placeholder}
+                        />
+                    </div>
+                </div>
+                <h1>{t("Vincule")}</h1>
+                <div className="amount-box">
+                    <span>{t("Montante")} (BRL):</span>
+                    <div className="input-box">
+                        <input
+                            name="money"
+                            type="number"
+                            value={account.money}
+                            onChange={setInputVal}
+                            placeholder="Mín. 10.00"
+                        />
+                    </div>
+                </div>
+                <ul className="ul-box">
+                    <li>
+                        {t("SaqueDisponivel")} <span className="tip">0 BRL</span>
+                    </li>
+                    <li>
+                        {t("Valor")} <span className="tip">0 BRL</span>{" "}
+                        <span className="iconfont icon-iconhelp"></span>
+                    </li>
+                    <li>
+                        {t("Para")},{" "}
+                        <Link href="/" className="toHome router-link-active" replace>
+                            {t("Aposte")}
+                        </Link>
+                    </li>
+                </ul>
+                <div className="topUp">
+                    <ButtonOwn active={amount > 0 ? true : false}>{t("Saque")}</ButtonOwn>
+                </div>
+
+                <ActionSheet
+                    extra=""
+                    cancelText={t("Cancelar")}
+                    visible={visible}
+                    actions={actions}
+                    closeOnAction={true}
+                    onAction={onAction}
+                    onClose={() => setVisible(false)}
+                />
+            </div>
+        </>
+    );
+};
+
+export default Withdraw;

+ 4 - 3
src/components/HeaderBack/index.tsx

@@ -14,10 +14,11 @@ import { useTranslations } from "next-intl";
 export interface HeaderBackProps {
     title?: string;
     children?: ReactNode;
+    showBack?: Boolean;
     headerRender?: () => ReactNode;
 }
 
-const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', children}) => {
+const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', showBack = true, children}) => {
     const t = useTranslations("HeaderBack");
 
     const iconClassName1 = clsx({
@@ -52,8 +53,8 @@ const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', childre
 
     return (
         <div className={styles.headerBack}>
-            <div className={styles.left} onClick={() => goPage()}>
-                <span className={iconClassName1}></span>
+            <div className={styles.left}>
+                { showBack && <span className={iconClassName1} onClick={() => goPage()}></span> }
             </div>
             {(title || selfTitle) && <span className={styles.title}>{title || selfTitle}</span>}
             {children}

이 변경점에서 너무 많은 파일들이 변경되어 몇몇 파일들은 표시되지 않았습니다.