admin-js/products.html at master · manas3874/admin-js · 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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./styles/main.css" />
    <script
      src="https://code.jquery.com/jquery-3.5.1.min.js"
      integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
      crossorigin="anonymous"
    ></script>
    <title>Assessment</title>
  </head>
  <body>
    <div class="Topbar">
      <div class="Topbar_LeftMenu">
        <div class="Topbar_LogoWrapper">
          <img
            src="https://edu-web-fundamentals.web.app/static/media/logo.58169365.png"
            alt="Logo"
          />
          <p class="Topbar_BrandName">Kafene</p>
        </div>
        <nav>
          <a class="Topbar_MenuItem" href="./orders.html">Orders</a>
          <a class="Topbar_MenuItem Topbar_Active" href="./products.html"
            >Products</a
          >
          <a class="Topbar_MenuItem" href="./users.html">Users</a>
        </nav>
      </div>
      <a class="Topbar_MenuItem logout-btn" href="./index.html">Logout</a>
    </div>
    <main class="MainContainer">
      <div class="ProductListingPage_PageWrapper">
        <h1 class="ProductListingPage_MainHeading">Products</h1>
        <div class="ProductListingPage_OrdersWrapper">
          <div class="ProductListingPage_FilterWrapper">
            <h3>Filters</h3>
            <div class="ProductListingPage_FilterOptions">
              <p>Count: <span class="productFilterCount">100</span></p>
              <label class="ProductListingPage_FilterCheckbox">
                <input
                  type="checkbox"
                  name="product-expired"
                  checked=""
                  value="Expired"
                />
                Expired
              </label>
              <label class="ProductListingPage_FilterCheckbox">
                <input
                  type="checkbox"
                  name="product-low-stock"
                  checked=""
                  value="LowStock"
                />
                LowStock
              </label>
            </div>
          </div>
          <div style="width: 100%">
            <table class="ProductListingPage_OrderTable">
              <tr>
                <th>ID</th>
                <th>Product Name</th>
                <th>Product Brand</th>
                <th style="min-width: 100px">Expiry Date</th>
                <th>Unit Price</th>
                <th>Stock</th>
              </tr>
              <tbody id="trWrapper">
                <!-- <tr
                  class="ProductListingPage_TableRow ProductListingPage_ExpiredRow"
                >
                  <td class="ProductListingPage_SecondaryText" id="text1"></td>
                  <td class="ProductListingPage_PrimaryText" id="text2"></td>
                  <td class="ProductListingPage_SecondaryText" id="text3"></td>
                  <td class="ProductListingPage_PrimaryText" id="text4"></td>
                  <td class="ProductListingPage_SecondaryText" id="text5"></td>
                  <td class="ProductListingPage_SecondaryText" id="text6"></td>
                </tr> -->
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </main>
  </body>
  <script src="./scripts/productsPage.js"></script>
  <script src="./scripts/logout.js"></script>
</html>