From e8779a7a85e0bcdda062c89807972c0b74e72cb5 Mon Sep 17 00:00:00 2001
From: Gitea <gitea@localhost>
Date: Wed, 7 May 2025 23:39:26 +0530
Subject: [PATCH] added premium subscribe button

---
 public/images/crown.webp                      | Bin 0 -> 4786 bytes
 resources/css/boil.css                        |  89 ++++++++++++++++++
 .../views/components/layouts/app.blade.php    |  66 +++++++++++++
 3 files changed, 155 insertions(+)
 create mode 100644 public/images/crown.webp

diff --git a/public/images/crown.webp b/public/images/crown.webp
new file mode 100644
index 0000000000000000000000000000000000000000..30862eef0651cee11bf4a0889775e816bdde07e9
GIT binary patch
literal 4786
zcmbtXcT^MGx1JC>D2ga3C_%s|7!q1&p%+1=3ets;gc<@Sp|?;41u0ihE+VLal!!<X
zkS;|~sx)bW7X;~wh=`E9fG+R7zxDg$t@mb~S!?z=-~P_odw;WMjhTU-ULh|4Sn6t-
zTsBd(;sgMIk8%6$4b6)t`Ultm08|p=nIU2@^i8*-#%1W4r$_BMkFjT-KgYwDvR(13
zAz@f7mYhY+3bH>a4O&Z_S{SG{>n<RH9~uqLH!42rP9+*;#+Z+#39I1?P9^jQ3=32*
z;EmWcY;PY`3r<HK2Yg6WBr%~{-Y6sO7}6=)chIiiIV@%7rH6Y|#tJfJNj1pk_IW|Q
z5aX1|L_)8*@(xRgSU`Wdl$IquNsK;PYM>*SwNP2RT3?kXV(&q1>YNI*d6R2e-R9`b
zT60-0!FFYs+nJUAt?-zc-<8VBV0u}?D7gqE#<4gioAcTjK@oGDEO+~}43s2BA-(yS
zB+L!rc>6Y2zWhQ~xEN@BVjIrH&17dzT8j$TY@9T|aR19iB!WEy^&~HUVi^>(e6V9t
z3lL!5oV1lKIe^mAY3Z80#`I###gAjg7n3s~!ZBf&9*(y9CM0o^h-lKn`t1;;X{KGv
zUXD-E@@JlSHUPSfPnK<rV!&r(mdy?w3~796<-)4xygIY~;I!ioU;j<8s5D`eFGF_a
zVprWgY2J|m0W5rOyg<AyM_`nL50t5Wi5gk;&~BxgTUr$!s56z)h|p=oqhZi}PizMS
z_i>P=Wpx}sG=7hzgoVHX5dcFR-K;*>;sQG}-ewJ=;15ALY#Lxp+b{Q}2!bHYj`X7{
z3GE=70kmlXV5Y3(ny1vym`*vQ<UBV^6k)sL3D*o!1QRI<nFh|sJ=nJ<oqJ81zsoUE
z<}_1=x^{wM95;T9OU1RDegZU_)AzCT?<^fGzgkxCk=GbtUV3hA!D+j(%51P*6`eB_
zurkjUM+=&>FsS?51Bq+ca8K6C{O-<kU}L~c;^e~6eA}%{X@{Xt%Z^Wn|HvE0J}9+^
z_Eu-+iw$oCQI^`R#fCcGK#g^W1C7L=WPmrTx(ukcPMrEi_NUSp+_>*i|HRXT^_|w7
zr1b1w@&m|A9LQitjSXy>UViOV^6IvOgi`YXHCQTP#0{9rI+W16!7tnRu83t^=mfA#
zj2n>w>-V<pH=f=vu8{)p_!^KO8t5fyJgdHuv=|R;FG(SUHJRSlU(S~GW$5We+Awp)
z!4OtfbX~LinISn*ecn6Dkw*r6r76sF`(SrO@!My0e^|v*5^UR3Ge{BP(IuZrX`~BA
zG8B=q8rQVXtg}bBVM36lk;`54at+4>SeL#!!|uxlJ35Lj?aWt1J*)KunoAsF+_OJ$
zfWchXjz|K&+*LlHBayyA7!D==c+u{(l!QvbCMU<^xBETAWo|^V(_J#I$Bql>0%Onf
zM@Lx^$4X2qPFKnUZJ+cG9`xMmioDOF_2o!X)kK{Bm&7*L?4XMLv?ttWIewHXxepR3
zeY9(*4qjCVM>}>?j3zCBjMALzV|=lqOMj%7=f6i$a>GgPy2{fpS=+#ZN`0+RLC)uS
z!*}Iqt|Gi)WY^_rV#~uq5&LMjs?r#9Vb<5GbLBgJCB2~@`{!@e1C8Ou(+ZN>*<KAy
z0ZorS_ZT$QhXAkNJ~_Uk0kF_uso6CsNeF`Qxiv5$7evifng9cbnBH2Dl(~TmwmlCn
z#DlHw*gItZ0JAWkP<&-_^V4J(_2lSALbw6ip|UWxdo7dgb@TqP1CAm~QxE9Y+#%|h
zk~VJTe;mBmv6CtxVJvtlV&|UeB44{x$YmYC@qA;JeShv2#av@D#YW{N_zXL6_E~+a
zIF)oU&VXmVxPOBh-hno*EFR<Xp7MMpWP`{#B)}c>r3u7*^@Owlr9p)=XJgh85&_m=
zR$^bWfJO%<?_-UaYCOQq)>>^dgFGr^!9kt7PEI>fBs?S^c_c1)evx&1j<;Y<(F7iQ
zPWOgRccF0OJntg17%EsLkomYK^kSwiM(4_xuP+*?ypJC-eFZ7r?_{?LK@^)hKkGE%
zq0rJV#MatCm(HZ7D8B&@vaLTcKku$?t6C!L@nM~H0Bl!eHVT^#F9et7+9@SNsas3Z
zskdy)wyJb_Gr@zmyB5r1)#i)3)pJs25!w|^`wivuwrH99vx`sN%iet#f833_zi_IX
z8W%&e_6g%Q9Na!`f@>V^ip$wxvYPkrHgKwYWr8aylC$t^C{)Q$d-b@(z1j8l`A1oJ
z3upT>_mhKep@q+~@+=Jh%Bx<4_niM0HX)mEA^SKy2wcdGpqpJgRn^FT8Rg0^mcN5`
z{LoCppZ<XS<aj*FVKO!F`4yC@-WW7n%@LoGc8BF_c;iL!@p0xw@SJxpRc#*6yZ~xU
zuW0El4wSxM7d7zi>6Rm0<;?s>F~7>~l$#te3z3E&limb2fGpVFirRE{4Z4*$ap&*Q
zU!0Pfc@<YY(E4iCT03Q-{57?9%ceOdQ9#Lk;G-#6F>oe-yS@EjUvvL{Njs9Bq3FWh
z{_D5Hc-a_VO2}JQ07w!CGC>mlfIpy?tdVhE{NV$!{N%-|5?&7czS^^zsPJ{rHVA1~
z5CY9pIp90_deucz_`4b(rfZDn?pA3)<d>c=JhSOE*$wc7S2o)^{j0spJBo1Wy+3I$
z)!#Nu(q?>tKp>1B<VR?mda^n;r3xI2TCy6yYG_O4POm<}^409vRqKvxl~TyRW^pnb
zI^UD=f}OJ>K9`za6hKmO+g{U0CeGLh>|7vl_71o+*ToOeYw5QZyDw8E3Dvfs{FSH-
zXO=6jLOx51zP(zZt78p64(@aoQ4%+}E!R^Eb}DHSimBEP%4h7E4Kpm@F$yszst?)=
zcv<@&)7eWo=`GQ2k>Z$luG3Fn@;cDzzAjBsudMpq#s(TCa0Y+O^wy_-^tol2e`tU6
zm1^p87$--!d`A*M+uqawvS`Za&aJZE`s*PJ)y&g(V-Ks0zPIOZP*bv;O!H9h<QIzT
z*>2ztmq@u*sULj}so-!+SL1G8`CKta_(&(RBeh0vvWea5JYwMsI|6%6VC1mg1>P4)
z1op=(?7I9w>(hX*D82LoM?(og<;{<9St-+7;$wBmLpLnF9m$gJytN-zT|@8tpM72O
zNhDX%;Fd6rQXk(JSuvf;Qi=*b;>FTS=<}2lwYD7h=CZwhH|?fF8@<^a&kY}@DYstS
zzB_6AMF6|GI+=JqnVRy1EbhRZS#||U@%h}A_v6(4%YzC?0_=KT{~RJ-U4JXFP9!?~
zGwqvWuuLdTV8w3*->{>~KBhWBumAHs3tRn-5pBmek5)-1(>B9(>{erAg}H4nz76%2
zM-gc-7xGyUvw!wh?9=bp>pZ>>6CLyi%&k6DVnHo}<-s+NEA;M~-+Ah1)4p(0IXd_5
zyy8`k+S9K0j*fav6+yc!CovjTwHehP$SO*G$o#b;qmj+=qT(;eTtF)Gr64FG*!gMM
zvf6uNV|^Mubbq;ltb$;;meA?v$+GobThyw&8wIS19|H{qj+AcBS~k7^T$Il>N41j-
zcr;3Nn(Mzg83_*+VNWdV%>B#9w}Ru`#0y1ZhuPUR^DIST7PduJgYqqRP?BfVW;!oh
zrH~7p9^s6?HH4ZIwXh0}D3{#2B7gt%9iwxz27N9VF|{s2d~aG>+e2-34zQr97A_?Z
zrAc~ho!Y%2!tb55dDlZCPqL4dC#Se8nYYH}*wse9bgrYX)XxM#B&@{DSxn;0%bXX+
z?-ut}8@HU`x6$s)F5-z_1NwRf{3rEpdYU%_Ip#dqJ`>(n*kso}z_b7H)m9_}ZETzn
zAah67^+1>k*XwuJ2QLiKv-Jm5j(bkNa+v)1EMQ@*TFLF*zF4c+Z-MJp+4D-)J0&ro
ztq+~+PES;P+UG<+x!G}yz1h~kCJ+IQx7B_j!WJ_XIsudFKODdOh5A?PPW34FaugS{
zMg;*Y)FD&Yv!>F$+HibjVuin(E<Tbq%+njhRo2#yrnN6?&0Oj*Avx8qyJl@?JoAFJ
za2B`3|8dsh`^Zyt_u-<8uGd2E8EYM!w@n>a38KdXhavQ}S+0F5_Ws%fgD8%P)aj8!
z2xyd;{SuvaGeWBKEWf4bXlM9%_R)%s+Jy@-0)LVbY@CMuJV_7uqQjlbQlL}Lri(e3
z2H5wJfb0{;f~QnmE6r!Cj$3|2oP%f7o6WpjiL9`Xc6#yHvq&u$A@zg#s$MiUqNnuG
zi2AiMb@->FR+{$%Z}4JIMd&8=RFGolXwTh#=wo(BTp^KpvEHr0i06k<>Now>y|+>b
zp=$@;#a<0-^{456TQSnGlsP1Zd;N}Yn$SfgADYnQL2|slep5|Z-iRYKx%KuIYqt$s
zx4YJWShjo@>qJCf6|316_GrW9dWdmP9h)=PMn#y$w#wR?x5o<gG;Q#Tq~Kpv+3$zL
zfJAPg8u}EhvEc`G?XgcsN%s5qFDfMUB0sz6P1GM^S13Mg8u^jX1N}C8x&@OMAR{^a
zYOr{$hIw&(&9z$?pdYyJRvg!6dFk+t?@lpOJ*`u@T%liYP$u6PB3F#J62F}`yjqw2
zj8C5b<R^Cp*K9ra_v0-?{UZj$RpvIwROjaQTT2%oxFyFQ+5A}d&MCEH0if*hO*N)b
ztb?5zdqd%n`p*4*#)npK9*Ab;RxTb+M%PSE2j_UH7VSJtyeJT*WLjV??^S_ARpB4y
zF0f>GlqsuG7PMz{!E$w`Blx_OKtT%14#Rg*5KnzmK$3zMMiE*u$(!L=)l<^%fUNSO
z6I^jDZnMXnK6Gr=4|A+%X`BeVa=PgJx@%?FnnGR8m7BU(q_Rr5gbKcj%C7L1GMS{v
zmN0(&_AV<!6UZOT0Dw~W_eNtpaAb%R&c%(O3SF&ffI{4`s!&ULLxiEXHqO;eKahyK
z6li3Q3G~1yVWH}3oG5=~e@|~u92pJq_rw!O%KoZQG}g-rr_6ZXorXghAR^XT*-S_8
z7ldJ{LS4yZZ)G^#&(BZFPgcr{=mM8kQc{8=WZ*I~Fa`of3Luct{xAYbl)=CW+2hc`
zkuXFzZ?c;g0kX@9cJlHet3siikYCiAWHQms={GxpB!%9a@!55e!gzVY(O42(S_-jy
zEC>Yk6R)g^CGDC&H@Sqnx@Y{f@NRoMd83IWoOysZP8Di~BYF7{F}OX3U8i3p+C&_h
zjKiwQAY|lW2*yxA!T)1vcaOgvbp6Q&3^-aAEvG1>1XDmOAz^X|j64jDbjHGzWMr{O
zBt{+~uY~+f^wZ_vG<r@97I_(Y8Kk_Dw4AhplDs0~x5M7zzwzc?J{Z^CP}F38!~UMz
z!=m83*~Pp4Ov;||D=WV}ex~dv@E>LQ-<JxD`CTS&A0mEF0$2<jhsSy12;|)&N&hMm
z7NbmdBja&@mq-&&{&$HO+Ed1(2`;Koe;5|$jP}8kp=ubSmmdKFgGm3EaDFkM;Qt{1
ze+1+G4@vKeZubq?lN)1!5sB=tNEnu~rVrWGi>PMiMIu4W(E)fbA`1SGd4|&W^8J6x
zDdScAoz#CF!yoPa57jeZ%6n?{BAR=7;nlR!1Yb1dv>A?o#SwADGZ3s7MpZ}ioTooB
z;JgA-7ve+05mhZT&t1Ok?qj2e^ny4M(FCljxvMuBLdJP|;~BzNMZy1*_rJ#SGdxB&
YVDts}@9x1ce)k{7F;t;MMt1@J2jZV=Jpcdz

literal 0
HcmV?d00001

diff --git a/resources/css/boil.css b/resources/css/boil.css
index 2c2d1f5..0788878 100644
--- a/resources/css/boil.css
+++ b/resources/css/boil.css
@@ -73,3 +73,92 @@
 .magic-box {
     scrollbar-width: none;
 }
+
+.premium-btn {
+    perspective: 1000px;
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 8px 20px;
+    background: linear-gradient(145deg, #f7b42f, #fdd832);
+    color: #fff;
+    font-size: 16px;
+    font-weight: bold;
+    text-transform: uppercase;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    transition: transform 0.3s ease;
+}
+
+.premium-btn:hover {
+    transform: scale(1.05);
+}
+
+.premium-btn .crown,
+.premium-btn .crown-bg1,
+.premium-btn .crown-bg2 {
+    transform-style: preserve-3d;
+    position: absolute;
+    background: url('https://zemailnator.test/images/crown.webp') no-repeat center center;
+    background-size: contain;
+    animation: rotateCrownY 2s linear infinite;
+}
+
+/* Main Crown */
+.premium-btn .crown {
+    top: -20px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 40px;
+    height: 40px;
+    z-index: 3;
+}
+
+/* Background Crown 1 */
+.premium-btn .crown-bg1 {
+    top: -10px;
+    left: 5%;
+    width: 25px;
+    height: 25px;
+    animation-duration: 3s;
+    opacity: 0.5;
+    z-index: 1;
+}
+
+/* Background Crown 2 */
+.premium-btn .crown-bg2 {
+    bottom: -15px;
+    right: 15%;
+    width: 30px;
+    height: 30px;
+    animation-duration: 4s;
+    opacity: 0.4;
+    z-index: 1;
+}
+
+.premium-btn .btn-text {
+    z-index: 2;
+}
+
+@keyframes rotateCrownY {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+.bg-pricing-modal {
+    background-color: #F3F4F6; /* Light mode background */
+}
+
+html.dark .bg-pricing-modal {
+    background-color: #101828; /* Dark mode */
+}
+
+
diff --git a/resources/views/components/layouts/app.blade.php b/resources/views/components/layouts/app.blade.php
index 368911d..a314b2f 100644
--- a/resources/views/components/layouts/app.blade.php
+++ b/resources/views/components/layouts/app.blade.php
@@ -45,6 +45,14 @@
 
                 {{ __('Refresh') }}
             </button>
+            <flux:modal.trigger name="premium">
+            <button type="button" class="premium-btn mt-2">
+                <span class="crown"></span>
+                <span class="crown-bg1"></span>
+                <span class="crown-bg2"></span>
+                <span class="btn-text">Get Premium</span>
+            </button>
+            </flux:modal.trigger>
         </flux:navlist>
         <div id="sidebar-magic" class="items-center border-1 dark:border-zinc-800 border-zinc-200 hidden">
             <p class="px-6 py-4 text-sm dark:bg-zinc-900 bg-zinc-100 dark:text-white accent-zinc-700">Support us by disabling ad blockеrs on our site 🙏</p>
@@ -162,6 +170,64 @@
                 </div>
             </div>
         </flux:modal>
+
+        <flux:modal name="premium" class="min-w-[22rem]" class="bg-pricing-modal">
+            <div class="space-y-6">
+                <div>
+                    <!-- From Uiverse.io by themrsami -->
+                    <div class="max-w-[300px] w-full pt-5 px-5 pb-4 bg-zinc-100 dark:bg-zinc-900 rounded-3xl">
+                        <div class="text-center mb-6">
+                            <h5 class="text-2xl font-semibold text-gray-500 mb-3">Zemail Premium</h5>
+                            <span class="block text-5xl font-bold text-accent mb-3">${{ config('app.plans')[0]->price ?? 10 }}</span>
+                            <span class="block text-gray-400 font-medium mb-6">per month</span
+                            >
+                            <a class="relative group inline-block w-full py-4 px-6 text-center text-gray-50 hover:text-gray-500 bg-amber-400 font-semibold rounded-full overflow-hidden transition duration-200"
+                                href="{{ route('dashboard') }}">
+                                <div class="absolute top-0 right-full w-full h-full bg-white transform group-hover:translate-x-full group-hover:scale-102 transition duration-500"></div>
+                                <span class="relative">Subscribe now</span>
+                            </a>
+                        </div>
+                        <ul>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">No Ads</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">Dedicated premium domains</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">Up to 100 addresses at the same time</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">Dedicated Premium Gmail Addresses</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">100% Private address with full ownership</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">History Upto 30 Days</span>
+                            </li>
+                            <li class="flex mb-4 items-center">
+                                <flux:icon.check />
+                                <span class="ml-2 text-accent wrap-normal">Enhanced privacy and security</span>
+                            </li>
+
+                        </ul>
+                    </div>
+
+                </div>
+                <flux:separator text="or" />
+                <di class="mt-3 flex justify-center">
+                    <p class="text-center ">Already subscribed?</p>&nbsp;<a class="text-amber-400" href="{{ route('dashboard') }}">Login now</a>
+                </di>
+            </div>
+        </flux:modal>
+
     </flux:header>
 
     <flux:main class="dark:bg-gray-900 bg-gray-100">