feat: 修改

src/app/[locale]/(doings)/jackpot/page.tsx

@@ -99,7 +99,7 @@ const Jackpot: React.FC = () => {
                         <div
                             className={clsx(
                                 styles.date,
-                                "relative mt-[.08rem] pl-[.3rem] text-[.15rem] font-bold"
+                                "relative mt-[.08rem] flex flex-row items-center pl-[.3rem] text-[.15rem] font-bold"
                             )}
                         >
                             2025-04-11 16:30
@@ -107,10 +107,10 @@ const Jackpot: React.FC = () => {
                         <div
                             className={clsx(
                                 styles.coin,
-                                "relative mt-[.08rem] pl-[.3rem] text-[.15rem] font-bold"
+                                "relative mt-[.08rem] flex flex-row items-center pl-[.3rem] text-[.15rem] font-bold"
                             )}
                         >
-                            2025-04-11 16:30
+                            Bónus misterioso
                         </div>
                         <div className={clsx("mt-[.08rem] text-[.18rem] font-bold text-[#ffd200]")}>
                             R$1,999.00
@@ -122,7 +122,7 @@ const Jackpot: React.FC = () => {
                         <span className={clsx("mt-[.1rem] text-[.2rem] font-[900]")}>RECEBER</span>
                     </div>
                 </div>
-                <div className={clsx("ml-[.14rem] mr-[.14rem] mt-[.5rem]")}>
+                <div className={clsx("ml-[.14rem] mr-[.14rem] mt-[.2rem]")}>
                     {list.map((item, index) => {
                         return (
                             <div

src/app/[locale]/(doings)/jackpot/style.module.scss

@@ -76,6 +76,10 @@
         align-items: center;
         justify-content: flex-start;
         padding: 0.2rem 0.6rem 0 0.6rem;
+        .date:before,
+        .coin:before {
+            top: 4px;
+        }
     }
     .name {
         padding-left: 0.3rem;
@@ -98,7 +102,7 @@
         width: 0.18rem;
         position: absolute;
         left: 0;
-        top: 0;
+        top: 2px;
     }
 
     .coin:before {
@@ -111,7 +115,7 @@
         width: 0.18rem;
         position: absolute;
         left: 0;
-        top: 0;
+        top: 2px;
     }
     .btn {
         background-image: url("/jackpot/button.png");

src/app/[locale]/(navbar)/recharge/DownNumber.tsx

@@ -9,12 +9,12 @@ export const DownNumber = (props: { endTime: number }) => {
         onEnd: () => {},
     });
     return (
-        <div className={"flex text-[0.0972rem]"}>
+        <div className={"flex text-[0.1rem]"}>
             <div className={"text-center"}>
-                <div className={"flex items-center text-[#ff7000]"}>
+                <div className={"flex items-center text-[#fff]"}>
                     <div
                         className={
-                            "flex items-center justify-center rounded-[0.0347rem] bg-[#ffd7ab]" +
+                            "flex items-center justify-center rounded-[0.0347rem] bg-[#c8a7e8]" +
                             " h-[0.2083rem] w-[0.2083rem]"
                         }
                     >
@@ -23,7 +23,7 @@ export const DownNumber = (props: { endTime: number }) => {
                     <span className={"mx-[0.0247rem]"}>:</span>
                     <div
                         className={
-                            "flex items-center justify-center rounded-[0.0347rem] bg-[#ffd7ab]" +
+                            "flex items-center justify-center rounded-[0.0347rem] bg-[#c8a7e8]" +
                             " h-[0.2083rem] w-[0.2083rem]"
                         }
                     >
@@ -32,7 +32,7 @@ export const DownNumber = (props: { endTime: number }) => {
                     <span className={"mx-[0.0247rem]"}>:</span>
                     <div
                         className={
-                            "flex items-center justify-center rounded-[0.0347rem] bg-[#ffd7ab]" +
+                            "flex items-center justify-center rounded-[0.0347rem] bg-[#c8a7e8]" +
                             " h-[0.2083rem] w-[0.2083rem]"
                         }
                     >
@@ -41,7 +41,7 @@ export const DownNumber = (props: { endTime: number }) => {
                     <span className={"mx-[0.0247rem]"}>:</span>
                     <div
                         className={
-                            "flex items-center justify-center rounded-[0.0347rem] bg-[#ffd7ab]" +
+                            "flex items-center justify-center rounded-[0.0347rem] bg-[#c8a7e8]" +
                             " h-[0.2083rem] w-[0.2083rem]"
                         }
                     >
@@ -70,7 +70,7 @@ export const Download = () => {
 
     return (
         <Image
-            src={"/recharge/download.png"}
+            src={"/recharge/download1.png"}
             alt={"download"}
             width={60}
             height={40}

src/app/[locale]/(navbar)/recharge/layout.tsx

@@ -16,9 +16,9 @@ export default async function Layout({
 }) {
     const t = await getTranslations("Header");
     return (
-        <>
-            <HeaderBack showBack={false} title={t("recharge")} />
-            <main className={"main-header bg-[#282828]"}>{children}</main>
-        </>
+        <div className="rechargePage h-[100%] overflow-auto bg-[url('/home/bg.jpg')]">
+            <HeaderBack showBack={false} useBg={true} title={t("recharge")} />
+            <main className={"main-header"}>{children}</main>
+        </div>
     );
 }

src/app/[locale]/(navbar)/recharge/page.tsx

@@ -2,8 +2,10 @@ import { PayDataType } from "@/api/promo";
 import DomainFooter from "@/components/DomainFooter";
 import { Link } from "@/i18n/routing";
 import { server } from "@/utils/server";
+import clsx from "clsx";
 import Image from "next/image";
 import { Download, DownNumber } from "./DownNumber";
+import styles from "./style.module.scss";
 const getActivityApi = () => {
     return server
         .request<PayDataType>({
@@ -44,7 +46,7 @@ const Page = async () => {
                 <div className={"flex-1"}>
                     <div className={"mb-[0.2778rem] mt-[0.2083rem] flex flex-col items-center"}>
                         <Image
-                            src={"/recharge/success.png"}
+                            src={"/recharge/success1.png"}
                             alt={"success"}
                             width={80}
                             height={80}
@@ -56,14 +58,11 @@ const Page = async () => {
                     </div>
 
                     <div
-                        className={
-                            "relative m-[0.0694rem] rounded-[10px] bg-gradient-to-b" +
-                            " from-[#f8e4bf] to-[#f2ae38] p-[0.1389rem]"
-                        }
+                        className={clsx("relative m-[0.0694rem] rounded-[10px]", styles.container)}
                     >
-                        <div className={"absolute -top-[0.12rem] left-1/2 -translate-x-1/2"}>
+                        <div className={"absolute -top-[3px] left-1/2 -translate-x-1/2"}>
                             <Image
-                                src={"/recharge/title_bg.png"}
+                                src={"/recharge/title_bg1.png"}
                                 alt={"Novo Usuário"}
                                 width={300}
                                 height={160}
@@ -71,30 +70,30 @@ const Page = async () => {
                             <span
                                 className={
                                     "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" +
-                                    " text-[0.125rem] font-bold text-[#ff7301]"
+                                    " text-[0.125rem] font-bold text-[#fff]"
                                 }
                             >
                                 Novo Usuário
                             </span>
                         </div>
 
-                        {hasEndTimeActivities && (
+                        {!hasEndTimeActivities && (
                             <div
-                                className={
-                                    "mt-[0.2778rem] flex rounded-[0.0347rem] bg-[#fbe6c6]" +
-                                    " p-[0.0694rem]" +
-                                    " items-center text-[#000]"
-                                }
+                                className={clsx(
+                                    "mt-[0.2778rem] flex rounded-[0.0347rem]",
+                                    "p-[0.0694rem]",
+                                    "items-center text-[#fff]",
+                                    styles.item
+                                )}
                             >
-                                <div>
-                                    <Image
-                                        src={"/recharge/activity-1.png"}
-                                        alt={"activity-1"}
-                                        width={80}
-                                        height={40}
-                                    />
+                                <div
+                                    className={clsx(
+                                        "flex h-[.5rem] w-[.34rem] flex-row items-center justify-center bg-[url('/recharge/bg3.png')] bg-[size:100%_100%] text-[.2rem] font-bold text-[#0695ed] text-[#fff]"
+                                    )}
+                                >
+                                    1
                                 </div>
-                                <div className={"ml-[20px] w-[100%]"}>
+                                <div className={"ml-[20px] flex-1"}>
                                     <div className={"flex items-center"}>
                                         <div className={"flex-1"}>
                                             {endtime ? <DownNumber endTime={endtime} /> : null}
@@ -104,7 +103,7 @@ const Page = async () => {
                                                 className={
                                                     "bg-[url(/recharge/button-1.png)] " +
                                                     " bg-[length:100%_100%] bg-no-repeat" +
-                                                    " h-[0.4167rem] w-[0.8333rem] pt-[0.0347rem]"
+                                                    " h-[0.29rem] w-[0.8333rem] pt-[0.0347rem]"
                                                 }
                                             >
                                                 <span
@@ -120,7 +119,8 @@ const Page = async () => {
                                         </Link>
                                     </div>
                                     <div>
-                                        No primeiro depósito acima de 5 BRL, você pode receber um bônus de 100%. Válido por 5 horas
+                                        No primeiro depósito acima de 5 BRL, você pode receber um
+                                        bônus de 100%. Válido por 5 horas
                                     </div>
                                 </div>
                             </div>
@@ -128,22 +128,20 @@ const Page = async () => {
 
                         {/*   2*/}
                         <div
-                            className={
-                                "mt-[10px] flex rounded-[0.0347rem] bg-[#fbe6c6]" +
-                                " p-[0.0694rem]" +
-                                " items-center justify-between text-[#000]"
-                            }
+                            className={clsx(
+                                "mt-[10px] flex rounded-[0.0347rem]",
+                                "p-[0.0694rem]",
+                                "items-center justify-between text-[#fff]",
+                                styles.item
+                            )}
                         >
-                            <Image
-                                src={
-                                    hasEndTimeActivities
-                                        ? "/recharge/activity-2.png"
-                                        : "/recharge/activity-1.png"
-                                }
-                                alt={"activity-1"}
-                                width={60}
-                                height={40}
-                            />
+                            <div
+                                className={clsx(
+                                    "flex h-[.5rem] w-[.34rem] flex-row items-center justify-center bg-[url('/recharge/bg3.png')] bg-[size:100%_100%] text-[.2rem] font-bold text-[#0695ed] text-[#fff]"
+                                )}
+                            >
+                                {hasEndTimeActivities ? 2 : 1}
+                            </div>
                             <div className={"ml-[20px] flex-1"}>ADICIONAR À TELA INICIAL</div>
                             <Download />
                         </div>
@@ -151,25 +149,22 @@ const Page = async () => {
                         {/*  3 */}
                         {config.status && (
                             <div
-                                className={
-                                    "mt-[10px] flex rounded-[0.0347rem] bg-[#fbe6c6]" +
-                                    " p-[0.0694rem]" +
-                                    " items-center text-[#000]"
-                                }
+                                className={clsx(
+                                    "mt-[10px] flex rounded-[0.0347rem]",
+                                    "p-[0.0694rem]",
+                                    "items-center text-[#fff]",
+                                    styles.item
+                                )}
                             >
-                                <div>
-                                    <Image
-                                        src={
-                                            hasEndTimeActivities
-                                                ? "/recharge/activity-3.png"
-                                                : "/recharge/activity-2.png"
-                                        }
-                                        alt={"activity-3"}
-                                        width={80}
-                                        height={40}
-                                    />
+                                <div
+                                    className={clsx(
+                                        "flex h-[.5rem] w-[.34rem] flex-row items-center justify-center bg-[url('/recharge/bg3.png')] bg-[size:100%_100%] text-[.2rem] font-bold text-[#0695ed] text-[#fff]"
+                                    )}
+                                >
+                                    {hasEndTimeActivities ? 3 : 2}
                                 </div>
-                                <div className={"ml-[20px] w-[100%]"}>
+
+                                <div className={"ml-[20px] flex-1"}>
                                     <div className={"flex items-center"}>
                                         <div className={"flex-1"}>De registo prémios</div>
                                         <Link href={"/freeGames"}>
@@ -177,7 +172,7 @@ const Page = async () => {
                                                 className={
                                                     "bg-[url(/recharge/button-1.png)] " +
                                                     " bg-[length:100%_100%] bg-no-repeat" +
-                                                    " h-[0.4167rem] w-[0.8333rem] pt-[0.0347rem]"
+                                                    " h-[0.29rem] w-[0.8333rem] pt-[0.0347rem]"
                                                 }
                                             >
                                                 <span
@@ -193,8 +188,10 @@ const Page = async () => {
                                         </Link>
                                     </div>
                                     <div>
-                                        <span className={"font-bold text-[red]"}>{config?.data?.amount ?? 0}</span> grátis para começar a jogar
-                                        imediatamente
+                                        <span className={"font-bold text-[red]"}>
+                                            {config?.data?.amount ?? 0}
+                                        </span>{" "}
+                                        grátis para começar a jogar imediatamente
                                     </div>
                                 </div>
                             </div>
@@ -203,11 +200,11 @@ const Page = async () => {
                 </div>
 
                 <div className={"flex w-[100%] justify-between p-[10px]"}>
-                    <Link href={"/"} className={"text-primary-color"}>
+                    <Link href={"/"} className={"text-[#0299d7]"}>
                         <span className={"iconfont icon-xiangzuo1"}></span>
                         Inicio
                     </Link>
-                    <Link href={"/deposit"} className={"text-primary-color"}>
+                    <Link href={"/deposit"} className={"text-[#0299d7]"}>
                         Depósito
                         <span className={"iconfont icon-xiangyou1"}></span>
                     </Link>

src/app/[locale]/(navbar)/recharge/style.module.scss

@@ -0,0 +1,12 @@
+.container {
+    padding: 0.2rem;
+    background-color: rgba(172, 89, 235, 0.2);
+    box-shadow: $-input-shadow;
+    @extend .commonBorder;
+    .item {
+        box-shadow: $-input-shadow;
+        @extend .commonBorder;
+        border-radius: 0.15rem;
+        background: linear-gradient(to bottom, #8f51d1, #4c41b6);
+    }
+}

src/app/[locale]/(navbar)/withdraw/page.scss

@@ -16,7 +16,7 @@
 
     .btn-box {
         @extend .commonBorder;
-        box-shadow: $-input-shaow;
+        box-shadow: $-input-shadow;
         padding: 0 0.1rem;
         margin-right: 0.06rem;
         flex-shrink: 0;

src/styles/deposit.scss

@@ -17,7 +17,7 @@
 
     .btn-box {
         @extend .commonBorder;
-        box-shadow: $-input-shaow;
+        box-shadow: $-input-shadow;
         margin: 0.1rem 0;
         height: 0.3rem;
         margin-right: 0.06rem;
@@ -93,7 +93,7 @@
 
         li {
             @extend .commonBorder;
-            box-shadow: $-input-shaow;
+            box-shadow: $-input-shadow;
             height: 100%;
             width: 100%;
             border-radius: 0.06rem;

src/styles/variables.scss

@@ -7,7 +7,7 @@ $-header-height: 0.4rem;
 $-footer-height: 0.6rem;
 $-body-width: 4.02rem;
 
-$-input-shaow: 0px 0px 15px rgb(0, 158, 255) inset;
+$-input-shadow: 0px 0px 15px rgb(0, 158, 255) inset;
 :export {
     primaryColor: $-theme-color;
 }
@@ -22,7 +22,7 @@ $-input-shaow: 0px 0px 15px rgb(0, 158, 255) inset;
 .customInputPage {
     .adm-list-item-content {
         background-color: transparent;
-        box-shadow: $-input-shaow;
+        box-shadow: $-input-shadow;
         border-style: solid;
         border-color: #a3f1ff;
         border-left-width: 1px;
@@ -37,7 +37,7 @@ $-input-shaow: 0px 0px 15px rgb(0, 158, 255) inset;
         button {
             // @extend .commonBorder;
             // background: #7d48c1;
-            // box-shadow: $-input-shaow;
+            // box-shadow: $-input-shadow;
             background-image: url("/btnbg.png");
             background-repeat: no-repeat;
             background-size: 100% 100%;