Merge pull request #67 from codebase-berkeley/stocklisting-user-admin…

…-bugs Stocklisting user admin bugs
codebase-berkeley · Apr 30, 2022 · d326c8e · d326c8e
2 parents ac2465f + 8297a51
commit d326c8e
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 31 deletions.
diff --git a/client/src/components/Food.js b/client/src/components/Food.js
@@ -4,6 +4,7 @@ import Tags from './Tags.js'
 import pen from './../images/pen.svg'
 import checkmark from './../images/instockMark.svg'
 import xmark from '../images/notinstock.svg'
+import { useState } from 'react'; 
 
 
 function Food(props) {
@@ -62,7 +63,7 @@ function Food(props) {
                         {/* style={{paddingRight: "11%"}} style={{paddingLeft: "6%"}} */}
                         <div className ="food-inStockCheck">
                             In Stock
-                            <input type="checkbox"></input>
+                            <input type="checkbox" checked = {props.in_stock}></input>
                         </div>
                     </div>
 

diff --git a/client/src/pages/StockListingAdmin.css b/client/src/pages/StockListingAdmin.css
@@ -52,7 +52,13 @@
     font-size: 10px;
 }
 
-.stocklisting-addButton {
+.stocklisting-something {
+    border-radius: 100%;
+    background-color: red;
+    color: red;
+}
+
+.stocklisting-addItem {
     background-color: #264425;
     display: flex;
     height: 5vh;
@@ -65,15 +71,20 @@
     align-items: center;
 }
 
+.stocklisting-buttonthing {
+    background-color: red;
+    background: red;
+    color: red;
+}
 .stocklisting-addButton:hover {
     background-color: #ACB9AC;
     color: #fff; 
 }
 
-.stocklisting-addItem{
+/* .stocklisting-addItem{
     display: flex;
     padding-right: 1vw;
-}
+} */
 
 .stocklisting-changeStock{
     font-size: 16;
@@ -293,27 +304,46 @@ p#stocklisting-filterControlLabel {
     font-size: 15px;
 }
 
+.stocklisting-form-check-input {
+    border-radius: 5%;
+    background-color: red;
+    color: red;
+    background-color: red;
+}
 
 
-input[type="checkbox"], input[type="radio"] {
+input[type="checkbox"] {
     border: 1.5px solid #B8B8B8;
     margin: 4px 8px 4px 8px;
+
 }
 
-input[type="checkbox"]:checked, input[type="radio"]:checked {
-    border: 1.5px solid #B8B8B8;
-    background-color: solid #264425; 
+input[type="radio"] {
+    border-radius: 100%;
+    background-color: #333;
+    margin-right: 1vw;
+    margin-top: .35vh;
+}
+
+input[type='radio']:checked {
+    border-radius: 100%;
+    color: black;
+    background-color: black;
     accent-color: #264425;
-    box-shadow: "transparent";
+  }
 
+/* input[type="checkbox"]:checked, input[type="radio"]:checked {
+    border: 1.5px solid #B8B8B8;
+    background-color: red; 
+    box-shadow: "transparent"; 
     box-shadow: inset 0 0 0 2.5px white, inset 0 0 0 8px #264425;
     margin: 4px 8px 4px 8px;
+    border-radius: 999px;
+} */
 
-}
-
-input[type="checkbox"]:hover, input[type="radio"]:hover {
+/* input[type="checkbox"]:hover, input[type="radio"]:hover {
     border: 1.5px solid #B8B8B8;
     background-color: white;
     margin: 4px 8px 4px 8px;
-}
+} */
 
diff --git a/client/src/pages/StockListingAdmin.js b/client/src/pages/StockListingAdmin.js
@@ -209,7 +209,7 @@ export function StockListingAdmin() {
                     <div className="stocklisting-rightSide">
                          <Link to="/add-food" className = "addButton" style = {{textDecoration: 'none'}}>
                             <img src={isbesPlusSign}></img>
-                            <div className="addItem"> Add new item </div>
+                            <div className="stocklisting-addItem"> Add new item </div>
                     </Link>
                         <button className="stocklisting-changeStock" onClick={() => setOutOfStock()}> Set all items to out of stock </button>
 
@@ -270,13 +270,13 @@ export function StockListingAdmin() {
                                 <div className="sstocklisting-howText"> Show </div>
                                 <div className="stocklisting-form-check">
                                     <label class="stocklisting-form-check-label" for="exampleRadios1">
-                                        <input class="stocklisting-form-check-input" type="radio" checked={selectedShow == 0} onChange={e => {
+                                        <input className = "stocklisting-form-check-input" type="radio" checked={selectedShow == 0} onChange={e => {
                                             if (e.target.checked) {
                                                 setSelectedShow(0);
                                             }
-                                        }}/>
-
+                                        }}></input>
                                         All items
+
                                     </label>
                                 </div>
 
@@ -322,10 +322,6 @@ export function StockListingAdmin() {
                                     in_stock={foodItem.instock} 
                                     tags={foodItem.tags} 
                                     admin={true}
-                                    onChange={() => {
-                                        foodItem.instock = !foodItem.instock
-                                    }}
-
 
                                     />))}
 
@@ -509,12 +505,7 @@ export function StockListingUser() {
                                     name={foodItem.name} 
                                     image={foodItem.image} 
                                     in_stock={foodItem.instock} 
-                                    tags={foodItem.tags} 
-                                    onChange={() => {
-                                        foodItem.instock = !foodItem.instock
-                                    }}
-
-
+                                    tags={foodItem.tags}                                      
                                     />))}
 
                     </div>

diff --git a/client/src/pages/ViewAppointments.css b/client/src/pages/ViewAppointments.css
@@ -306,14 +306,14 @@ p#filterControlLabel {
     border: 1.5px solid #B8B8B8;
 }
 
-input[type="checkbox"]:checked, input[type="radio"]:checked {
+input[type="checkbox"]:checked {
     border: 1.5px solid #B8B8B8;
-    background-color: solid #264425;
+    background-color: solid black;
     box-shadow: "transparent";
-    box-shadow: inset 0 0 0 2.5px white, inset 0 0 0 8px #264425;
+    box-shadow: inset 0 0 0 2.5px white, inset 0 0 0 8px #333;
 }
 
-input[type="checkbox"]:hover, input[type="radio"]:hover {
+input[type="checkbox"]:hover {
     border: 1.5px solid #B8B8B8;
     background-color: white;
 }