<!--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html lang="zxx">
<head>
<title><?php echo $__env->yieldContent('title'); ?> Proudly African Ltd</title>
<!--/tags -->
<link rel="shortcut icon" href="<?php echo e(url('public/general/logos/favicon.png')); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Proudly African, online shoping, Best e-commerce site, online groceresie products" />
<meta name="description" content="Proudly African is best e-commerce site to find groceries product online and order them to your doorstep with some easy steps. Ckgroceries have numbers of groceries products available. " />
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<!--//tags -->
<link href="<?php echo e(URL::asset('public/general/css/bootstrap.css')); ?>" href="" rel="stylesheet" type="text/css" media="all" />
<link href="<?php echo e(URL::asset('public/general/css/style.css')); ?>" href="" rel="stylesheet" type="text/css" media="all" />
<link href="<?php echo e(URL::asset('public/general/css/font-awesome.css')); ?>" href="" rel="stylesheet">
<!--pop-up-box-->
<link href="<?php echo e(URL::asset('public/general/css/popuo-box.css')); ?>" href="" rel="stylesheet" type="text/css" media="all" />
<!--//pop-up-box-->
<!-- price range -->
<link href="<?php echo e(URL::asset('public/general/css/jquery-ui1.css')); ?>" rel="stylesheet" type="text/css" href="">
<!-- flexslider -->
<link href="<?php echo e(URL::asset('public/general/css/flexslider.css')); ?>" rel="stylesheet" href="" type="text/css" media="screen" />
<!-- fonts -->
<link href="//fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800" rel="stylesheet">
<style>
.product--size {
margin: 7px 0;
}
.product--size> span {
display: inline-block;
width: 62px;
border: 1px solid #999;
border-radius: 4px 4px;
text-align: center;
padding: 1px 2px;
text-transform: uppercase;
cursor: pointer;
}
.product--size> .active {
color: #fff;
background: #008080;
}
.product--size> .active:hover {
color: #000000;
background: white;
}
.wrapper {
padding: 0px !important;
}
.cat_image{
height: 217px;
}
.men-pro-item {
padding-bottom: 20px;
background: #FAFAFA;
position: relative;
}
.men-pro-item > .men-thumb-item > .cat_image{
background: white;
}
.khan{
min-height: 380px;
}
.mycolor{
background: #FF5722 !important;
}
</style>
<style>
@media screen and (max-width: 600px) {
.cat_image{
height: 120px !important;
}
.khan{
min-height: 322px;
}
.mybtn{
margin-top: 10px;
}
}
</style>
<style>
body, html {
font-family:Arial,sans-serif
}
h1,h2,h3,h4,p{
font-family:Arial,sans-serif
}
</style>
</head>
<body>
<!-- top-header -->
<!-- //top-header -->
<!-- header-bot-->
<div class="header-bot">
<div class="header-bot_inner_wthreeinfo_header_mid">
<!-- header-bot-->
<div class="col-md-4 logo_agile">
<h1>
<a href="<?php echo e(url('/')); ?>">
<img src=" <?php echo e(url('public/general/logos/africa png 2_013939.jpg')); ?>" alt=" ">
</a>
</h1>
</div>
<style>
/* Set the background color of body to tan */
/* On screens that are 992px or less, set the background color to blue */
/* On screens that are 600px or less, set the background color to olive */
@media screen and (max-width: 600px) {
.to_hide{
display: none !important;
}
}
</style>
<!-- header-bot -->
<div class="col-md-8 header">
<!-- header lists -->
<ul>
<li class="to_hide">
<a href="mailto:info@proudlyafrican.co.uk" style="font-size: 11px" >
info@proudlyafrican.co.uk
</a>
</li>
<li>
<span class="fa fa-phone" aria-hidden="true"></span>07360007821
</li>
<?php if(Session::Get('user_id')==""): ?>
<li>
<a href="#" data-toggle="modal" data-target="#myModal1">
<span class="fa fa-unlock-alt" aria-hidden="true"></span> Sign In </a>
</li>
<li>
<a href="#" data-toggle="modal" data-target="#myModal2">
<span class="fa fa-pencil-square-o" aria-hidden="true"></span> Sign Up </a>
</li>
<?php else: ?>
<li>
<a href="<?php echo e(url('userdashboard')); ?>">
<span class="fa fa-user" aria-hidden="true"></span> My Dashboard </a>
</li>
<li>
<a href="<?php echo e(url('userlogout')); ?>">
<span class="fa fa-power-off" aria-hidden="true"></span>Logout </a>
</li>
<?php endif; ?>
</ul>
<!-- //header lists -->
<!-- search -->
<div class="agileits_search">
<form action="<?php echo e(url('search')); ?>" method="get">
<input name="q" type="search" placeholder="Search Your Product" required="">
<button type="submit" class="btn btn-default" aria-label="Left Align">
<span class="fa fa-search" aria-hidden="true"> </span>
</button>
</form>
</div>
<!-- //search -->
<!-- cart details -->
<div class="top_nav_right">
<div class="wthreecartaits wthreecartaits2 cart cart box_1">
<a href="<?php echo e(url('view_cart')); ?>">
<button class="w3view-cart" type="submit" name="submit" value="">
<i class="fa fa-cart-arrow-down" aria-hidden="true"><span style="font-size: 12px">(</span><span id="cartcount" style="font-size: 12px">0</span><span style="font-size: 12px">)</span></i>
</button>
</a>
</div>
</div>
<!-- //cart details -->
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
</div>
<!-- shop locator (popup) -->
<!-- Button trigger modal(shop-locator) -->
<!-- //shop locator (popup) -->
<!-- signin Model -->
<!-- Modal1 -->
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body modal-body-sub_agile">
<div class="main-mailposi">
<span class="fa fa-envelope-o" aria-hidden="true"></span>
</div>
<div class="modal_body_left modal_body_left1">
<h3 class="agileinfo_sign">Sign In </h3>
<p>
Sign In now, Let's start your Grocery Shopping. Don't have an account?
<a href="#" data-toggle="modal" data-target="#myModal2">
Sign Up Now</a>
</p>
<form action="<?php echo e(url('user_login')); ?>" method="post">
<div align="center" id="login_failure" style="display: none">
<p style="color: red; font-weight: bold">
Email Or Password is wrong
</p>
</div>
<div class="styled-input agile-styled-input-top">
<input type="email" placeholder="User Email" id="login_email" name="login_email" required="">
</div>
<div class="styled-input">
<input type="password" placeholder="Password" id="login_password" name="password" required="">
</div>
<input type="submit" value="Sign In" class="btn-submit4">
<a href="#" data-toggle="modal" id="forget_password" style="float: right">
Forget Password</a>
</form>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
</div>
<!-- //Modal content-->
</div>
</div>
<!-- //Modal1 -->
<!-- //signin Model -->
<!-- signup Model -->
<!-- Modal2 -->
<div class="modal fade" id="forgetpasswordmodal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body modal-body-sub_agile">
<div class="main-mailposi">
<span class="fa fa-envelope-o" aria-hidden="true"></span>
</div>
<div class="modal_body_left modal_body_left1">
<h3 class="agileinfo_sign">Password Recovery</h3>
<div align="center" id="password_recovery_success" style="display: none">
<p style="color: green; font-weight: bold">
Check Your Email for Password Receovery.
</p>
</div>
<div align="center" id="password_recovery_failure" style="display: none">
<p style="color: red; font-weight: bold">
Email does not exists.
</p>
</div>
<form action="<?php echo e(url('usersendrecoveryemail')); ?>" method="post">
<input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
<div class="styled-input">
<input type="email" placeholder="E-mail" id="forget_password_email" name="email" required="">
</div>
<input type="submit" value="Submit" class="btn-submit5">
</form>
</div>
</div>
</div>
<!-- //Modal content-->
</div>
</div>
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body modal-body-sub_agile">
<div class="main-mailposi">
<span class="fa fa-envelope-o" aria-hidden="true"></span>
</div>
<div class="modal_body_left modal_body_left1">
<h3 class="agileinfo_sign">Sign Up</h3>
<p>
Come join the Proudly African! Let's set up your Account.
</p>
<div align="center" id="account_success" style="display: none">
<p style="color: green; font-weight: bold">
Thanks for creating account.
</p>
</div>
<div align="center" id="account_failure" style="display: none">
<p style="color: red; font-weight: bold">
Email Already Exists
</p>
</div>
<form action="<?php echo e(url('user_signup')); ?>" method="post">
<input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
<div class="styled-input agile-styled-input-top">
<input type="text" placeholder="First Name" id="fname" name="fname" required="">
</div>
<div class="styled-input agile-styled-input-top">
<input type="text" placeholder="Last Name" id="lname" name="lname" required="">
</div>
<div class="styled-input">
<input type="email" placeholder="E-mail" id="email" name="email" required="">
</div>
<div class="styled-input">
<input type="password" placeholder="Password" name="userpassword" id="userpassword" required="">
</div>
<div class="styled-input">
<input type="text" placeholder="Enter Phone Number" id="phoneno" name="phoneno" required="">
</div>
<input type="submit" value="Sign Up" class="btn-submit3">
</form>
</div>
</div>
</div>
<!-- //Modal content-->
</div>
</div>
<!-- //Modal2 -->
<!-- //signup Model -->
<!-- //header-bot -->
<!-- navigation -->
<div class="ban-top">
<div class="container">
<div class="agileits-navi_search">
<form action="#" method="post">
<select id="agileinfo-nav_search" onchange="countryHandler(this.value)" name="agileinfo_search" required="">
<option value="">All Categories</option>
<?php $__currentLoopData = $shared_categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<option value="<?php echo e($category->id); ?>"><?php echo e($category->name); ?></option>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</select>
</form>
</div>
<div class="top_nav_left">
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse menu--shylock" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav menu__list">
<li class="<?php echo e(request()->is('/') ? 'active' : ''); ?>">
<a class="nav-stylehead" href="<?php echo e(url('/')); ?>">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="dropdown">
<a class="nav-stylehead dropdown-toggle" href="#" data-toggle="dropdown">About Us
<b class="caret"></b>
</a>
<ul class="dropdown-menu agile_short_dropdown" style="margin-left: 0px">
<li>
<a class="nav-stylehead" href="<?php echo e(url('about_us')); ?>">About Proudly African</a>
</li>
<li>
<a class="nav-stylehead" href="<?php echo e(url('testimonials')); ?>">Testimonials</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle nav-stylehead" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Categories
<span class="caret"></span>
</a>
<ul class="dropdown-menu multi-column columns-3">
<div class="agile_inner_drop_nav_info">
<?php $__currentLoopData = $shared_categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<div class="col-sm-4 col-md-4 multi-gd-img">
<ul class="multi-column-dropdown">
<li>
<a style="font-weight: bold; font-size: 14px" href="<?php echo e(url('categorywise_products')); ?>/<?php echo e($category->id); ?>">
<?php
$product_count = DB::table('products')->where('category_id',$category->id)->get();
?>
<?php echo e($category->name); ?>-<?php echo e(count($product_count)); ?>
</a>
</li>
</ul>
</div>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
<div class="clearfix"></div>
</div>
</ul>
</li>
<li class="<?php echo e(request()->is('shop') ? 'active' : ''); ?>">
<a class="nav-stylehead" href="<?php echo e(url('shop')); ?>">Shop</a>
</li>
<li class="<?php echo e(request()->is('gallery') ? 'active' : ''); ?>">
<a class="nav-stylehead" href="<?php echo e(url('gallery')); ?>">Gallery</a>
</li>
<li class="<?php echo e(request()->is('contact_us') ? 'active' : ''); ?>">
<a class="nav-stylehead" href="<?php echo e(url('contact_us')); ?>">Contact Us</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
</div>
</div>
<!-- //navigation -->
<?php echo $__env->yieldContent('middle'); ?>
<!-- //special offers -->
<!-- newsletter -->
<div class="footer-top">
<div class="container-fluid">
<div class="col-xs-8 agile-leftmk">
<h2>Proudly African</h2>
<p>JOIN OUR MAILING LIST</p>
<div class="modal-note" id="loading2" style="display: none">
<p><img src="http://i.stack.imgur.com/FhHRx.gif" /> <span style="color: white; font-weight: bold">Please Wait</span></p>
</div>
<span id="message1" class="modal-note" style="color: green; font-weight: bold; font-size: 16px; display: none">Thanks for subcribing</span>
<span id="message2" class="modal-note" style="color: #ff0000; font-weight: bold; font-size: 16px; display: none">You Have Already Subscribed</span>
<form method="post" >
<input type="email" placeholder="E-mail" name="email"
id="s_email" required="">
<input type="submit" class="btn-submit2" value="Subscribe">
</form>
<div class="newsform-w3l">
<span class="fa fa-envelope-o" aria-hidden="true"></span>
</div>
</div>
<div class="col-xs-4 w3l-rightmk">
<img src="<?php echo e(url('public/general/images/tab3.png')); ?>" alt=" ">
</div>
<div class="clearfix"></div>
</div>
</div>
<!-- //newsletter -->
<!-- footer -->
<footer>
<div class="container">
<!-- footer first section -->
<!-- //footer first section -->
<!-- footer second section -->
<!-- //footer second section -->
<!-- footer third section -->
<div class="footer-info w3-agileits-info">
<!-- footer categories -->
<!-- //footer categories -->
<!-- quick links -->
<div class="col-sm-6 address-right">
<div class="col-xs-6 footer-grids">
<h3>Quick Links</h3>
<ul>
<li>
<a href="<?php echo e(url('about_us')); ?>">About Us</a>
</li>
<li>
<a href="<?php echo e(url('contact_us')); ?>">Contact Us</a>
</li>
<li>
<a href="<?php echo e(url('shop')); ?>">Shop</a>
</li>
<li>
<a href="<?php echo e(url('terms_and_conditions')); ?>">Terms And Conditions</a>
</li>
<li>
<a href="<?php echo e(url('privacy_policy')); ?>">Privacy Policy</a>
</li>
</ul>
</div>
<div class="col-xs-6 footer-grids">
<h3>Get in Touch</h3>
<ul>
<?php $__currentLoopData = $shared_address; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $address): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<li>
<i class="fa fa-map-marker"></i> <?php echo e($address->address); ?></li>
<li> <i class="fa fa-phone"></i> <?php echo e($address->call_number); ?> </li>
<li>
<a href="mailto:info@proudlyafrican.co.uk"> info@proudlyafrican.co.uk</a>
</li>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</ul>
</div>
</div>
<div class="col-sm-3 address-right">
<img style="height: 200px; width: 200px" src="<?php echo e(url('public/qrcode.png')); ?>">
</div>
<!-- //quick links -->
<!-- social icons -->
<div class="col-sm-2 footer-grids w3l-socialmk">
<h3>Follow Us on</h3>
<div class="social">
<ul>
<?php $__currentLoopData = $shared_socials; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $social): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<?php if($social->facebook_status=='E'): ?>
<li>
<a class="icon fb" href="<?php echo e($social->facebook); ?>">
<i class="fa fa-facebook"></i>
</a>
</li>
<?php endif; ?>
<?php if($social->twitter_status=='E'): ?>
<li>
<a class="icon tw" href="<?php echo e($social->twitter); ?>">
<i class="fa fa-twitter"></i>
</a>
</li>
<?php endif; ?>
<?php if($social->youtube_status=='E'): ?>
<li>
<a class="icon gp" href="<?php echo e($social->youtube); ?>">
<i class="fa fa-youtube"></i>
</a>
</li>
<?php endif; ?>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</ul>
</div>
<div class="agileits_app-devices">
<!-- <h5>Download the App</h5>-->
<a href="#">
<img src="images/1.png" alt="">
</a>
<a href="#">
<img src="images/2.png" alt="">
</a>
<div class="clearfix"> </div>
</div>
</div>
<!-- //social icons -->
<div class="clearfix"></div>
</div>
<!-- //footer third section -->
<!-- footer fourth section (text) -->
<!-- //footer fourth section (text) -->
</div>
</footer>
<!-- //footer -->
<!-- copyright -->
<style>
* {
margin: 0;
}
.wrapper {
padding: 32px;
}
.cookie-container {
position: fixed;
bottom: -100%;
left: 0;
right: 0;
background: #2f3640;
color: #f5f6fa;
padding: 0 32px;
box-shadow: 0 -2px 16px rgba(47, 54, 64, 0.39);
transition: 400ms;
}
.cookie-container.active {
bottom: 0;
}
.cookie-container a {
color: #f5f6fa;
}
.cookie-btn {
background: #e84118;
border: 0;
color: #f5f6fa;
padding: 12px 48px;
font-size: 18px;
margin-bottom: 16px;
border-radius: 8px;
cursor: pointer;
}
</style>
<div class="cookie-container">
<div align="center">
<p style=" margin: 24px 0;
line-height: 2;">
This website uses cookies to provide you with a great user experience. By using it, you accept our
<a href="<?php echo e(url('privacy_policy')); ?>" style="color: aliceblue; text-decoration: underline">Privacy Policy</a>.
</p>
<button class="cookie-btn">
Okay
</button>
</div>
</div>
<script>
const cookieContainer = document.querySelector(".cookie-container");
const cookieButton = document.querySelector(".cookie-btn");
cookieButton.addEventListener("click", () => {
cookieContainer.classList.remove("active");
localStorage.setItem("cookieBannerDisplayed", "true");
});
setTimeout(() => {
if (!localStorage.getItem("cookieBannerDisplayed")) {
cookieContainer.classList.add("active");
}
}, 1000);
</script>
<div class="copy-right">
<div class="container">
<p>© 2023 Proudly African E-Shop. All rights reserved | Design by
<a target="_blank" href="//bezaleelsolutions.com">Bezaleel Solutions.</a>
</p>
<div align="center">
<span style="float: right"><a target="_blank" href="//us3.webmail.mailhostbox.com" style="color: white">WebMail</a>|<a target="_blank" style="color: white" href="<?php echo e(url('adminlogin')); ?>">Dashboard</a></span>
</div>
</div>
</div>
<!-- //copyright -->
<!-- js-files -->
<!-- jquery -->
<script src="<?php echo e(url('public/general/js/jquery-2.1.4.min.js')); ?>" src=""></script>
<!-- //jquery -->
<!-- popup modal (for signin & signup)-->
<script src="<?php echo e(url('public/general/js/jquery.magnific-popup.js')); ?>" src=""></script>
<style>
.phone-call {
width: 50px;
height: 50px;
left: 20px;
bottom: 20px;
background: #10b418;
position: fixed;
text-align: center;
color: #ffffff;
cursor: pointer;
border-radius: 50%;
z-index: 99;
display: inline-block;
line-height: 47px;
}
.phone-call:before {
position: absolute;
content: " ";
z-index: -1;
top: -15px;
left: -15px;
background-color: #10b418;
width: 80px;
height: 80px;
border-radius: 100%;
animation-fill-mode: both;
-webkit-animation-fill-mode: both;
opacity: 0.6;
-webkit-animation: pulse 1s ease-out;
animation: pulse 1.8s ease-out;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale(0);
opacity: 0;
}
25% {
-webkit-transform: scale(0.3);
opacity: 1;
}
50% {
-webkit-transform: scale(0.6);
opacity: .6;
}
75% {
-webkit-transform: scale(0.9);
opacity: .3;
}
100% {
-webkit-transform: scale(1);
opacity: 0;
}
}
@keyframes pulse {
0% {
transform: scale(0);
opacity: 0;
}
25% {
transform: scale(0.3);
opacity: 1;
}
50% {
transform: scale(0.6);
opacity: .6;
}
75% {
transform: scale(0.9);
opacity: .3;
}
100% {
transform: scale(1);
opacity: 0;
}
}
</style>
<?php $__currentLoopData = $shared_address; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $address): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<?php $phone_number=$address->call_number; ?>
<?php $whatsapp_number=$address->whatsapp_number; ?>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
<a href="tel:<?php echo e($phone_number); ?>"><div class="phone-call"><img src="<?php echo e(url::asset('public/call.png')); ?>" width="50" alt="Call Now" title="Call Now"></div></a>
<style>
/* CSS Multiple Whatsapp Chat */
.whatsapp-name {
font-size: 16px;
font-weight: 600;
padding-bottom: 0;
margin-bottom: 0;
line-height: 0.5;
}
#whatsapp-chat {
box-sizing: border-box !important;
outline: none !important;
position: fixed;
width: 350px;
border-radius: 10px;
box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
bottom: 90px;
right: 30px;
overflow: hidden;
z-index: 99;
animation-name: showchat;
animation-duration: 1s;
transform: scale(1);
}
a.blantershow-chat {
/* background: #009688; */
background: #fff;
color: #404040;
position: fixed;
display: flex;
font-weight: 400;
justify-content: space-between;
z-index: 98;
bottom: 25px;
right: 30px;
font-size: 15px;
padding: 10px 20px;
border-radius: 30px;
box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
}
a.blantershow-chat svg {
transform: scale(1.2);
margin: 0 10px 0 0;
}
.header-chat {
/* background: linear-gradient(to right top, #6f96f3, #164ed2); */
background: #009688;
background: #095e54;
color: #fff;
padding: 7px;
}
.header-chat h3 {
margin: 0 0 10px;
}
.header-chat p {
font-size: 14px;
line-height: 1.7;
margin: 0;
}
.info-avatar {
position: relative;
}
.info-avatar img {
/*border-radius: 100%;*/
width: 100px;
float: left;
margin: 0 10px 0 0;
}
a.informasi {
padding: 20px;
display: block;
overflow: hidden;
animation-name: showhide;
animation-duration: 0.5s;
}
a.informasi:hover {
background: #f1f1f1;
}
.info-chat span {
display: block;
}
#get-label,
span.chat-label {
font-size: 12px;
color: #888;
}
#get-nama,
span.chat-nama {
margin: 5px 0 0;
font-size: 15px;
font-weight: 700;
color: #222;
}
#get-label,
#get-nama {
color: #fff;
}
span.my-number {
display: none;
}
/* .blanter-msg {
color: #444;
padding: 20px;
font-size: 12.5px;
text-align: center;
border-top: 1px solid #ddd;
} */
textarea#chat-input {
border: none;
font-family: "Arial", sans-serif;
width: 100%;
height: 20px;
outline: none;
resize: none;
padding: 10px;
font-size: 14px;
}
a#send-it {
width: 30px;
font-weight: 700;
padding: 10px 10px 0;
background:#eee;
border-radius: 10px;
svg {
fill:#a6a6a6;
height: 24px;
width: 24px;
}
}
.first-msg {
background: transparent;
padding: 30px;
text-align: center;
& span {
background: #e2e2e2;
color: #333;
font-size: 14.2px;
line-height: 1.7;
border-radius: 10px;
padding: 15px 20px;
display: inline-block;
}
}
.start-chat .blanter-msg {
display: flex;
}
#get-number {
display: none;
}
a.close-chat {
position: absolute;
top: 5px;
right: 15px;
color: #fff;
font-size: 30px;
}
@keyframes ZpjSY{
0% {
background-color: rgb(182, 181, 186);
}
15% {
background-color: rgb(17, 17, 17);
}
25% {
background-color: rgb(182, 181, 186);
}
}
@keyframes hPhMsj {
15% {
background-color: rgb(182, 181, 186);
}
25% {
background-color: rgb(17, 17, 17);
}
35% {
background-color: rgb(182, 181, 186);
}
}
@keyframes iUMejp {
25% {
background-color: rgb(182, 181, 186);
}
35% {
background-color: rgb(17, 17, 17);
}
45% {
background-color: rgb(182, 181, 186);
}
}
@keyframes showhide {
from {
transform: scale(0.5);
opacity: 0;
}
}
@keyframes showchat {
from {
transform: scale(0);
opacity: 0;
}
}
@media screen and (max-width: 480px) {
#whatsapp-chat {
width: auto;
left: 5%;
right: 5%;
font-size: 80%;
}
}
.hide {
display: none;
animation-name: showhide;
animation-duration: 0.5s;
transform: scale(1);
opacity: 1;
}
.show {
display: block;
animation-name: showhide;
animation-duration: 0.5s;
transform: scale(1);
opacity: 1;
}
.whatsapp-message-container {
display: flex;
z-index: 1;
}
.whatsapp-message {
padding: 7px 14px 6px;
background-color: rgb(255, 255, 255);
border-radius: 0px 8px 8px;
position: relative;
transition: all 0.3s ease 0s;
opacity: 0;
transform-origin: center top 0px;
z-index: 2;
box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;
margin-top: 4px;
margin-left: -54px;
max-width: calc(100% - 66px);
}
.whatsapp-chat-body {
padding: 20px 20px 20px 10px;
background-color: rgb(230, 221, 212);
position: relative;
&::before {
display: block;
position: absolute;
content: "";
left: 0px;
top: 0px;
height: 100%;
width: 100%;
z-index: 0;
opacity: 0.08;
background-image: url("https://elfsight.com/assets/chats/patterns/whatsapp.png");
// background-image: url(https://res.cloudinary.com/eventbree/image/upload/v1575782560/Widgets/whatsappbg_opt.jpg);
}
}
.dAbFpq {
display: flex;
z-index: 1;
}
.eJJEeC {
background-color: rgb(255, 255, 255);
width: 52.5px;
height: 32px;
border-radius: 16px;
display: flex;
-moz-box-pack: center;
justify-content: center;
-moz-box-align: center;
align-items: center;
margin-left: 10px;
opacity: 0;
transition: all 0.1s ease 0s;
z-index: 1;
box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;
}
.hFENyl {
position: relative;
display: flex;
}
.ixsrax {
height: 5px;
width: 5px;
margin: 0px 2px;
border-radius: 50%;
display: inline-block;
position: relative;
animation-duration: 1.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
top: 0px;
background-color: rgb(158, 157, 162);
animation-name: ZpjSY;
}
.dRvxoz {
height: 5px;
width: 5px;
margin: 0px 2px;
background-color: rgb(182, 181, 186);
border-radius: 50%;
display: inline-block;
position: relative;
animation-duration: 1.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
top: 0px;
animation-name: hPhMsj;
}
.kAZgZq {
padding: 7px 14px 6px;
background-color: rgb(255, 255, 255);
border-radius: 0px 8px 8px;
position: relative;
transition: all 0.3s ease 0s;
opacity: 0;
transform-origin: center top 0px;
z-index: 2;
box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;
margin-top: 4px;
margin-left: -54px;
max-width: calc(100% - 66px);
&::before {
position: absolute;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAmCAMAAADp2asXAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAACQUExURUxpccPDw9ra2m9vbwAAAAAAADExMf///wAAABoaGk9PT7q6uqurqwsLCycnJz4+PtDQ0JycnIyMjPf3915eXvz8/E9PT/39/RMTE4CAgAAAAJqamv////////r6+u/v7yUlJeXl5f///5ycnOXl5XNzc/Hx8f///xUVFf///+zs7P///+bm5gAAAM7Ozv///2fVensAAAAvdFJOUwCow1cBCCnqAhNAnY0WIDW2f2/hSeo99g1lBYT87vDXG8/6d8oL4sgM5szrkgl660OiZwAAAHRJREFUKM/ty7cSggAABNFVUQFzwizmjPz/39k4YuFWtm55bw7eHR6ny63+alnswT3/rIDzUSC7CrAziPYCJCsB+gbVkgDtVIDh+DsE9OTBpCtAbSBAZSEQNgWIygJ0RgJMDWYNAdYbAeKtAHODlkHIv997AkLqIVOXVU84AAAAAElFTkSuQmCC");
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: contain;
content: "";
top: 0px;
left: -12px;
width: 12px;
height: 19px;
}
}
.bMIBDo {
font-size: 13px;
font-weight: 700;
line-height: 18px;
color: rgba(0, 0, 0, 0.4);
}
.iSpIQi {
font-size: 14px;
line-height: 19px;
margin-top: 4px;
color: rgb(17, 17, 17);
}
.iSpIQi {
font-size: 14px;
line-height: 19px;
margin-top: 4px;
color: rgb(17, 17, 17);
}
.cqCDVm {
text-align: right;
margin-top: 4px;
font-size: 12px;
line-height: 16px;
color:
rgba(17, 17, 17, 0.5);
margin-right: -8px;
margin-bottom: -4px;
}
</style>
<div id='whatsapp-chat' class='hide'>
<div class='header-chat'>
<div class='head-home'>
<div class='info-avatar'></div>
<p><span class="whatsapp-name" style="color: white">Proudly African</span><br><small style="color: white">Typically replies within an hour</small></p>
</div>
<div class='get-new hide'>
<div id='get-label'></div>
<div id='get-nama'></div>
</div>
</div>
<div class='home-chat'>
</div>
<div class='start-chat'>
<!-- <div pattern="https://elfsight.com/assets/chats/patterns/whatsapp.png" class="WhatsappChat__Component-sc-1wqac52-0 whatsapp-chat-body">-->
<!-- <div class="WhatsappChat__MessageContainer-sc-1wqac52-1 dAbFpq">-->
<!-- <div style="opacity: 0;" class="WhatsappDots__Component-pks5bf-0 eJJEeC">-->
<!-- <div class="WhatsappDots__ComponentInner-pks5bf-1 hFENyl">-->
<!-- <div class="WhatsappDots__Dot-pks5bf-2 WhatsappDots__DotOne-pks5bf-3 ixsrax"></div>-->
<!-- <div class="WhatsappDots__Dot-pks5bf-2 WhatsappDots__DotTwo-pks5bf-4 dRvxoz"></div>-->
<!-- <div class="WhatsappDots__Dot-pks5bf-2 WhatsappDots__DotThree-pks5bf-5 kXBtNt"></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div style="opacity: 1;" class="WhatsappChat__Message-sc-1wqac52-4 kAZgZq">-->
<!-- <div class="WhatsappChat__Author-sc-1wqac52-3 bMIBDo">Royal Maroon</div>-->
<!-- <div class="WhatsappChat__Text-sc-1wqac52-2 iSpIQi">Hi there 👋<br><br>How can I help you?</div>-->
<!-- <div class="WhatsappChat__Time-sc-1wqac52-5 cqCDVm">1:40</div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<style>
::placeholder {
color: #000000;
opacity: 0.5; /* Firefox */
}
</style>
<div class='blanter-msg' >
<textarea style="height: 100px; background: white; color: #000000" id='chat-input' placeholder='Write a response' maxlength='120' row='1'></textarea>
<a href='javascript:void;' id='send-it'><svg viewBox="0 0 448 448"><path d="M.213 32L0 181.333 320 224 0 266.667.213 416 448 224z"/></svg></a>
</div>
</div>
<div id='get-number'></div><a class='close-chat' href='javascript:void'>×</a>
</div>
<a class='blantershow-chat' href='javascript:void' title='Show Chat'><svg width="20" viewBox="0 0 24 24"><defs/><path fill="#eceff1" d="M20.5 3.4A12.1 12.1 0 0012 0 12 12 0 001.7 17.8L0 24l6.3-1.7c2.8 1.5 5 1.4 5.8 1.5a12 12 0 008.4-20.3z"/><path fill="#4caf50" d="M12 21.8c-3.1 0-5.2-1.6-5.4-1.6l-3.7 1 1-3.7-.3-.4A9.9 9.9 0 012.1 12a10 10 0 0117-7 9.9 9.9 0 01-7 16.9z"/><path fill="#fafafa" d="M17.5 14.3c-.3 0-1.8-.8-2-.9-.7-.2-.5 0-1.7 1.3-.1.2-.3.2-.6.1s-1.3-.5-2.4-1.5a9 9 0 01-1.7-2c-.3-.6.4-.6 1-1.7l-.1-.5-1-2.2c-.2-.6-.4-.5-.6-.5-.6 0-1 0-1.4.3-1.6 1.8-1.2 3.6.2 5.6 2.7 3.5 4.2 4.2 6.8 5 .7.3 1.4.3 1.9.2.6 0 1.7-.7 2-1.4.3-.7.3-1.3.2-1.4-.1-.2-.3-.3-.6-.4z"/></svg> Chat with Us</a>
<script>
/* Whatsapp Chat Widget by www.bloggermix.com */
$(document).on("click", "#send-it", function() {
var a = document.getElementById("chat-input");
if ("" != a.value) {
var b = $("#get-number").text(),
c = document.getElementById("chat-input").value,
d = "https://web.whatsapp.com/send",
e = b,
f = "&text=" + c;
if (
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
navigator.userAgent
)
)
var d = "whatsapp://send";
var g = d + "?phone=<?php echo e($whatsapp_number); ?>" + e + f;
window.open(g, "_blank");
}
}),
$(document).on("click", ".informasi", function() {
(document.getElementById("get-number").innerHTML = $(this)
.children(".my-number")
.text()),
$(".start-chat,.get-new")
.addClass("show")
.removeClass("hide"),
$(".home-chat,.head-home")
.addClass("hide")
.removeClass("show"),
(document.getElementById("get-nama").innerHTML = $(this)
.children(".info-chat")
.children(".chat-nama")
.text()),
(document.getElementById("get-label").innerHTML = $(this)
.children(".info-chat")
.children(".chat-label")
.text());
}),
$(document).on("click", ".close-chat", function() {
$("#whatsapp-chat")
.addClass("hide")
.removeClass("show");
}),
$(document).on("click", ".blantershow-chat", function() {
$("#whatsapp-chat")
.addClass("show")
.removeClass("hide");
});
</script>
<script>
$(document).ready(function () {
$('.popup-with-zoom-anim').magnificPopup({
type: 'inline',
fixedContentPos: false,
fixedBgPos: true,
overflowY: 'auto',
closeBtnInside: true,
preloader: false,
midClick: true,
removalDelay: 300,
mainClass: 'my-mfp-zoom-in'
});
});
</script>
<!-- Large modal -->
<!-- <script>
$('#').modal('show');
</script> -->
<!-- //popup modal (for signin & signup)-->
<!-- cart-js -->
<script src="<?php echo e(url('public/general/js/minicart.js')); ?>" src=""></script>
<script>
paypalm.minicartk.render(); //use only unique class names other than paypal1.minicart1.Also Replace same class name in css and minicart.min.js
paypalm.minicartk.cart.on('checkout', function (evt) {
var items = this.items(),
len = items.length,
total = 0,
i;
// Count the number of each item in the cart
for (i = 0; i < len; i++) {
total += items[i].get('quantity');
}
if (total < 3) {
alert('The minimum order quantity is 3. Please add more to your shopping cart before checking out');
evt.preventDefault();
}
});
</script>
<!-- //cart-js -->
<!-- password-script -->
<script>
window.onload = function () {
document.getElementById("password1").onchange = validatePassword;
document.getElementById("password2").onchange = validatePassword;
}
function validatePassword() {
var pass2 = document.getElementById("password2").value;
var pass1 = document.getElementById("password1").value;
if (pass1 != pass2)
document.getElementById("password2").setCustomValidity("Passwords Don't Match");
else
document.getElementById("password2").setCustomValidity('');
//empty string means no validation error
}
</script>
<!-- //password-script -->
<!-- smoothscroll -->
<script src="<?php echo e(url('public/general/js/SmoothScroll.min.js')); ?>" src=""></script>
<!-- //smoothscroll -->
<!-- start-smooth-scrolling -->
<script src="<?php echo e(url('public/general/js/move-top.js')); ?>" src=""></script>
<script src="<?php echo e(url('public/general/js/easing.js')); ?>" src=""></script>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="modalmaindiv">
<h1>Content</h1>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<script>
jQuery(document).ready(function ($) {
$(".scroll").click(function (event) {
event.preventDefault();
$('html,body').animate({
scrollTop: $(this.hash).offset().top
}, 1000);
});
});
</script>
<!-- //end-smooth-scrolling -->
<!-- smooth-scrolling-of-move-up -->
<!-- //smooth-scrolling-of-move-up -->
<!-- imagezoom -->
<script src="<?php echo e(url('public/general/js/imagezoom.js')); ?>" src=""></script>
<!-- //imagezoom -->
<!-- FlexSlider -->
<script src="<?php echo e(url('public/general/js/jquery.flexslider.js')); ?>" src=""></script>
<script>
// Can also be used with $(document).ready()
$(window).load(function () {
$('.flexslider').flexslider({
animation: "slide",
controlNav: "thumbnails"
});
});
</script>
<!-- //FlexSlider-->
<!-- flexisel (for special offers) -->
<script src="<?php echo e(url('public/general/js/jquery.flexisel.js')); ?>" src=""></script>
<script>
$(window).load(function () {
$("#flexiselDemo1").flexisel({
visibleItems: 3,
animationSpeed: 1000,
autoPlay: true,
autoPlaySpeed: 3000,
pauseOnHover: true,
enableResponsiveBreakpoints: true,
responsiveBreakpoints: {
portrait: {
changePoint: 480,
visibleItems: 1
},
landscape: {
changePoint: 640,
visibleItems: 2
},
tablet: {
changePoint: 768,
visibleItems: 2
}
}
});
});
</script>
<script>
$(window).load(function () {
$("#flexiselDemo2").flexisel({
visibleItems: 3,
animationSpeed: 1000,
autoPlay: true,
autoPlaySpeed: 3000,
pauseOnHover: true,
enableResponsiveBreakpoints: true,
responsiveBreakpoints: {
portrait: {
changePoint: 480,
visibleItems: 1
},
landscape: {
changePoint: 640,
visibleItems: 2
},
tablet: {
changePoint: 768,
visibleItems: 2
}
}
});
});
</script>
<script>
var ip = ''; // Current IP
var XMLHttp = new XMLHttpRequest();
XMLHttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = this.responseText;
// var json = JSON.parse(this.responseText);
// Country code output, field "country_code"
var currentURL = window.location.href;
$.ajax({
url: "<?php echo e(url('visitors')); ?>",
method: "GET",
data: {
data: json,
currentURL: currentURL
},
success: function (data) {
}
});
}
};
XMLHttp.open("GET", "https://ipwhois.app/json/" + ip, true);
XMLHttp.send();
</script>
<!-- //flexisel (for special offers) -->
<!-- for bootstrap working -->
<script src="<?php echo e(url('public/general/js/bootstrap.js')); ?>" src=""></script>
<!-- //for bootstrap working -->
<!-- //js-files -->
</body>
<script>
$(document).ready(function(){
$.ajax({
'type':'Get',
'url':"<?php echo e(url('cart_count')); ?>",
success:function(response){
$('#cartcount').text('');
$('#cartcount').text(response)
}
});
});
</script>
<script>
$(document).ready(function(){
$(".btn-submit2").click(function(e){
e.preventDefault();
var email=$('#s_email').val();
$('#loading2').show();
$.ajax({
type:'POST',
url:'<?php echo e(url("subscribe")); ?>',
data:{
"_token": "<?php echo e(csrf_token()); ?>",
'email':email
},
success:function(data){
if(data=='Y'){
$('#message1').show();
$('#loading2').hide();
}else{
$('#loading2').hide();
$('#message2').show();
}
}
});
});
});
</script>
<script>
$(document).ready(function(){
$(".btn-submit3").click(function(e){
e.preventDefault();
$(".btn-submit3").val("Processing");
$(".btn-submit3").prop("disabled",true);
var fname=$('#fname').val();
var lname=$('#lname').val();
var email=$('#email').val();
var userpassword=$('#userpassword').val();
// alert(userpassword);
var phoneno=$('#phoneno').val();
$('#loading').show();
$.ajax({
type:'POST',
url:'<?php echo e(url("user_signup")); ?>',
data:{
"_token": "<?php echo e(csrf_token()); ?>",
'fname':fname,
'lname':lname,
'email':email,
'userpassword':userpassword,
'phoneno':phoneno
},
success:function(data){
if(data=='Y'){
$('#account_success').show();
$('#account_failure').hide();
$(".btn-submit3").val("Sign Up");
$(".btn-submit3").prop("disabled",false);
}else{
$('#account_success').hide();
$('#account_failure').show();
$(".btn-submit3").val("Sign Up");
$(".btn-submit3").prop("disabled",false);
}
}
});
});
$('#forget_password').on('click',function(){
$('#myModal1').modal('hide');
$('#forgetpasswordmodal').modal('show');
});
$(".btn-submit5").click(function(e){
e.preventDefault();
$(".btn-submit5").val("Processing");
$(".btn-submit5").prop("disabled",true);
var email=$('#forget_password_email').val();
$.ajax({
type:'POST',
url:'<?php echo e(url("usersendrecoveryemail")); ?>',
data:{
"_token": "<?php echo e(csrf_token()); ?>",
'email':email
},
success:function(data){
if(data=='Y'){
$('#password_recovery_success').show();
$('#password_recovery_failure').hide();
$(".btn-submit5").val("Submit");
$(".btn-submit5").prop("disabled",false);
}else{
$('#password_recovery_success').hide();
$('#password_recovery_failure').show();
$(".btn-submit5").val("Submit");
$(".btn-submit5").prop("disabled",false);
}
}
});
});
});
</script>
<script>
$(document).ready(function(){
$(".btn-submit4").click(function(e){
e.preventDefault();
$(".btn-submit4").val("Processing");
$(".btn-submit4").prop("disabled",true);
var login_email=$('#login_email').val();
var login_password=$('#login_password').val();
$('#loading').show();
$.ajax({
type:'POST',
url:'<?php echo e(url("user_login")); ?>',
data:{
"_token": "<?php echo e(csrf_token()); ?>",
'email':login_email,
'password':login_password
},
success:function(data){
if(data=='Y'){
window.location.href = "<?php echo e(url('userdashboard')); ?>";
}else{
$('#login_failure').show();
$(".btn-submit4").val("SIGN IN");
$(".btn-submit4").prop("disabled",false);
}
}
});
});
});
</script>
<script>
function countryHandler(value) {
window.location.assign('<?php echo e(url("categorywise_products")); ?>/'+`${value}`);
}
</script>
<style>
#successMessage {
display: none;
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background-color: #4CAF50;
color: white;
padding: 15px;
border-radius: 5px;
box-shadow: 0px 2px 10px rgba(0,0,0,0.2);
z-index: 1000;
text-align: center;
}
</style>
<div id="successMessage" style="display: none; position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background-color: #4CAF50; color: white; padding: 15px; border-radius: 5px; z-index: 1000;">
Product added to cart successfully!
</div>
<script>
function addtocart(rate_id, quantity, unit, amount) {
console.log("Rate ID: " + rate_id);
console.log("Quantity: " + quantity);
console.log("Unit: " + unit);
console.log("Amount: " + amount);
var amount= amount;
var unit= unit;
var secondquantity= quantity;
var quantity= 1;
var product_id = parseInt(rate_id, 10);
$.ajax({
type:'POST',
url:'<?php echo e(url("add_to_cart")); ?>',
data:{
"_token": "<?php echo e(csrf_token()); ?>",
'amount':amount,
'unit':unit,
'secondquantity':secondquantity,
'product_id':product_id,
'quantity':quantity
},
success:function(data){
if(data=='Y'){
$('#successMessage').fadeIn().delay(3000).fadeOut();
$.ajax({
'type':'Get',
'url':"<?php echo e(url('cart_count')); ?>",
success:function(response){
$('#cartcount').text('');
$('#cartcount').text(response)
}
});
}
}
});
}
</script>
</html>
Anons79 File Manager Version 1.0, Coded By Anons79
Email: [email protected]
Anons79 Mini Shell