Skip to content

P
palaniapp_demo
Commit 47ed3ea5 by Hussain Mohamed
Options

products

parent b919c4db
Showing with 220 additions and 41 deletions
app/Http/Controllers/FrontendController.php
...@@ -11,6 +11,9 @@ ...@@ -11,6 +11,9 @@
use App\Models\LanguageModel; use App\Models\LanguageModel;
use App\Models\ManageRequestModel; use App\Models\ManageRequestModel;
use App\Models\PagesModel; use App\Models\PagesModel;
use App\Models\ProductBrandModel;
use App\Models\ProductIndustryModel;
use App\Models\ProductTypeModel;
use App\Models\Service; use App\Models\Service;
use App\Models\ServiceTypeModel; use App\Models\ServiceTypeModel;
use Illuminate\Http\Request; use Illuminate\Http\Request;
...@@ -34,7 +37,13 @@ public function contact() ...@@ -34,7 +37,13 @@ public function contact()
return view('contact'); return view('contact');
} }
public function products()
{
$productType = ProductTypeModel::Where('status',1)->get();
$brandData = ProductBrandModel::Where('status',1)->get();
$industryData = ProductIndustryModel::Where('status',1)->get();
return view('products',compact('productType','brandData','industryData'));
}
public function career() public function career()
{ {
......
public/assets/css/main.css
...@@ -859,7 +859,7 @@ section, ...@@ -859,7 +859,7 @@ section,
} }
#hero{ #hero{
height: 350px !important; height: 413px !important;
} }
.hero .container { .hero .container {
position: relative; position: relative;
...@@ -1891,20 +1891,28 @@ section, ...@@ -1891,20 +1891,28 @@ section,
border-radius: 50%; border-radius: 50%;
background: var(--accent-color); background: var(--accent-color);
transition: all 0.3s ease; transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
} }
.testimonials .swiper-button-prev:after, /* Swiper default arrows */
.testimonials .swiper-button-next:after { .testimonials .swiper-button-prev::after,
font-size: 1.25rem; .testimonials .swiper-button-next::after {
color: var(--contrast-color); font-size: 18px;
font-weight: bold; font-weight: bold;
color: #fff;
} }
/* Optional hover */
.testimonials .swiper-button-prev:hover, .testimonials .swiper-button-prev:hover,
.testimonials .swiper-button-next:hover { .testimonials .swiper-button-next:hover {
transform: translateY(-2px); background: #000;
} }
@media (max-width: 991.98px) { @media (max-width: 991.98px) {
.testimonials .testimonial-slide { .testimonials .testimonial-slide {
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
...@@ -5116,13 +5124,13 @@ section, ...@@ -5116,13 +5124,13 @@ section,
background: linear-gradient(120deg, #efe2c6, #f6ecd7); background: linear-gradient(120deg, #efe2c6, #f6ecd7);
overflow: hidden; overflow: hidden;
border-radius: 8px; border-radius: 8px;
width: 92%; width: 91%;
left: 7px; left: 7px;
} }
.hero-slider, .hero-slider,
.hero-slider .swiper-slide { .hero-slider .swiper-slide {
min-height: 420px; min-height: 330px;
} }
.hero-slide-bg { .hero-slide-bg {
...@@ -5209,3 +5217,61 @@ section, ...@@ -5209,3 +5217,61 @@ section,
.ft{ .ft{
color:#b9a16b; color:#b9a16b;
} }
.filter-accordion .accordion-item {
border: 0;
border-bottom: 1px solid #eee;
}
.filter-accordion .accordion-button {
padding: 15px 10px;
font-size: 13px;
letter-spacing: 1px;
text-transform: uppercase;
background: none;
box-shadow: none;
}
.filter-accordion .accordion-button::after {
background-image: none;
content: '+';
font-size: 18px;
transform: none;
}
.filter-accordion .accordion-button:not(.collapsed)::after {
content: '−';
}
.filter-accordion .accordion-body {
padding: 10px;
font-size: 14px;
}
.filter-accordion .accordion-body div {
padding: 6px 0;
cursor: pointer;
}
.filter-accordion .accordion-body div {
padding: 6px 0;
cursor: pointer;
color: #333;
}
.filter-accordion .accordion-body div.active {
font-weight: 600;
color: #fff;
background: #024959;
text-align: center;
border-radius: 12px;
}
/* #brand .accordion-body {
max-height: 150px;
overflow-y: auto;
} */
public/assets/css/swiper-bundle.min.css
...@@ -254,16 +254,26 @@ ...@@ -254,16 +254,26 @@
.swiper-button-next, .swiper-button-next,
.swiper-button-prev { .swiper-button-prev {
position: absolute; position: absolute;
top: var(--swiper-navigation-top-offset, 50%); top: 50%;
width: calc(var(--swiper-navigation-size) / 44 * 27); margin-top: 0;
height: var(--swiper-navigation-size); transform: translateY(-50%);
margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
/* your style */
width: 35px;
height: 35px;
border-radius: 50%;
background: #f8f8f8;
transition: all 0.3s ease;
color: #000000;
font-weight:bold;
z-index: 10; z-index: 10;
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: var(--swiper-navigation-color, var(--swiper-theme-color)); opacity:0.36;
} }
.swiper-button-next.swiper-button-disabled, .swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled { .swiper-button-prev.swiper-button-disabled {
...@@ -308,7 +318,7 @@ ...@@ -308,7 +318,7 @@
.swiper-button-next:after, .swiper-button-next:after,
.swiper-button-prev:after { .swiper-button-prev:after {
font-family: swiper-icons; font-family: swiper-icons;
font-size: var(--swiper-navigation-size); font-size: 13px;
text-transform: none !important; text-transform: none !important;
letter-spacing: 0; letter-spacing: 0;
font-variant: initial; font-variant: initial;
...@@ -345,9 +355,9 @@ ...@@ -345,9 +355,9 @@
.swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom, .swiper-pagination-custom,
.swiper-pagination-fraction { .swiper-pagination-fraction {
bottom: var(--swiper-pagination-bottom, 8px); bottom: var(--swiper-pagination-bottom, 35px);
top: var(--swiper-pagination-top, auto); top: var(--swiper-pagination-top, auto);
left: -33rem; left: -32rem;
width: 100%; width: 100%;
} }
.swiper-pagination-bullets-dynamic { .swiper-pagination-bullets-dynamic {
......
public/assets/js/main.js
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
const selectBody = document.querySelector('body'); const selectBody = document.querySelector('body');
const selectHeader = document.querySelector('#header'); const selectHeader = document.querySelector('#header');
if (!selectHeader.classList.contains('scroll-up-sticky') && !selectHeader.classList.contains('sticky-top') && !selectHeader.classList.contains('fixed-top')) return; if (!selectHeader.classList.contains('scroll-up-sticky') && !selectHeader.classList.contains('sticky-top') && !selectHeader.classList.contains('fixed-top')) return;
window.scrollY > 150 ? selectBody.classList.add('scrolled') : selectBody.classList.remove('scrolled'); window.scrollY > 180 ? selectBody.classList.add('scrolled') : selectBody.classList.remove('scrolled');
} }
document.addEventListener('scroll', toggleScrolled); document.addEventListener('scroll', toggleScrolled);
......
resources/views/base/header.blade.php
...@@ -29,6 +29,7 @@ ...@@ -29,6 +29,7 @@
<!-- Main CSS File --> <!-- Main CSS File -->
<link href="<?= asset('assets') ?>/css/main.css" rel="stylesheet"> <link href="<?= asset('assets') ?>/css/main.css" rel="stylesheet">
<script src="<?= asset('assets') ?>/js/jquery.min.js"></script>
</head> </head>
...@@ -64,7 +65,7 @@ ...@@ -64,7 +65,7 @@
<ul> <ul>
<li><a href="<?= route('/') ?>" class="<?= (request()->is('/')) ? 'active':'' ?>">Home</a></li> <li><a href="<?= route('/') ?>" class="<?= (request()->is('/')) ? 'active':'' ?>">Home</a></li>
<li><a href="<?= route('about-us') ?>" class="<?= (request()->is('about-us')) ? 'active':'' ?>">About Us</a></li> <li><a href="<?= route('about-us') ?>" class="<?= (request()->is('about-us')) ? 'active':'' ?>">About Us</a></li>
<li><a href="services.html">Products</a></li> <li><a href="<?= route('product') ?>" class="<?= (request()->is('product')) ? 'active':'' ?>">Products</a></li>
<li><a href="<?= route('career') ?>" class="<?= (request()->is('career')) ? 'active':'' ?>">Career</a></li> <li><a href="<?= route('career') ?>" class="<?= (request()->is('career')) ? 'active':'' ?>">Career</a></li>
<li><a href="<?= route('contact') ?>" class="<?= (request()->is('contact')) ? 'active':'' ?>">Contact</a></li> <li><a href="<?= route('contact') ?>" class="<?= (request()->is('contact')) ? 'active':'' ?>">Contact</a></li>
</ul> </ul>
......
resources/views/contact.blade.php
...@@ -5,14 +5,14 @@ ...@@ -5,14 +5,14 @@
<!-- Page Title --> <!-- Page Title -->
<div class="page-title "> <div class="page-title ">
<div class="container"> <div class="container mt-5">
<div class="row g-4"> <div class="row g-4">
<div class="col-lg-3"> <div class="col-lg-2 ">
</div> </div>
<div class="col-lg-6"> <div class="col-lg-6 ">
<h1>Get in Touch</h1> <h1 class="hfive">Get in Touch</h1>
<h4 class="mt-5 ">We’d love to hear from you.</h4> <h4 class="mt-4 ">We’d love to hear from you.</h4>
</div> </div>
</div> </div>
......
resources/views/index.blade.php
...@@ -55,35 +55,35 @@ ...@@ -55,35 +55,35 @@
<div class="col-md-6"> <div class="col-md-6">
<div class="display-card large"> <div class="display-card large">
<img src="assets/img/signage.jpg" class="img-fluid" alt=""> <img src="<?= asset('assets') ?>/img/signage-tv.png" class="img-fluid" alt="">
<div class="display-title">Signage Display</div> <div class="display-title">Signage Display</div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="display-card large"> <div class="display-card large">
<img src="assets/img/projector.jpg" class="img-fluid" alt=""> <img src="<?= asset('assets') ?>/img/portable-projectors.png" class="img-fluid" alt="">
<div class="display-title">Projectors</div> <div class="display-title">Projectors</div>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="display-card small"> <div class="display-card small">
<img src="assets/img/led-wall.jpg" class="img-fluid" alt=""> <img src="<?= asset('assets') ?>/img/led-wall.png" class="img-fluid" alt="">
<div class="display-title">LED Wall</div> <div class="display-title">LED Wall</div>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="display-card small"> <div class="display-card small">
<img src="assets/img/interactive.jpg" class="img-fluid" alt=""> <img src="<?= asset('assets') ?>/img/interactive-display.png" class="img-fluid" alt="">
<div class="display-title">Interactive Displays</div> <div class="display-title">Interactive Displays</div>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="display-card small"> <div class="display-card small">
<img src="assets/img/writing-pad.jpg" class="img-fluid" alt=""> <img src="<?= asset('assets') ?>/img/digital-writing-pad.png" class="img-fluid" alt="">
<div class="display-title">Digital Writing Pad</div> <div class="display-title">Digital Writing Pad</div>
</div> </div>
</div> </div>
...@@ -100,29 +100,29 @@ ...@@ -100,29 +100,29 @@
<div class="col-lg-3 col-sm-6"> <div class="col-lg-3 col-sm-6">
<div class="achievement-item"> <div class="achievement-item">
<i class="bi bi-award"></i> <i class="bi bi-award"></i>
<p>Industry Awards</p> <p>NUMBER OF <br>BRANDS </p>
<h3>15+</h3> <h3>20+</h3>
</div> </div>
</div> </div>
<div class="col-lg-3 col-sm-6"> <div class="col-lg-3 col-sm-6">
<div class="achievement-item"> <div class="achievement-item">
<i class="bi bi-shield-check"></i> <i class="bi bi-shield-check"></i>
<p>Safety Incidents</p> <p>NUMBER OF <br>DEALERS</p>
<h3>Zero</h3> <h3>350+</h3>
</div> </div>
</div> </div>
<div class="col-lg-3 col-sm-6"> <div class="col-lg-3 col-sm-6">
<div class="achievement-item"> <div class="achievement-item">
<i class="bi bi-clock-history"></i> <i class="bi bi-clock-history"></i>
<p>Years Experience</p> <p>EXPERIENCE</p>
<h3>18</h3> <h3>15+</h3>
</div> </div>
</div> </div>
<div class="col-lg-3 col-sm-6"> <div class="col-lg-3 col-sm-6">
<div class="achievement-item"> <div class="achievement-item">
<i class="bi bi-people"></i> <i class="bi bi-people"></i>
<p>Satisfied Clients</p> <p>SUCCESSFULL PROJECTS<br></p>
<h3>350+</h3> <h3>2000+</h3>
</div> </div>
</div> </div>
</div> </div>
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
<a href="#" class="btn btn-outline-dark">See All</a> <a href="#" class="btn btn-outline-dark">See All</a>
</div> </div>
<div class="col-md-5 text-end"> <div class="col-md-5 text-end">
<img src="assets/img/monitors.png" class="img-fluid" alt="Monitors"> <img src="<?= asset('assets') ?>/img/monitor-3.png" class="img-fluid" alt="Monitors">
</div> </div>
</div> </div>
</div> </div>
...@@ -158,7 +158,7 @@ ...@@ -158,7 +158,7 @@
<a href="#" class="btn btn-outline-light">See All</a> <a href="#" class="btn btn-outline-light">See All</a>
</div> </div>
<div class="col-md-5 text-end"> <div class="col-md-5 text-end">
<img src="assets/img/aircon.png" class="img-fluid" alt="Aircon"> <img src="<?= asset('assets') ?>/img/aircon.png" class="img-fluid" alt="Aircon">
</div> </div>
</div> </div>
</div> </div>
...@@ -174,7 +174,7 @@ ...@@ -174,7 +174,7 @@
<a href="#" class="btn btn-outline-light">See All</a> <a href="#" class="btn btn-outline-light">See All</a>
</div> </div>
<div class="col-md-5 text-end"> <div class="col-md-5 text-end">
<img src="assets/img/appliances.png" class="img-fluid" alt="Appliances"> <img src="<?= asset('assets') ?>/img/small-appliances.png" class="img-fluid" alt="Appliances">
</div> </div>
</div> </div>
</div> </div>
...@@ -190,7 +190,7 @@ ...@@ -190,7 +190,7 @@
<a href="#" class="btn btn-outline-dark">See All</a> <a href="#" class="btn btn-outline-dark">See All</a>
</div> </div>
<div class="col-md-5 text-end"> <div class="col-md-5 text-end">
<img src="assets/img/accessories.png" class="img-fluid" alt="Accessories"> <img src="<?= asset('assets') ?>/img/accessories.png" class="img-fluid" alt="Accessories">
</div> </div>
</div> </div>
</div> </div>
......
resources/views/products.blade.php 0 → 100644
@extends('app_layout')
@section('title','Contact Us')
@section('content')
<main class="main">
<div class="page-title ">
<div class="container">
<div class="row g-4">
<h1 class="hfive text-center">Products</h1>
<div class="col-lg-4">
<div class="accordion filter-accordion" id="filterAccordion">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse"
data-bs-target="#type"
aria-expanded="true">
FILTER BY PRODUCT TYPE
</button>
</h2>
<div id="type" class="accordion-collapse collapse show">
<div class="accordion-body">
<?php if(isset($productType)){
foreach($productType as $row){ ?>
<div><?= $row->type ?></div>
<?php } } ?>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse"
data-bs-target="#industry"
aria-expanded="true">
FILTER BY INDUSTRY
</button>
</h2>
<div id="industry" class="accordion-collapse collapse show">
<div class="accordion-body">
<?php if(isset($industryData)){
foreach($industryData as $row){ ?>
<div><?= $row->industry ?></div>
<?php } } ?>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button" type="button"
data-bs-toggle="collapse"
data-bs-target="#brand"
aria-expanded="true">
FILTER BY BRAND
</button>
</h2>
<div id="brand" class="accordion-collapse collapse show">
<div class="accordion-body">
<?php if(isset($brandData)){
foreach($brandData as $row){ ?>
<div><?= $row->brand ?></div>
<?php } } ?>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-8"></div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.filter-accordion .accordion-body div').on('click', function () {
$(this)
.closest('.accordion-body')
.find('div')
.removeClass('active');
$(this).addClass('active');
});
});
</script>
@endsection
\ No newline at end of file
routes/web.php
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
Route::get('terms-conditions', [FrontendController::class, 'terms_condition'])->name('terms-conditions'); Route::get('terms-conditions', [FrontendController::class, 'terms_condition'])->name('terms-conditions');
Route::get('about-us', [FrontendController::class, 'about'])->name('about-us'); Route::get('about-us', [FrontendController::class, 'about'])->name('about-us');
Route::get('career', [FrontendController::class, 'career'])->name('career'); Route::get('career', [FrontendController::class, 'career'])->name('career');
Route::get('product', [FrontendController::class, 'products'])->name('product');
Route::get('/request-waiting/{token}', [FrontendController::class, 'requestWaiting']) Route::get('/request-waiting/{token}', [FrontendController::class, 'requestWaiting'])
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment