| Current File : /home/getxxhzo/app.genicards.com/resources/views/front/home/home1.blade.php |
@extends('front.layouts.app1')
@section('title')
{{ getAppName() }}
@endsection
@section('content')
<!-- start hero section -->
<section class="hero-section position-relative pb-60" @if (checkFrontLanguageSession() == 'ar') dir="rtl" @endif>
<div class="container"> @include('flash::message') </div>
<div class="hero-bg-img text-end">
<img src="{{ asset('assets/img/new_home_page/hero-bg.png') }}" class="w-100 h-100" alt="hero-img" />
</div>
<div class="container position-relative">
<div class="row align-items-center">
<div class="col-lg-6 text-lg-start text-center mb-lg-0 mb-md-5 mb-4">
<div class="hero-content">
<h1 class="text-black mb-2">{{ $setting['home_page_title'] }}</h1>
<p class="text-gray-100 fs-18 mb-40 ">
{{ $setting['sub_text'] ?? '' }}
</p>
<div class="position-relative vcard-alias-search">
<input id="search-alias-input" type="text" class="form-control" placeholder="{{ __('messages.vcard.search_vcard_alias') }}" required>
<button id="search-alias-btn" type="submit" class="btn btn-sm-success btn-primary top-50 end-0 me-2">
{{ __('messages.vcard.available') }}
</button>
</div>
<div id="search-alias-error" class="text-danger mt-1 ms-1 d-none">{{ __('messages.vcard.already_alias_url') }}</div>
<div id="search-alias-success" class="text-success mt-1 ms-1 d-none">{{ __('messages.vcard.url_alias_available') }}</div>
{{-- <a href="{{ route('register') }}" class="btn btn-primary" role="button" data-turbo="false">
{{ __('auth.get_started') }}</a> --}}
</div>
</div>
<div class="col-lg-6 text-center mt-lg-0 mt-4">
<div class="hero-img mx-auto">
<img src="{{ isset($setting['home_page_banner']) ? $setting['home_page_banner'] : asset('assets/img/new_front/hero-img.png') }}"
alt="Vcard" class="zoom-in-zoom-out w-100 h-auto" />
</div>
</div>
</div>
</div>
<div class="main-banner banner-img-1">
<img src="{{ asset('assets/img/new_home_page/shape-1.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-2">
<img src="{{ asset('assets/img/new_home_page/shape-2.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-3">
<img src="{{ asset('assets/img/new_home_page/shape-3.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-4">
<img src="{{ asset('assets/img/new_home_page/shape-4.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-5">
<img src="{{ asset('assets/img/new_home_page/shape-5.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-6">
<img src="{{ asset('assets/img/new_home_page/shape-6.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-7">
<img src="{{ asset('assets/img/new_home_page/shape-7.png') }}" class="w-100 h-auto" alt="image">
</div>
<div class="main-banner banner-img-8">
<img src="{{ asset('assets/img/new_home_page/shape-8.png') }}" class="w-100 h-auto" alt="image">
</div>
</section>
<!-- end hero section -->
<div class="vcard-template-section pt-60 pb-100 position-relative">
<div class="vcard-bg position-absolute">
<img src="{{ asset('assets/img/new_home_page/vcard-template-bg.png') }}" alt="vcard-bg" class="w-100 h-auto">
</div>
<div class="plus-vector1 position-absolute">
<img src="{{ asset('assets/img/new_home_page/plus-vector.png') }}" alt="vector" class="w-100 h-auto">
</div>
<div class="plus-vector2 position-absolute">
<img src="{{ asset('assets/img/new_home_page/plus-vector.png') }}" alt="vector" class="w-100 h-auto">
</div>
<div class="plus-vector3 position-absolute">
<img src="{{ asset('assets/img/new_home_page/plus-vector2.png') }}" alt="vector" class="w-100 h-auto">
</div>
{{-- vcard slider --}}
<section class="vcard-section pb-100" id="">
<div class="container w-100">
<div class="section-heading text-center mb-60">
<h2 class="d-inline-block"> {{ __('messages.vcards_templates') }}</h2>
</div>
<div class="center-slider">
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard33.png') }}" class="w-100 vcard-img"
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard32.png') }}" class="img-fluid vcard-img"
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard31.png') }}" class="w-100 vcard-img "
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard30.png') }}" class="w-100 vcard-img"
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard29.png') }}" class="w-100 vcard-img"
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard28.png') }}" class="w-100 vcard-img"
alt="vcard-img">
</div>
</div>
<div>
<div class="vcard-card">
<img src="{{ asset('assets/img/templates/home/vcard27.png') }}" class="w-100 vcard-img"
alt="vcard-img">
</div>
</div>
</div>
<div class="col-12 text-center mt-5">
<a href="{{ route('vcard-templates') }}" class="btn btn-primary-light" role="button"
data-turbo="false">{{ __('messages.common.view_more') }}</a>
</div>
</div>
</section>
</div>
<!-- start features section -->
<section class="features-section overflow-hidden @if (checkFrontLanguageSession() == 'ar') rtl @endif" id="frontFeaturesTab">
<div class="container">
<div class="section-heading text-start mb-60">
<h2 class="d-inline-block">{{ __('messages.plan.features') }}</h2>
</div>
<div class="feature-slider">
@foreach ($features as $feature)
<div class="">
<div class="feature-card">
<div class="card-img overflow-hidden">
<img src="{{ $feature->profile_image }}" class="w-100 h-100 object-fit-cover"
alt="feature-img">
</div>
<div class="card-body p-0">
<h3 class="fs-18 mb-3">{{ $feature->name }}</h3>
<p class="text-gray-100 mb-0">{!! $feature->description !!}
</p>
</div>
</div>
</div>
@endforeach
</div>
</div>
</section>
<!-- end features section -->
<!-- start modern & powerful-interface section -->
<section class="modern-interface-section overflow-hidden pb-100" id="frontAboutTabUsTab"
@if (checkFrontLanguageSession() == 'ar') dir="rtl" @endif>
<div class="container">
<div class="section-heading text-center mb-60">
<h2 class="d-inline-block">{{ __('auth.modern_&_powerful_interface') }}</h2>
</div>
<div class="interface-card mb-40">
<div class="row m-0 pb-2 justify-content-between align-items-center">
<div class="col-lg-5 col-md-6 mb-md-0 mb-40">
<div class="interface-img">
<img class="h-auto w-100"
src="{{ isset($aboutUS[0]['about_url']) ? $aboutUS[0]['about_url'] : asset('front/images/about-1.png') }}"
alt="interface-img">
</div>
</div>
<div class="col-lg-6 col-md-6">
<div class="card-desc ps-lg-0 ps-md-4">
<h3 class="card-title fs-20 fw-6 mb-3">
{{ $aboutUS[0]['title'] }}
</h3>
<p class="card-text text-gray-100">
{!! nl2br(e($aboutUS[0]['description'])) !!}
</p>
</div>
</div>
</div>
</div>
<div class="interface-card mb-40">
<div class="row pb-2 m-0 flex-md-row flex-column-reverse justify-content-between align-items-center">
<div class="col-lg-6 col-md-6 pe-lg-0 pe-md-4">
<div class="card-desc">
<h3 class="card-title fs-20 fw-6 mb-3">
{{ $aboutUS[1]['title'] }}
</h3>
<p class="card-text text-gray-100">
{!! nl2br(e($aboutUS[1]['description'])) !!}
</p>
</div>
</div>
<div class="col-lg-5 col-md-6 mb-md-0 mb-40">
<div class="interface-img">
<img class="h-auto w-100"
src="{{ isset($aboutUS[1]['about_url']) ? $aboutUS[1]['about_url'] : asset('front/images/about-2.png') }}"
alt="interface img" />
</div>
</div>
</div>
</div>
<div class="interface-card">
<div class="row m-0 pb-2 justify-content-between align-items-center">
<div class="col-lg-5 col-md-6 mb-md-0 mb-40">
<div class="interface-img">
<img class="h-auto w-100"
src="{{ isset($aboutUS[2]['about_url']) ? $aboutUS[2]['about_url'] : asset('front/images/about-3.png') }}"
alt="interface img" />
</div>
</div>
<div class="col-lg-6 col-md-6">
<div class="card-desc ps-lg-0 ps-md-4">
<h3 class="card-title fs-20 fw-6 mb-3">
{{ $aboutUS[2]['title'] }}
</h3>
<p class="card-text text-gray-100">
{!! nl2br(e($aboutUS[2]['description'])) !!}
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- end modern & powerful-interface section -->
<!-- start pricing section -->
<section class="pricing-plan-section pb-100 @if (checkFrontLanguageSession() == 'ar') rtl @endif" id="frontPricingTab">
<div class="container">
<div class="section-heading text-center mb-60">
<h2 class="d-inline-block"> {{ __("auth.choose_a_plan_that's_right_for_you") }}</h2>
</div>
<div class="pricing-slider">
@foreach ($plans as $plan)
<div class="">
<div class="pricing-card h-100 position-relative">
@if ($plan->trial_days > 0)
<div class="trial-plan-lable">
<span class="px-4 py-1">{{ __('messages.subscription.trial_plan') }}</span>
</div>
@endif
<div class="pricing-card-body">
<div class="text-center">
<h3 class="card-title text-primary">{!! $plan->name !!}</h3>
<div
class="{{ getLoggedInUserRoleId() != getSuperAdminRoleId() ? '' : 'd-flex justify-content-center align-items-center mb-4' }}">
@if ($plan->custom_select == 1 && $plan->planCustomFields->isNotEmpty())
<h2 class="price text-center fw-5 mb-30">
{{ $plan->currency->currency_icon }} <span
class="custom-price-{{ $plan->id }}">{{ $plan->planCustomFields[0]->custom_vcard_price }}</span>
@if ($plan->frequency == 1)
<span class="fs-18">/ {{ __('messages.plan.monthly') }}</span>
@elseif($plan->frequency == 2)
<span class="fs-18">/ {{ __('messages.plan.yearly') }}</span>
@endif
</h2>
@else
<h2 class="price text-center fw-5 mb-30" id="price_{{ $plan->id }}">
{{ $plan->currency->currency_icon }} {{ $plan->price }}
@if ($plan->frequency == 1)
<span class="fs-18">/ {{ __('messages.plan.monthly') }}</span>
@elseif($plan->frequency == 2)
<span class="fs-18">/ {{ __('messages.plan.yearly') }}</span>
@endif
</h2>
@endif
<div
class="d-flex justify-content-center align-items-center {{ getLoggedInUserRoleId() != getSuperAdminRoleId() ? 'mb-4' : 'ms-2' }}">
@if ($plan->custom_select == 1 && $plan->planCustomFields->isNotEmpty())
{{-- <label
class="fs-18 mb-3 text-gray-100">{{ __('messages.plan.custom_no_of_vcards') }}</label> --}}
<select id="vcardNumber-{{ $plan->id }}"
class="form-select customSelect me-2"
data-plan-id="{{ $plan->id }}"
style="{{ getLoggedInUserRoleId() != getSuperAdminRoleId() ? 'width:30% !important; padding: 10px 30px' : 'width:100% !important; padding: 10px 30px' }}">
@foreach ($plan->planCustomFields as $customField)
@php
$formattedPrice = $customField->custom_vcard_price;
@endphp
<option value="{{ $customField->id }}"
data-price="{{ $formattedPrice }}"
data-currency="{{ $plan->currency->currency_code }}">
{{ $customField->custom_vcard_number }} </option>
@endforeach
</select>
@endif
<div class="text-center">
@if (getLoggedInUserRoleId() != getSuperAdminRoleId())
@if (getLogInUser() && getLoggedInUserRoleId() != getSuperAdminRoleId())
<div class="mx-auto">
@if (
!empty(getCurrentSubscription()) &&
$plan->id == getCurrentSubscription()->plan_id &&
!getCurrentSubscription()->isExpired())
@if ($plan->price != 0)
<button type="button"
class="btn btn-success rounded-3 mx-auto w-100 d-block cursor-remove-plan pricing-plan-button-active"
data-id="{{ $plan->id }}" data-turbo="false">
{{ __('messages.subscription.currently_active') }}</button>
@else
<button type="button"
class="btn btn-info rounded-3 mx-auto d-block cursor-remove-plan"
data-turbo="false">
{{ __('messages.subscription.renew_free_plan') }}
</button>
@endif
@else
@if (
!empty(getCurrentSubscription()) &&
!getCurrentSubscription()->isExpired() &&
($plan->price == 0 || $plan->price != 0))
@if ($plan->hasZeroPlan->count() == 0)
<a href="{{ $plan->price != 0 ? route('choose.payment.type', $plan->id) : 'javascript:void(0)' }}"
class="btn btn-primary rounded-3 mx-auto w-100 {{ $plan->price == 0 ? 'freePayment' : '' }}"
data-id="{{ $plan->id }}"
id="planId{{ $plan->id }}"
data-plan-price="{{ $plan->price }}"
data-turbo="false">
{{ __('messages.subscription.switch_plan') }}</a>
@else
<button type="button"
class="btn btn-info rounded-3 mx-auto d-block cursor-remove-plan"
data-turbo="false">
{{ __('messages.subscription.renew_free_plan') }}
</button>
@endif
@else
@if ($plan->hasZeroPlan->count() == 0)
<a href="{{ $plan->price != 0 ? route('choose.payment.type', $plan->id) : 'javascript:void(0)' }}"
class="btn btn-primary rounded-3 mx-auto w-100 {{ $plan->price == 0 ? 'freePayment' : '' }}"
data-id="{{ $plan->id }}"
id="planId{{ $plan->id }}"
data-plan-price="{{ $plan->price }}"
data-turbo="false">
{{ __('messages.subscription.choose_plan') }}</a>
@else
<button type="button"
class="btn btn-info rounded-3 mx-auto d-block cursor-remove-plan"
data-turbo="false">
{{ __('messages.subscription.renew_free_plan') }}
</button>
@endif
@endif
@endif
</div>
@else
<div class="mx-auto">
@if ($plan->hasZeroPlan->count() == 0)
<a href="{{ $plan->price != 0 ? route('choose.payment.type', $plan->id) : 'javascript:void(0)' }}"
class="btn btn-primary rounded-3 mx-auto w-100 {{ $plan->price == 0 ? 'freePayment' : '' }}"
data-id="{{ $plan->id }}"
data-plan-price="{{ $plan->price }}"
id="planId{{ $plan->id }}" data-turbo="false">
{{ __('messages.subscription.choose_plan') }}</a>
@else
<button type="button"
class="btn btn-info rounded-3 mx-auto d-block cursor-remove-plan"
data-turbo="false">
{{ __('messages.subscription.renew_free_plan') }}
</button>
@endif
</div>
@endif
@endif
</div>
</div>
</div>
</div>
<ul class="pricing-plan-list ps-xl-4 ps-lg-3 ps-md-4 ps-3 mb-60">
@if ($plan->trial_days > 0)
<li class="active-check">
<span class="check-box">
<i class="fa-solid fa-check"
style="font-size: 18px; color: #7638f9; margin-right: 20px"></i>
</span>
<label
class="">{{ __('messages.subscription.trial_plan') . ' (' . $plan->trial_days . ' ' . __('messages.plan.days') . ')' }}</label>
</li>
@endif
@if ($plan->custom_select == 0 && $plan->planCustomFields->isEmpty())
<li class="active-check">
<span class="check-box">
<i class="fa-solid fa-check"
style="font-size: 18px; color: #7638f9; margin-right: 20px"></i>
</span>
<label class="">{{ __('messages.plan.no_of_vcards') }}
: {{ $plan->no_of_vcards }}</label>
</li>
@endif
<li class="active-check">
<span class="check-box">
<i class="fa-solid fa-check"
style="font-size: 18px; color: #7638f9; margin-right: 20px"></i>
</span>
<label class="">{{ __('messages.plan.storage_limit') }}:
{{ $plan->storage_limit }} {{ __('messages.mb') }}</label>
</li>
@php
$skipCount =
$plan->custom_select == 0 && $plan->planCustomFields->isEmpty() ? 9 : 10;
@endphp
@foreach (collect(getPlanFeature($plan))->take($skipCount) as $feature => $value)
<li class="{{ $value == 1 ? 'active-check' : 'unactive-check' }}"
@if (checkFrontLanguageSession() == 'ar') style="text-align: right !important" @endif>
@if (checkFrontLanguageSession() == 'ar')
{{ __('messages.feature.' . $feature) }}
<span class="check-box">
<i class="fa-solid {{ $value == 1 ? 'fa-check' : 'fa-xmark' }}"></i>
</span>
@else
<span class="check-box">
<i class="fa-solid {{ $value == 1 ? 'fa-check' : 'fa-xmark' }}"></i>
</span>
{{ __('messages.feature.' . $feature) }}
@endif
</li>
@endforeach
<div class="all-features d-none" style="display: none;">
@foreach (collect(getPlanFeature($plan))->skip($skipCount) as $feature => $value)
<li class="{{ $value == 1 ? 'active-check' : 'unactive-check' }}"
@if (checkFrontLanguageSession() == 'ar') style="text-align: right !important" @endif>
@if (checkFrontLanguageSession() == 'ar')
{{ __('messages.feature.' . $feature) }}
<span class="check-box">
<i
class="fa-solid {{ $value == 1 ? 'fa-check' : 'fa-xmark' }}"></i>
</span>
@else
<span class="check-box">
<i
class="fa-solid {{ $value == 1 ? 'fa-check' : 'fa-xmark' }}"></i>
</span>
{{ __('messages.feature.' . $feature) }}
@endif
</li>
@endforeach
</div>
</ul>
<div class="text-center show-plan-features" id="seeMorePlanFeatures">
<i class="fa-solid fa-circle-chevron-down show-plan-icon-btn"></i>
</div>
<div class="text-center d-none less-plan-features" id="lessMorePlanFeatures">
<i class="fa-solid fa-circle-chevron-up less-plan-icon-btn"></i>
</div>
</div>
</div>
</div>
@endforeach
</div>
</div>
</section>
<!-- end pricing section -->
<!-- start testimonial section -->
@if (!$testimonials->isEmpty())
<section class="testimonial-section @if (checkFrontLanguageSession() == 'ar') rtl @endif">
<div class="section-heading text-center mb-60">
<h2 class="d-inline-block">{{ __('auth.stories_from_our_customers') }}</h2>
</div>
<div class="testimonial bg-light pt-50 pb-50">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="testimonial-slider">
@foreach ($testimonials as $testimonial)
<div class="">
<div class="testimonial-card mb-60">
<div class="quote-img">
<img src="{{ asset('assets/img/new_home_page/quote-img.png') }}"
alt="quotation" class="w-sm-100 w-50 h-auto">
</div>
<div class="profile-img">
<img src="{{ $testimonial->testimonial_url }}" alt="profile-img"
class="w-100 h-100 object-fit-cover">
</div>
<div class="profile-desc ps-3">
<p class="fs-20 mb-0 fw-6">{{ $testimonial->name }}</p>
</div>
<p class="mt-4 mb-0 profile-text text-gray-100">{!! $testimonial->description !!}
</p>
</div>
</div>
@endforeach
</div>
</div>
</div>
</div>
</div>
</div>
</section>
@endif
<!-- end testimonial section -->
<!-- start contact section -->
<section class="contact-section pt-100 pb-100" id="frontContactUsTab"
@if (checkFrontLanguageSession() == 'ar') dir="rtl" @endif>
<div class="container">
<div class="row">
<div class="col-12 col-lg-6">
<div class="contact-info">
<div class="section-heading ms-0 mb-60">
<h2 class="d-inline-block">{{ __('messages.vcard_11.get_in_touch') }}</h2>
</div>
<div class="d-flex align-items-center contact-info__block">
<div class="contact-icon fs-2 d-flex align-items-center justify-content-center">
<i class="fa-solid fa-location-dot icon-purpul"></i>
</div>
<p class="address-text text-secondary mb-0">
{{ $setting['address'] }}
</p>
</div>
<div class="d-flex align-items-center contact-info__block">
<div class="contact-icon fs-2 d-flex align-items-center justify-content-center">
<i class="fa-solid fa-at icon-purpul"></i>
</div>
<a href="mailto:{{ $setting['email'] }}"
class="text-decoration-none text-secondary">{{ $setting['email'] }}</a>
</div>
<div class="d-flex align-items-center contact-info__block">
<div class="contact-icon fs-2 d-flex align-items-center justify-content-center">
<i class="fa-solid fa-phone icon-purpul"></i>
</div>
<a href=" tel:{{ $setting['phone'] }}"
class="text-decoration-none text-secondary" dir="ltr">{{ '+' . $setting['prefix_code'] . ' ' . $setting['phone'] }}</a>
</div>
</div>
</div>
<div class="col-12 col-lg-6">
<form class="contact-form" id="myForm">
@csrf
<div id="contactError" class="alert alert-danger d-none"></div>
<p class="text-center mb-40 fs-4 fw-6">{{ __('messages.contact_us.send_message') }}</p>
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<input name="name" id="name" type="text" class="form-control front-input"
placeholder="{{ __('messages.front.enter_your_name') }}" required>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<input name="email" id="email" type="email" class="form-control front-input"
placeholder="{{ __('messages.front.enter_your_email') }}" required>
</div>
</div>
<div class="col-lg-12">
<div class="mb-4">
<input name="subject" id="subject" type="text" class="form-control front-input"
placeholder="{{ __('messages.common.subject') }}" required>
</div>
</div>
<div class="col-lg-12">
<div class="mb-4">
<textarea name="message" id="message" rows="4" class="form-control h-100 form-textarea front-input"
placeholder="{{ __('messages.front.enter_your_message') }}" required></textarea>
</div>
</div>
<div class="col-lg-12 text-center">
<input type="submit" id="submit" name="send"
class="contact-section-submit-btn btn btn-primary w-auto front-input "
value="{{ __('messages.contact_us.send_message') }}">
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- end contact section -->
@endsection