Optimized and cleaned up more scss

src/components/utilities/Modal.vue

@@ -114,33 +114,32 @@ onUnmounted(() => {
     button {
       width: 40px;
       height: 40px;
-      margin: auto 0;
+      margin: 0;
       padding: 0;
       position: relative;
 
       img {
-        width: inherit;
-        height: inherit;
+        width: 100%;
+        height: 100%;
       }
 
-      &:hover {
-        &::after {
-          content: '';
-          position: absolute;
-          width: 38px;
-          height: 38px;
-          left: 1px;
-          top: 1px;
-          border-radius: 100%;
-          background-color: $lilac;
-          z-index: -1;
-        }
+      &:hover::after {
+        content: '';
+        position: absolute;
+        width: 38px;
+        height: 38px;
+        left: 1px;
+        top: 1px;
+        border-radius: 50%;
+        background-color: $lilac;
+        z-index: -1;
       }
     }
   }
 
   .modal-body {
     padding: 15px;
+
     .submit {
       display: inline-block;
       button {
@@ -151,19 +150,26 @@ onUnmounted(() => {
     button {
       padding: 10px 16px;
       min-width: 6.25rem;
-      position: relative;
       border-radius: 5px;
     }
+
+    p {
+      color: $black;
+    }
+
     .modal-form {
       display: inline;
+
       .form-fields {
         display: flex;
         flex-direction: column;
         margin-bottom: 20px;
+
         label {
           margin-bottom: 10px;
           color: $black;
         }
+
         input {
           max-width: 250px;
           border: 1px solid $purple;
@@ -175,4 +181,4 @@ onUnmounted(() => {
     }
   }
 }
-</style>
+</style>