commiting after making some small ui changes

src/components/Basket.js

@@ -80,7 +80,10 @@ export default function Basket(props) {
             <div
               className="row"
               onClick={() => {
-                console.log(cartDetails.reference)
+                document.getElementById("hiddenSpan").style.display =
+                "inline-block";
+                document.getElementById("cancelButtonId").style.display =
+                "inline-block";
                 axios
                   .post("http://localhost:8080/api/v1/addProducts", cartDetails)
                   .then((response) => {
@@ -88,8 +91,7 @@ export default function Basket(props) {
                       // alert("post is successfull");
                     }
                   });
-                document.getElementById("hiddenSpan").style.display =
-                  "inline-block";
+          
               }}
             >
               <StripeCheckout
@@ -100,15 +102,18 @@ export default function Basket(props) {
                 amount={totalPrice + "00"}
               />
               <br />
-              <span id="hiddenSpan">
+            </div>
+            <br/>
+            <span id="hiddenSpan">
                 Order {cartDetails.orderNumber} is placed successfully
               </span>
-            </div>
+              <br/>
             <br />
-            <button  className = "disabled"onClick={() => {
+            <button id = "cancelButtonId" onClick={() => {
                  let newValetAmt = (parseInt(localStorage.getItem("valetAmount")) + itemsPrice)
                  localStorage.setItem("valetAmount",newValetAmt)
-                 console.log("New Valet Amount", newValetAmt);
+                 document.getElementById("hiddenSpan").style.display =
+                 "none";
                  const newValetAmount = {
                   newValetAmt:newValetAmt
                  }
@@ -119,7 +124,12 @@ export default function Basket(props) {
                       // alert("post is successfull");
                     }
                   });
+                  document.getElementById("hiddenSpanForCancel").style.display =
+                  "inline-block";
               }}>Cancel Order</button>
+               <span  id="hiddenSpanForCancel">
+                Order is cancelled and the amount of Rs. {itemsPrice} is successfully added in your valet
+              </span>
           </>
         )}
       </div>

src/index.css

@@ -98,6 +98,12 @@ button.remove{
   position:fixed;
 }
 
-.addDisable{
-  disabled:true
+#hiddenSpanForCancel{
+  display: none;
+  color: red;
+  font-weight: bold;
+}
+
+#cancelButtonId{
+  display: none;
 }
\ No newline at end of file