Skip to content

Commit c2eff51

Browse files
TripleU613TripleU613
committed
Restore legacy reseller/ease images
1 parent 50ec397 commit c2eff51

1 file changed

Lines changed: 19 additions & 128 deletions

File tree

‎src/pages/EGate.jsx‎

Lines changed: 19 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -211,11 +211,24 @@ function Highlights() {
211211
<div className="px-8 pt-8 sm:px-10 sm:pt-10">
212212
<p className="text-xl font-semibold text-white">Easy-to-use design</p>
213213
<p className="mt-3 text-sm text-slate-300">
214-
Redesigned mock UI shows how quick actions, toggles, and reports sit inside the console without touching the legacy assets.
214+
Direct lift from the legacy site: the UI showcase stays front-and-center with the same video placement.
215215
</p>
216216
</div>
217217
<div className="relative mx-auto flex w-full max-w-sm flex-1 items-center justify-center px-8 pb-10 pt-8 lg:max-w-full">
218-
<EaseOfUseMock />
218+
<div className="h-[22rem] w-full max-w-md rounded-[2rem] border border-white/10 bg-gradient-to-b from-slate-950 to-slate-900 p-4 shadow-2xl">
219+
<div className="flex h-full w-full items-center justify-center rounded-[1.5rem] bg-black/70 p-4">
220+
<video
221+
src="/img/qinf21.mp4"
222+
className="h-full w-full rounded-2xl object-contain"
223+
autoPlay
224+
loop
225+
muted
226+
playsInline
227+
onLoadedData={slowVideoPlayback}
228+
style={{ transform: 'scale(0.92)' }}
229+
/>
230+
</div>
231+
</div>
219232
</div>
220233
</CardChrome>
221234
</article>
@@ -249,11 +262,13 @@ function Highlights() {
249262
<div className="px-8 pt-8 sm:px-10 sm:pt-10">
250263
<p className="text-xl font-semibold text-white">Reseller portal</p>
251264
<p className="mt-3 text-sm text-slate-300">
252-
Purpose-built partner dashboard visualization with active licenses, approval badges, and one-click remote actions.
265+
The same screenshot from the legacy .io page showcases bulk license controls and remote toggles.
253266
</p>
254267
</div>
255268
<div className="relative flex flex-1 items-center justify-center px-8 pb-10 pt-6">
256-
<ResellerPortalMock />
269+
<div className="w-full rounded-3xl border border-white/10 bg-slate-900 shadow-2xl">
270+
<img src="/img/home/reseller.png" alt="Reseller portal" className="h-full w-full rounded-3xl object-cover" />
271+
</div>
257272
</div>
258273
</CardChrome>
259274
</article>
@@ -271,130 +286,6 @@ function CardChrome({ children, className = '' }) {
271286
);
272287
}
273288

274-
function EaseOfUseMock() {
275-
const shortcuts = ['Profiles', 'App guard', 'Connectivity', 'Reports'];
276-
const toggles = [
277-
{ label: 'Play Store', status: 'Blocked', color: 'bg-rose-400/60' },
278-
{ label: 'WebView', status: 'Locked', color: 'bg-amber-300/60' },
279-
{ label: 'Hotspot', status: 'Disabled', color: 'bg-emerald-400/60' },
280-
];
281-
282-
return (
283-
<div className="h-[22rem] w-full max-w-md rounded-[2rem] border border-white/10 bg-gradient-to-b from-slate-950 to-slate-900 p-5 shadow-2xl">
284-
<div className="flex items-center justify-between text-xs text-slate-400">
285-
<span>Offline Console</span>
286-
<span className="flex items-center gap-2 text-emerald-300">
287-
<span className="h-1.5 w-1.5 animate-pulse rounded-full bg-emerald-300" />
288-
Live
289-
</span>
290-
</div>
291-
<div className="mt-4 flex flex-wrap gap-2">
292-
{shortcuts.map((shortcut) => (
293-
<button
294-
key={shortcut}
295-
type="button"
296-
className="rounded-full border border-white/10 bg-white/5 px-3 py-1 text-xs font-semibold text-slate-200 hover:border-sky-400"
297-
>
298-
{shortcut}
299-
</button>
300-
))}
301-
</div>
302-
<div className="mt-5 rounded-[1.5rem] border border-white/5 bg-black/40 p-4 shadow-inner">
303-
<p className="text-sm font-semibold text-white">Quick toggles</p>
304-
<p className="text-xs text-slate-400">Applies instantly to 480 managed devices</p>
305-
<div className="mt-4 space-y-3">
306-
{toggles.map((toggle) => (
307-
<div key={toggle.label} className="flex items-center justify-between rounded-2xl bg-white/5 px-4 py-3">
308-
<div>
309-
<p className="text-sm font-semibold text-white">{toggle.label}</p>
310-
<p className="text-xs text-slate-400">MDM enforced</p>
311-
</div>
312-
<span className={`rounded-full px-3 py-1 text-xs font-semibold text-slate-900 ${toggle.color}`}>{toggle.status}</span>
313-
</div>
314-
))}
315-
</div>
316-
</div>
317-
<div className="mt-4 grid grid-cols-3 gap-3 text-center text-xs">
318-
<div className="rounded-2xl border border-white/10 bg-white/5 px-3 py-2 text-slate-300">
319-
<p className="text-2xl font-semibold text-white">43</p>
320-
Tasks queued
321-
</div>
322-
<div className="rounded-2xl border border-white/10 bg-white/5 px-3 py-2 text-slate-300">
323-
<p className="text-2xl font-semibold text-white">8</p>
324-
Pending approvals
325-
</div>
326-
<div className="rounded-2xl border border-white/10 bg-white/5 px-3 py-2 text-slate-300">
327-
<p className="text-2xl font-semibold text-white">2m</p>
328-
Avg. rollout
329-
</div>
330-
</div>
331-
</div>
332-
);
333-
}
334-
335-
function ResellerPortalMock() {
336-
const partners = [
337-
{ name: 'Torah Tech', seats: 120, status: 'Healthy', color: 'text-emerald-300' },
338-
{ name: 'Meshulach IT', seats: 64, status: 'Review', color: 'text-amber-200' },
339-
{ name: 'Yeshiva Secure', seats: 210, status: 'Syncing', color: 'text-sky-300' },
340-
];
341-
342-
return (
343-
<div className="w-full rounded-[2rem] border border-white/10 bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950 p-6 text-white shadow-2xl">
344-
<div className="flex items-center justify-between text-xs text-slate-300">
345-
<span>Reseller dashboard</span>
346-
<span className="flex items-center gap-2 text-slate-100">
347-
<i className="fa-solid fa-circle-nodes text-sky-300" />
348-
Synced
349-
</span>
350-
</div>
351-
<div className="mt-4 grid grid-cols-2 gap-3 text-left text-xs text-slate-300">
352-
<div className="rounded-2xl border border-white/10 bg-white/5 p-4">
353-
<p className="text-sm font-semibold text-white">Active licenses</p>
354-
<p className="mt-1 text-3xl font-bold text-emerald-300">1,284</p>
355-
<p className="text-[11px] text-emerald-200/80">+36 this week</p>
356-
</div>
357-
<div className="rounded-2xl border border-white/10 bg-white/5 p-4">
358-
<p className="text-sm font-semibold text-white">Automation health</p>
359-
<div className="mt-2 flex items-center gap-2">
360-
<span className="h-2 w-2 rounded-full bg-emerald-400" />
361-
<span className="text-sm text-white">All systems running</span>
362-
</div>
363-
<div className="mt-3 h-2 rounded-full bg-white/10">
364-
<div className="h-full w-3/4 rounded-full bg-gradient-to-r from-emerald-400 to-sky-400" />
365-
</div>
366-
</div>
367-
</div>
368-
<div className="mt-5 rounded-[1.75rem] border border-white/5 bg-black/40 p-4">
369-
<p className="text-sm font-semibold">Partners</p>
370-
<div className="mt-3 space-y-3">
371-
{partners.map((partner) => (
372-
<div key={partner.name} className="flex items-center justify-between rounded-2xl bg-white/5 px-4 py-3 text-xs">
373-
<div>
374-
<p className="text-sm font-semibold text-white">{partner.name}</p>
375-
<p className="text-slate-400">{partner.seats} seats</p>
376-
</div>
377-
<span className={`flex items-center gap-2 rounded-full border border-white/10 px-3 py-1 font-semibold ${partner.color}`}>
378-
<span className="h-1.5 w-1.5 rounded-full bg-current" />
379-
{partner.status}
380-
</span>
381-
</div>
382-
))}
383-
</div>
384-
</div>
385-
<div className="mt-4 flex items-center justify-between rounded-[1.5rem] border border-white/10 bg-white/5 px-4 py-3 text-xs text-slate-200">
386-
<span>Next bulk update: 02:30 AM</span>
387-
<button
388-
type="button"
389-
className="rounded-full bg-sky-500/90 px-3 py-1 text-[11px] font-semibold text-slate-950 hover:bg-sky-400"
390-
>
391-
Trigger now
392-
</button>
393-
</div>
394-
</div>
395-
);
396-
}
397-
398289
function PasswordBadge() {
399290
return (
400291
<div className="relative w-full max-w-xs rounded-[1.75rem] border border-white/10 bg-gradient-to-br from-slate-950 via-slate-900 to-sky-900 p-6 text-center text-white shadow-xl">

0 commit comments

Comments
 (0)