RPL/notconsum.html at master · fikriguska/RPL · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" type="text/css" href="css/product.css">
	<script src="https://kit.fontawesome.com/4814c1385c.js" crossorigin="anonymous"></script>
	<title>Product Page</title>
</head>
<body>
	<div class="logo">
		<img src="C:\Users\Ananda\Documents\RPL\logo.png" alt="logo" class="logo1">
	</div>

<div class="main">

	<div class="btn-group">
		<button type="button" class="btn btn-default">Home</button>
		<button type="button" class="btn btn-default">Saran</button>
		<button type="button" class="btn btn-default"><i class="far fa-user"></i>Profile</button>
	</div>

	<div class="search-box">
		<input class="search-txt" type="text" name="" placeholder="Search">
		<a class="search-btn" href="#"><i class="fas fa-search"></i></a>
	</div>

<div class="prod-header">
	<h2>Product List :</h2>
</div>

<div class="prod-box">
	<div class="prod-img">
  <ul class="box-grid">
  	<div class="box-img">
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    <li><a href="#"><img src="http://placehold.it/150x150" /></a></li>
    </div>
  </ul>
	</div>
</div>

<section class="effect-1">
	<ul>
		 <li class="rv-bg"><a href="#"><span data-hover="Not-Consumable">Not-Consumable</span></a></li>
	</ul>
</section>


</div>

</body>
</html>


/*Ini page buat yang consumable jadi kan di page product abis search barangnya keluar semua kan,nah itu di paling bawah ada button "Consumable" yang nantinya bakal pindah ke page ini buat nampilin produk makanan yang boleh dia makan,dipage ini dipaling bawah juga ada button lagi yang balikin dari page ini ke page product yang awal,cssnya sama aja gaberubah jadi bisa make css yang sama*/