Skip to content

tetiana yaremko / web-app-group2

Go to a project
Commit 5d7e33ed by tetiana yaremko
Options

footer added

parent d41a430a
Inline Side-by-side
Showing with 154 additions and 107 deletions
application/controllers/home.php
......@@ -20,6 +20,7 @@ class Home extends CI_Controller {
$this->load->view('templates/header');
$this->load->view('templates/home_t', array('data'=>$data));
$this->load->view('templates/footer');
......@@ -32,6 +33,7 @@ class Home extends CI_Controller {
$this->load->view('templates/header');
$this->load->view('all_products', array('data'=>$data));
$this->load->view('templates/footer');
}
......@@ -74,8 +76,8 @@ class Home extends CI_Controller {
$start = ($page-1) * $config['per_page'];
$output = array(
'pagination_link' => $this->pagination->create_links(),
'product_list' => $this->admin->fetch_data($config["per_page"], $start, $minimum_price, $maximum_price, $genre)
);
'product_list' => $this->admin->fetch_data($config["per_page"], $start, $minimum_price, $maximum_price, $genre),
'number_of_items'=>$config['total_rows'] );
echo json_encode($output);
//echo 'hello';
}
......
application/views/all_products.php
......@@ -66,22 +66,23 @@
</div>
<div class="filter-section">
<div class="filter-section d-flex justify-content-between">
<div class="price ">
<div class="d-flex">
<span>Price</span>
<div class="d-flex align-items-center">
<span class="mx-3">Price:</span>
<input type="hidden" id="hidden_minimum_price" value="5" />
<input type="hidden" id="hidden_maximum_price" value="200" />
<p id="price_show">5 - 200</p>
<span class="mr-4" id="price_show">5 - 200</span>
<div class="" id="price_range"style="width: 5rem;"></div>
</div>
<div class="" id="price_range"style="width: 5rem;"></div>
</div>
<div>
<div class="d-flex">
<div>
<span><span class="prod-number"></span> Products</span>
<span><span class="mr-2" id="prod-number"></span>Products</span>
</div>
<div id="pagination_link" ></div>
<div class="px-4" id="pagination_link" ></div>
</div>
</div>
......
application/views/templates/footer.php
<html>
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="<?php echo base_url(); ?>asset/css/stylee.css" type="text/css">
</head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<style>
.container-fluid{
background-color: #101010;
color: whitesmoke;
}
.container-fluid > .row:first-of-type{
background-color: black;
}
.container-fluid a,
.container-fluid p{
color:whitesmoke;
font-size: 1.1rem;
}
.container-fluid ul {
list-style-type: none;
}
.container-fluid ul > li:first-of-type, .container-fluid p:first-of-type {
text-transform: uppercase;
font-weight: bold;
font-size: 1.3rem;
}
.container-fluid li {
margin: 5px 0;
}
.container-fluid .container ul li i {
font-size: 1.4rem;
}
</style>
<body>
<div class="footer-section">
<div class="container">
<div class="newslatter-form">
<div class="row">
<div class="col-lg-12">
<form action="#">
<input type="text" placeholder="Your email address">
<button type="submit">Subscribe to our newsletter</button>
</form>
</div>
</div>
<div class="container-fluid">
<div class="row py-4 justify-content-center">
<a class="mr-3" href="https://www.facebook.com/tania.yaremko" target="_blank"><i class="fa fa-facebook-square fa-2x"></i></a>
<a class="mr-3" href="https://www.facebook.com/tania.yaremko" target="_blank"><i class="fa fa-twitter-square fa-2x"></i></a>
<a class="mr-3" href="https://www.facebook.com/tania.yaremko" target="_blank"><i class="fa fa-linkedin fa-2x"></i></a>
<a class="mr-3" href="https://www.instagram.com/yaremkotania/?hl=uk" target="_blank"><i class="fa fa-instagram fa-2x"></i></a>
<a class="mr-3" href="https://www.instagram.com/yaremkotania/?hl=uk" target="_blank"><i class="fa fa-spotify fa-2x"></i></a>
</div>
<div class="footer-widget">
<div class="row">
<div class="col-lg-3 col-sm-6">
<div class="single-footer-widget">
<h4>About us</h4>
<ul>
<li>About Us</li>
<li>Community</li>
<li>Jobs</li>
<li>Shipping</li>
<li>Contact Us</li>
</ul>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div class="single-footer-widget">
<h4>Customer Care</h4>
<ul>
<li>Search</li>
<li>Privacy Policy</li>
<li>2019 Lookbook</li>
<li>Shipping & Delivery</li>
<li>Gallery</li>
</ul>
</div>
<div class="container">
<div class="row py-4">
<div class="col-12 col-md-6 col-lg-3">
<ul>
<li>Categories</li>
<li><a href="">Home</a></li>
<li><a>Bank Holiday Sale 2020</a></li>
<li>Pre-Orders</li>
<li><a>Deal of the Day</a></li>
<li><a>Signed</a></li>
<li><a>Genres</a></li>
<li><a>Coloured Vynil</a></li>
<li><a>Limited Edition</a></li>
<li><a>Redeem</a></li>
<li><a>SOV Messenger</a></li>
</ul>
</div>
<div class="col-lg-3 col-sm-6">
<div class="single-footer-widget">
<h4>Our Services</h4>
<ul>
<li>Free Shipping</li>
<li>Free Returnes</li>
<li>Our Franchising</li>
<li>Terms and conditions</li>
<li>Privacy Policy</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4">
<ul>
<li>Customer Services</li>
<li><a href="">Help & Support</a></li>
<li><a>Delivery</a></li>
<li>Teams & Conditions</li>
<li><a>Privacy Policy</a></li>
</ul>
</div>
<div class="col-lg-3 col-sm-6">
<div class="single-footer-widget">
<h4>Information</h4>
<ul>
<li>Payment methods</li>
<li>Times and shipping costs</li>
<li>Product Returns</li>
<li>Shipping methods</li>
<li>Conformity of the products</li>
</ul>
<div class="col-12 col-md-6 col-lg-5 ">
<p>Join Our Mailing List</p>
<p>Grab 10% off your first order by signing up to hear about limited editions, collectors editions and recommended releases!</p>
<div class="input-group mb-3 d-flex flex-column">
<input type="email" class="form-control w-100 rounded-0 " placeholder="Email address" aria-label="" aria-describedby="">
<small>By signing up you agree to our Privacy Policy</small>
</div>
<button type="button" class="btn btn-secondary px-5 py2">Join</button>
</div>
</div>
</div>
</div>
<div class="social-links-warp">
<div class="container">
<div class="social-links">
<a href="" class="instagram"><i class="fa fa-instagram"></i><span>instagram</span></a>
<a href="" class="pinterest"><i class="fa fa-pinterest"></i><span>pinterest</span></a>
<a href="" class="facebook"><i class="fa fa-facebook"></i><span>facebook</span></a>
<a href="" class="twitter"><i class="fa fa-twitter"></i><span>twitter</span></a>
<a href="" class="youtube"><i class="fa fa-youtube"></i><span>youtube</span></a>
<a href="" class="tumblr"><i class="fa fa-tumblr-square"></i><span>tumblr</span></a>
</div>
</div>
<div class="container text-center pt-5">
<p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="icon-heart color-danger" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p>
<div class="row justify-content-center">
<ul class="d-flex align-items-center ">
<li class="mx-2">
<i style="font-size: 2rem" class="fa fa-cc-visa"></i>
</li>
<li class="mx-2">
<i style="font-size: 2rem" class="fa fa-cc-mastercard"></i>
</li>
<li class="mx-2">
<i style="font-size: 2rem" class="fa fa-cc-amex"></i>
</li>
<li class="mx-2">
<i style="font-size: 2rem" class="fa fa-cc-paypal"></i>
</li>
</ul>
</div>
</div>
</div>
<!-- Footer Section End -->
<!-- Js Plugins -->
<script src="<?php echo base_url(); ?>asset/js/jquery-3.3.1.min.js"></script>
<script src="<?php echo base_url(); ?>asset/js/bootstrap.min.js"></script>
<script src="<?php echo base_url(); ?>asset/js/hceader-top.js"></script>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</body>
</html>
application/views/templates/header.php
......@@ -17,6 +17,10 @@
<div class="logo">
<a href="<?php echo base_url(); ?>index.php/home/products"><img src="<?= asset_url('img/logo.png')?>" alt=""></a>
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="menu-right">
<div class="cart-profile">
<div class="toggle-account active-btn">
......@@ -117,4 +121,4 @@
</body>
</html>
\ No newline at end of file
</html>
application/views/templates/home_t.php
......@@ -132,7 +132,7 @@
<div class="container mb-4">
<div class="row d-flex justify-content-end">
<button type="button" class="btn btn-light py-2 px-8">See All</button>
<button type="button" class="btn btn-light px-8">See All</button>
</div>
</div>
......@@ -190,10 +190,13 @@
baseUrl = '<?php echo base_url(); ?>';
</script>
<script src="<?php echo base_url(); ?>asset/js/scrypt.js"></script>
<script src="<?php echo base_url(); ?>asset/js/jquery-3.3.1.min.js"></script>
<script src="<?php echo base_url(); ?>asset/js/bootstrap.min.js"></script>
<script src="<?php echo base_url(); ?>asset/js/hceader-top.js"></script>
<script src="<?php echo base_url(); ?>asset/js/scrypt.js"></script>
<script src="<?php echo base_url(); ?>asset/js/jquery-3.3.1.min.js"></script>
<script src="<?php echo base_url(); ?>asset/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
</script>
......
asset/css/home.css
......@@ -559,6 +559,8 @@ display: grid;
max-width: 1405px;
margin: 0 auto;
padding: .5em;
display: flex;
flex-wrap: wrap;
}
.genre-section input {
visibility: hidden;
......@@ -578,4 +580,25 @@ display: grid;
color: #ffffff;
}
.pagination li {
padding: 0 5px;
border: 1px solid #3a3a3a ;
margin: 0 2px;
}
.pagination li.active {
border: 1px solid #626262;
}
.pagination li.active a{
color: #626262 ;
}
.pagination a {
color: #3a3a3a;
font-size: 1.1rem;
}
.filter-section span {
color: #3a3a3a;
font-size: 1.1rem;
}
asset/js/scrypt.js
......@@ -25,6 +25,7 @@ $(document).ready(function() {
//$('#shop-items').html(data);
$('#shop-items').html(data.product_list);
$('#pagination_link').html(data.pagination_link);
$('#prod-number').html(data.number_of_items);
$('.cart-btn').click(function (event) {
......
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 sign in to comment