#10 Added ability for users to be removed from the site.

static/css/buttons.css

@@ -0,0 +1,66 @@
+@import url(https://fonts.googleapis.com/css?family=Roboto:700);
+
+:root {
+    --btn-width: 100%;
+}
+
+.button {
+    font-size: medium;
+    font-weight: bold;
+    width : var(--btn-width);
+    height : 50px;
+    overflow: hidden;
+    text-align : center;
+    transition : .2s;
+    cursor : pointer;
+    border-radius: 3px;
+    box-shadow: 0px 1px 2px rgba(0,0,0,.2);
+}
+.btnTwo {
+    position : relative;
+    width : 200px;
+    height : 100px;
+    margin-top: -100px;
+    padding-top: 2px;
+    background : rgba(0, 0, 0, 0.1);
+    left : -250px;
+    transition : .3s;
+}
+.btnText {
+    color : white;
+    transition : .3s;
+}
+.btnText2 {
+    margin-top : 63px;
+    margin-right : -130px;
+    color : #FFF;
+}
+.button:hover .btnTwo{ /*When hovering over .button change .btnTwo*/
+    left: -130px;
+}
+.button:hover .btnText{ /*When hovering over .button change .btnText*/
+    margin-left : 65px;
+}
+.button:active { /*Clicked and held*/
+    box-shadow: 0px 5px 6px rgba(0,0,0,0.3);
+}
+
+.button.error {
+    background-color: var(--red);
+}
+
+.button.success {
+    background: var(--green);
+}
+
+.button.info {
+    background-color: #2879c550;
+}
+
+.button.wmgzon {
+    background-color: orange;
+}
+
+.button.neutral {
+    background-color: rgba(0, 0, 0, 0.3);
+}

static/css/products.css

@@ -96,6 +96,10 @@
     gap: 1rem 1rem;
 }
 
+.product-selection {
+    width: 60%;
+}
+
 .product-description {
     font-size: 70%;
 }
@@ -140,6 +144,7 @@
     justify-content: space-around;
     flex-wrap: wrap;
     align-items: center;
+    gap: .5em;
 }
 .product-quantity {
     font-size: 50%;