15863 fixed the red invalid state sizing issue and some reshaping (#573)

* 15863 fixed the red invalid state sizing issue and some reshaping

* 15863 package json update

* 15863 fixed the red overflow and cut off issue

* 15863 removed dead negative spacing in restoration type

package.json

@@ -1,6 +1,6 @@
 {
   "name": "business-create-ui",
-  "version": "5.5.4",
+  "version": "5.5.5",
   "private": true,
   "appName": "Create UI",
   "sbcName": "SBC Common Components",

src/components/Restoration/RestorationType.vue

@@ -21,6 +21,7 @@
           <v-radio-group
             v-model="selectRestorationType"
             class="mt-0 pt-0"
+            hide-details="auto"
             @change="changeRestorationType()"
           >
             <v-radio

src/views/Restoration/RestorationBusinessName.vue

@@ -43,16 +43,19 @@
       >
         <RestorationType
           id="restoration-type"
-          class="mb-n5"
           :class="{ 'approval-restoration-invalid-section': invalidSectionRestoration }"
         />
 
         <!-- Divider b/w Restoration and Approval type -->
-        <v-divider class="mb-11 mr-5 ml-5"></v-divider>
+        <div
+          class="px-5"
+          :class="{ 'invalid-divider': invalidSectionRestoration && invalidSectionApproval }"
+        >
+          <v-divider />
+        </div>
 
         <ApprovalType
           id="approval-type"
-          class="mt-n10"
           :class="{ 'approval-restoration-invalid-section': invalidSectionApproval }"
         />
       </v-card>
@@ -167,4 +170,9 @@ header p {
   border-top-left-radius: 0 !important;
   border-bottom-left-radius: 0 !important;
 }
+
+#restoration-type-section .v-card .invalid-divider {
+  border-left: 3px solid $BCgovInputError !important;
+  padding-left: calc(20px - 3px) !important;
+}
 </style>