313 lines
18 KiB
PHP
313 lines
18 KiB
PHP
<!DOCTYPE html>
|
||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<title>@yield('title', config('app.settings.app_title'))</title>
|
||
<meta name="description" content="@yield('description', config('app.settings.app_description'))">
|
||
<meta name="keywords" content="@yield('keywords', config('app.settings.app_keyword'))">
|
||
@forelse (json_decode(config('app.settings.app_meta')) as $key => $value)
|
||
@if ($value)
|
||
<meta name="{{ $key }}" content="{{ $value }}">
|
||
@endif
|
||
@empty
|
||
@endforelse
|
||
|
||
@yield('metas')
|
||
|
||
@if (file_exists(public_path('build/manifest.json')) || file_exists(public_path('hot')))
|
||
@vite(['resources/css/app.css', 'resources/css/boil.css', 'resources/js/app.js', 'resources/js/boil.js'])
|
||
@endif
|
||
<link rel="icon" type="image/png" href="{{ asset('images/logo.webp') }}">
|
||
@fluxAppearance
|
||
{!! config('app.settings.app_header') !!}
|
||
@yield('custom_header')
|
||
</head>
|
||
<body class="min-h-screen bg-white dark:bg-zinc-800">
|
||
<flux:sidebar sticky stashable class="bg-zinc-50 dark:bg-zinc-900 border-r rtl:border-r-0 rtl:border-l border-zinc-200 dark:border-zinc-700">
|
||
<flux:sidebar.toggle class="lg:hidden" icon="x-mark" />
|
||
<a class="flex items-center px-2 py-2 cursor-pointer" href="{{ route('home') }}">
|
||
<img src="{{ asset('images/zemail-logo-light.webp') }}" class="dark:hidden" alt="logo"/>
|
||
<img src="{{ asset('images/zemail-logo-dark.webp') }}" class="hidden dark:flex" alt="logo"/>
|
||
</a>
|
||
|
||
<flux:navlist variant="outline">
|
||
<flux:button class="cursor-pointer inbox-btn" variant="filled" icon="inbox" x-on:click="window.location.href = '{{ route('mailbox') }}'">{{ __('Inbox') }}</flux:button>
|
||
<button type="button" class="relative items-center font-medium justify-center gap-2 whitespace-nowrap disabled:opacity-75 dark:disabled:opacity-75 disabled:cursor-default disabled:pointer-events-none h-10 text-sm rounded-lg px-4 inline-flex bg-zinc-800/5 hover:bg-zinc-800/10 dark:bg-white/10 dark:hover:bg-white/20 text-zinc-800 dark:text-white [[data-flux-button-group]_&]:border-e [:is([data-flux-button-group]>&:last-child,_[data-flux-button-group]_:last-child>&)]:border-e-0 [[data-flux-button-group]_&]:border-zinc-200/80 dark:[[data-flux-button-group]_&]:border-zinc-900/50 mt-2 cursor-pointer" data-flux-button="data-flux-button" data-flux-group-target="data-flux-group-target" x-on:click="Livewire.dispatch('fetchMessages'); document.getElementById('refresh-icon').classList.add('animate-spin')">
|
||
<svg id="refresh-icon" class="shrink-0 [:where(&)]:size-4" data-flux-icon="" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" data-slot="icon">
|
||
<path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path>
|
||
<path d="M21 3v5h-5"></path>
|
||
<path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path>
|
||
<path d="M8 16H3v5"></path>
|
||
</svg>
|
||
|
||
{{ __('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>
|
||
</div>
|
||
<div class="magic-box">
|
||
{!! json_decode(config('app.settings.ads_settings'))->one !!}
|
||
</div>
|
||
<flux:spacer />
|
||
<flux:navlist variant="outline">
|
||
@if(config('app.menus'))
|
||
@foreach(config('app.menus') as $menu)
|
||
<a href="{{ $menu->url }}" class="h-10 lg:h-8 relative flex items-center gap-3 rounded-lg py-0 text-start w-full px-3 my-px text-zinc-500 dark:text-white/80 data-current:text-(--color-accent-content) hover:data-current:text-(--color-accent-content) data-current:bg-white dark:data-current:bg-white/[7%] data-current:border data-current:border-zinc-200 dark:data-current:border-transparent hover:text-zinc-800 dark:hover:text-white dark:hover:bg-white/[7%] hover:bg-zinc-800/5 border border-transparent" data-flux-navlist-item="data-flux-navlist-item" @if ($menu->new_tab == 1) target="_blank" @endif>
|
||
<div class="flex-1 text-sm font-medium leading-none whitespace-nowrap [[data-nav-footer]_&]:hidden [[data-nav-sidebar]_[data-nav-footer]_&]:block" data-content="">{{ $menu->name }}</div>
|
||
</a>
|
||
@endforeach
|
||
@endif
|
||
<flux:separator variant="subtle" />
|
||
</flux:navlist>
|
||
<p class="text-sm font-medium dark:text-white accent-zinc-700">© 2020–{{ date('Y') }} – All Rights Reserved {{ config('app.settings.app_name') }} | Coded with ♥️</p>
|
||
</flux:sidebar>
|
||
|
||
<flux:header sticky container class="bg-zinc-50 dark:bg-zinc-900 border-b border-zinc-200 dark:border-zinc-700">
|
||
<div class="flex items-center w-full gap-4">
|
||
<div class="flex items-center gap-2 flex-grow overflow-hidden">
|
||
<flux:sidebar.toggle class="lg:hidden" icon="bars-3-bottom-left" inset="left" />
|
||
<flux:separator vertical class="lg:hidden lg:mx-0 mx-3" />
|
||
<flux:icon.mail variant="mini"/>
|
||
<div class="min-w-0 overflow-hidden">
|
||
<livewire:frontend.email type="header"/>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-center gap-2 flex-shrink-0">
|
||
<flux:navbar>
|
||
<flux:dropdown position="top" align="start">
|
||
<flux:tooltip content="Language">
|
||
<flux:button x-data x-on:click="" icon="language" variant="subtle" aria-label="Language" />
|
||
</flux:tooltip>
|
||
<flux:menu>
|
||
<span>
|
||
@foreach(config('app.locales') as $item => $language)
|
||
<span x-on:click="window.location.href ='{{ route('locale', $language) }}'" role="menuitem" class="cursor-pointer group dark:hover:bg-zinc-600/75 dark:hover:text-gray-300 dark:focus:bg-zinc-600/75 dark:focus:text-gray-300 flex items-center px-4 py-2 dark:text-gray-400 text-gray-700 hover:text-gray-900 focus:text-gray-900 text-sm leading-5 hover:bg-gray-100 focus:bg-gray-100 focus:outline-none truncate">{{ config('app.locales_text')[$item] }}</span>
|
||
@endforeach
|
||
</span>
|
||
</flux:menu>
|
||
</flux:dropdown>
|
||
|
||
<flux:tooltip content="Switch Theme">
|
||
<flux:button x-on:click="$flux.dark = ! $flux.dark" icon="sun" variant="subtle" aria-label="Toggle dark mode">
|
||
{{-- <flux:icon.sun x-show="$flux.appearance === 'dark'" variant="mini" />--}}
|
||
{{-- <flux:icon.moon x-show="$flux.appearance === 'light'" variant="mini" />--}}
|
||
{{-- <flux:icon.computer-desktop x-show="$flux.appearance === 'system'" variant="mini" />--}}
|
||
</flux:button>
|
||
</flux:tooltip>
|
||
<flux:dropdown position="top" align="start">
|
||
<flux:tooltip content="Account">
|
||
<flux:button icon="circle-user-round" variant="subtle" aria-label="Account" />
|
||
</flux:tooltip>
|
||
<flux:menu>
|
||
<flux:text class="p-1">{{ __('You are signed in as:') }}</flux:text>
|
||
<div wire:ignore>
|
||
<livewire:frontend.email />
|
||
</div>
|
||
<flux:menu.separator />
|
||
<div class="flex">
|
||
<flux:modal.trigger name="create-account">
|
||
<flux:button class="p-1 w-full" variant="outline" icon="mail-plus" style="">{{ __('New') }}</flux:button>
|
||
</flux:modal.trigger>
|
||
<flux:modal.trigger name="delete-account">
|
||
<flux:tooltip content="{{ __('Delete') }}">
|
||
<flux:button class="ml-1 p-1" icon="trash" variant="outline" style="color:#F14743;"></flux:button>
|
||
</flux:tooltip>
|
||
</flux:modal.trigger>
|
||
</div>
|
||
@auth
|
||
<flux:menu.separator />
|
||
<button type="button" x-on:click="window.location.href = '{{ route('dashboard') }}'" class="premium-btn mt-2 w-full">
|
||
<span class="crown"></span>
|
||
<span class="crown-bg1"></span>
|
||
<span class="crown-bg2"></span>
|
||
<span class="btn-text">Login</span>
|
||
</button>
|
||
@endauth
|
||
@guest
|
||
<flux:menu.separator />
|
||
<flux:modal.trigger name="premium">
|
||
<button type="button" class="premium-btn mt-2 w-full">
|
||
<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>
|
||
@endguest
|
||
</flux:menu>
|
||
</flux:dropdown>
|
||
</flux:navbar>
|
||
</div>
|
||
</div>
|
||
|
||
<flux:modal name="create-account" class="md:w-96">
|
||
<div class="space-y-6">
|
||
<div>
|
||
<flux:heading size="lg">Generate Your Temporary Email</flux:heading>
|
||
</div>
|
||
|
||
<livewire:frontend.action action="customEmail" />
|
||
<flux:separator text="or" />
|
||
|
||
<div class="flex w-full">
|
||
<div class="w-1/2">
|
||
<livewire:frontend.action action="random" />
|
||
</div>
|
||
<div class="w-1/2">
|
||
<livewire:frontend.action action="gmail" />
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</flux:modal>
|
||
|
||
<flux:modal name="delete-account" class="min-w-[22rem]">
|
||
<div class="space-y-6">
|
||
<div>
|
||
<flux:heading size="lg">Delete account?</flux:heading>
|
||
<flux:text class="mt-2">
|
||
<p>You're about to delete this account.</p>
|
||
</flux:text>
|
||
</div>
|
||
<div class="flex gap-2">
|
||
<flux:spacer />
|
||
<flux:modal.close>
|
||
<flux:button variant="ghost">Cancel</flux:button>
|
||
</flux:modal.close>
|
||
<livewire:frontend.action action="delete" />
|
||
</div>
|
||
</div>
|
||
</flux:modal>
|
||
|
||
<flux:modal name="premium" class="min-w-[22rem]" class="bg-pricing-modal">
|
||
<div class="space-y-6">
|
||
<div>
|
||
<div id="premium-modal-limit" class="mt-10 w-full justify-center hidden">
|
||
<p class=" font-mono text-amber-500 text-center">
|
||
Looks like you have the daily email generation limit, consider subscribing and access to premium features
|
||
</p>
|
||
</div>
|
||
<!-- From Uiverse.io by themrsami -->
|
||
<div class="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 id="focus-modal-text1" class="ml-2 text-accent wrap-normal">Unlimited email addresses on public domains</span>
|
||
</li>
|
||
<li class="flex mb-4 items-center">
|
||
<flux:icon.check />
|
||
<span id="focus-modal-text2" class="ml-2 text-accent wrap-normal">Up to 100 email addresses daily on premium domains</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> <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">
|
||
{{ $slot }}
|
||
<div class="magic-box mt-3">
|
||
{!! json_decode(config('app.settings.ads_settings'))->two !!}
|
||
</div>
|
||
</flux:main>
|
||
<!-- Toast Container -->
|
||
<div id="toast-container" class="fixed top-5 left-1/2 transform -translate-x-1/2 z-50 space-y-4"></div>
|
||
<p class="ionize hidden" id="gR7pT9xLwQ" sync="{{ config('app.auto_fetch_mail') }}">{{ csrf_token() }}</p>
|
||
<p class="hidden" id="copyEmailText">{{ __('Email ID Copied to Clipboard') }}</p>
|
||
@fluxScripts
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
|
||
setTimeout(() => {
|
||
const email = '{{ App\Models\ZEmail::getEmail(true) }}';
|
||
const add_mail_in_title = "{{ json_decode(config('app.settings.configuration_settings'))->add_mail_in_title ? 'yes' : 'no' }}"
|
||
if(add_mail_in_title === 'yes') {
|
||
document.title += ` - ${email}`;
|
||
}
|
||
Livewire.dispatch('updateEmail');
|
||
}, 2000);
|
||
|
||
document.addEventListener('stopLoader', () => {
|
||
document.querySelectorAll('#refresh-icon').forEach(el => {
|
||
setTimeout(() => {
|
||
el.classList.remove('animate-spin');
|
||
}, 1000);
|
||
});
|
||
});
|
||
|
||
let counter = parseInt({{ json_decode(config('app.settings.configuration_settings'))->fetch_seconds }});
|
||
setInterval(() => {
|
||
if (counter === 0 && document.getElementById('imap-error') === null && !document.hidden) {
|
||
document.querySelectorAll('#refresh-icon').forEach(el => {
|
||
el.classList.add('animate-spin');
|
||
});
|
||
Livewire.dispatch('fetchMessages');
|
||
counter = parseInt({{ json_decode(config('app.settings.configuration_settings'))->fetch_seconds }});
|
||
}
|
||
counter--;
|
||
if(document.hidden) {
|
||
counter = 1;
|
||
}
|
||
}, 1000);
|
||
});
|
||
</script>
|
||
{!! config('app.settings.app_footer') !!}
|
||
@yield('custom_footer')
|
||
</body>
|
||
</html>
|