enhanced vendor ui

Vimall03 · Oct 15, 2024 · 6bc8729 · 6bc8729
1 parent c3b18f2
commit 6bc8729
Show file tree

Hide file tree

Showing 6 changed files with 421 additions and 84 deletions.
diff --git a/Alimento b/Alimento
diff --git a/styles.css b/styles.css
@@ -2,7 +2,10 @@ body {
     font-family: Arial, sans-serif;
     margin: 0;
     padding: 0;
+    max-width: 1140px;
+    margin: auto;
   }
+
 
   header {
     background-color: #d5761d;

diff --git a/vendor/add_menu.php b/vendor/add_menu.php
@@ -28,36 +28,128 @@
 
 <head>
     <title>Menu Information</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
     <style>
-        table {
-            border-collapse: collapse;
+        body{
+            max-width: 1140px;
+            margin: auto;
+            font-family: Arial, Helvetica, sans-serif;
+        }
+        .header{
+            display: flex;
+            justify-content: space-between;
+            height: 10vh;
+            margin: 10px 0;
+            border-bottom: 2px solid maroon;
+        }
+        .header img{
+            height: 100%;
+        }
+        .order-table {
             width: 100%;
+            border-collapse: collapse;
         }
 
-        th,
-        td {
-            border: 1px solid black;
-            padding: 8px;
-            text-align: left;
+        .order-table th,
+        .order-table td {
+            padding: 12px;
+            border-bottom: 1px solid #ddd;
+            text-align: center;
+        }
+        .logout{
+            height: 100%;
+            display: flex;
+            align-items: center;
+        }
+
+        .order-table th {
+            background-color: #f5f5f5;
+            font-weight: bold;
+        }
+        .veg{
+            padding: 4px 12px;
+            background: green;
+            color: white;
+            border-radius: 6px;
+        }
+        .nonveg{
+            padding: 4px 12px;
+            background: red;
+            color: white;
+            border-radius: 6px;
         }
+        .menu-container{
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+        .btn{
+            padding: 10px 20px;
+            border: none;
+            color: white;
+            border-radius: 4px;
+            cursor: pointer;
 
-        th {
-            background-color: #f2f2f2;
+        }
+        .btn:hover{
+            color: black;
+        }
+        .dataInput{
+            padding: 6px;
+            border-radius: 8px;
+            border: none;
+            outline: none;
+
+        }
+        .dataInput:active, .dataInput:focus{
+            border: none;
+        }
+        .add-item{
+            background-color: blue;
+            color: white;
+            border-radius: 6px;
+            outline: none;
+            border: none;
+            padding: 2px 5px;
+        }
+        .btn{
+            padding: 10px 20px;
+            border: none;
+            color: white;
+            border-radius: 4px;
+            cursor: pointer;
         }
     </style>
 </head>
 
 <body>
-<h1>Menu Information | <a href='edit_menu.php'><input type='submit' value='EDIT'><a style="margin: 10px; " href='home.php'><input  type='submit' value='BACK' ></a></h1>
-
-    <table>
-        <tr>
+    <div class="header">
+        <img src="../images/logo/logo.png" alt="">
+
+        <form action="vendor_logout.php" class="logout"><input  type='submit' class="btn btn-danger" value='LOGOUT'></form>
+    </div>
+    <br>
+
+    <div class="menu-container">
+        <h1>
+            Menu Information
+        </h1>
+        <div class="btn-container">
+            <a href='edit_menu.php'><button class="btn" style="background-color: #008080;">EDIT</button></a>  
+            <a href='home.php'><button class="btn" style="background-color: #FF8C00;">BACK</button></a> 
+        </div>
+    </div>
+
+    <table class="order-table">
+        <thead>
             <th>Item ID</th>
             <th>Item Name</th>
             <!-- <th>Item Description</th> -->
             <th>Item Price</th>
             <th>Item Category</th>
-        </tr>
+        </thead>
 
         <?php
         // Retrieve data from the menu table
@@ -71,7 +163,11 @@
                 echo "<td>" . $row['m_name'] . "</td>";
                 //echo "<td>" . $row['item_description'] . "</td>";
                 echo "<td>" . $row['m_price'] . "</td>";
-                echo "<td>" . $row['m_type'] . "</td>";
+                if($row['m_type'] == "Veg"){
+                    echo "<td> <span class='veg'>" . $row['m_type'] . "</span></td>";
+                } else {
+                    echo "<td> <span class='nonveg'>" . $row['m_type'] . "</span></td>";
+                }
             }
         } else {
             echo "<tr><td colspan='6'>ADD items in the menu to display here</td></tr>";
@@ -82,7 +178,7 @@
     </table>
 
     <h1>Add to Menu </h1>
-    <table>
+    <table class="order-table">
         <tr>
             <th>Item ID</th>
             <th>Item Name</th>
@@ -98,17 +194,17 @@
                 echo "<tr>";
                 echo "<form action='add_menu.php' method='post'>";
                 echo "<td><input required type='hidden' name='m_id' value=''> </td>";
-                echo "<td>Name: <input required type='text' name='m_name' value=''><br></td>";
+                echo "<td><input class='dataInput' required type='text' placeholder='Name of item' name='m_name' value=''><br></td>";
                 //echo "<td>" . $row['it</td>";
-                echo "<td>Price: <input required type='number' name='m_price' value=''><br></td>";
+                echo "<td><input class='dataInput' required type='number' placeholder='Price' name='m_price' value=''><br></td>";
 
 
                 echo "<td>Category: <select name='m_type'>";
                 echo "<option value='Veg' " . ($row['order_status'] === 'Veg' ? 'selected' : '') . ">Veg</option>";
                 echo "<option value='Non-Veg' " . ($row['order_status'] === 'Non-Veg' ? 'selected' : '') . ">Non-Veg</option>";
                 echo "</select>";
 
-                echo "<td><input required type='submit' value='Update'></td>";
+                echo "<td><input class='add-item' required type='submit' value='Add'></td>";
                 echo "</form>";
                 echo "</tr>";
         $conn->close();