Skip to content

Instantly share code, notes, and snippets.

@erip2

erip2/filter.html

Created January 28, 2020 21:09
Show Gist options
  • Save erip2/f25d03ea49536a8a2fc6094eb3d4db9a to your computer and use it in GitHub Desktop.
Save erip2/f25d03ea49536a8a2fc6094eb3d4db9a to your computer and use it in GitHub Desktop.
Download ZIP
Raw
filter.html
<!doctype html>
<html lang="en">
<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="../../styles/bootstrap.css">
<link rel="stylesheet" href="../../styles/slick.css"/>
<link rel="stylesheet" href="../Helpbox/css/helpbox.css">
<link rel="stylesheet" href="../About/css/about.css">
<link rel="stylesheet" href="../Footer/css/footer.css">
<link rel="stylesheet" type="text/css" href="css/promotions.css"/>
<link rel="stylesheet" href="../Navigation/css/navigation.css">
<link rel="stylesheet" href="../../fonts/fontawesome-free-5.11.2-web/css/all.css">
<link rel="stylesheet" href="../../styles/style.css">
<link rel="stylesheet" href="../Game-Carousel/css/carousel.css">
<title>Sisal Turchia - Promotions</title>
</head>
<body>
<div class="row no-gutters button-group-container">
<div class="container button-group filters-button-group">
<button class="simple-button is-checked" data-filter="*">All</button>
<button class="simple-button" data-filter=".cat1">Category 1</button>
<button class="simple-button" data-filter=".cat2">Category 2</button>
<button class="simple-button" data-filter=".cat3">Category 3</button>
<button class="simple-button" data-filter=".cat4">Category 4</button>
<button class="simple-button promotions-btn">Your promotions</button>
</div>
</div>
<div class="container">
<div class="row promotions equal">
<div class="col-sm-6 col-md-4 col-lg-3 cat1">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat1">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat1">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat2">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat2">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat2">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 cat2">
<div class="game-col">
<div class="game-item">
<div class="game-item-header">
<div class="game-image">
<img src="./img/1.png" srcset="./img/1.png 1x, ./img/2.png 2x, ./img/3.png 3x">
</div>
<div class="game-wishlist"><img src="./img/fav.svg"></div>
<div class="more-details">
<button class="btn-default btn-bg-primary">PLAY</button>
<a href="#" class="btn-default">More details ></a>
</div>
</div>
<div class="game-item-footer">
<p class="game-item-footer-title">Game Title</p>
<p class="game-item-footer-desc">Lorem ipsum dolor sit amet</p>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../../js/jquery-3.4.1.js"></script>
<script src="../../js/popper.js"></script>
<script src="../../js/bootstrap.js"></script>
<script src="../../js/isotope.pkgd.js"></script>
<script src="./js/filter.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment