fix: review

Author: Raubzeug

src/containers/Tenant/Healthcheck/Healthcheck.scss

@@ -21,21 +21,24 @@
     &__issues {
         padding: 0 var(--g-spacing-4) var(--g-spacing-4) var(--g-spacing-4);
     }
+
+    &__animation-container {
+        overflow: hidden;
+
+        min-height: 0;
+    }
     &__issue-wrapper {
         border: 1px solid var(--g-color-line-generic);
         border-radius: var(--g-border-radius-s);
-
         .g-disclosure_enter_active {
             display: grid;
 
-            animation-name: disclosure-expanded;
-            animation-duration: 0.2s;
+            animation: disclosure-expanded 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards;
         }
         .g-disclosure_exit_active {
             display: grid;
 
-            animation-name: disclosure-collapsed;
-            animation-duration: 0.1s;
+            animation: disclosure-collapsed 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards;
         }
     }
     &__issue-summary {
@@ -86,8 +89,6 @@
         background-color: var(--g-color-text-danger);
     }
     &__issue-details {
-        overflow: hidden;
-
         padding: 0 var(--g-spacing-4) var(--g-spacing-4) var(--g-spacing-4);
     }
 }

src/containers/Tenant/Healthcheck/components/HealthcheckIssue.tsx

@@ -71,14 +71,16 @@ export function HealthcheckIssue({issue, expanded}: HealthcheckIssueProps) {
                         </div>
                     )}
                 </Disclosure.Summary>
-                <Flex className={b('issue-details')} direction="column" gap={3} grow={1}>
-                    <HealthcheckIssueTabs
-                        parents={parents}
-                        selectedTab={selectedTab}
-                        setSelectedTab={setSelectedTab}
-                    />
-                    {currentIssue && <IssueDetails issue={currentIssue} />}
-                </Flex>
+                <div className={b('animation-container')}>
+                    <Flex className={b('issue-details')} direction="column" gap={3} grow={1}>
+                        <HealthcheckIssueTabs
+                            parents={parents}
+                            selectedTab={selectedTab}
+                            setSelectedTab={setSelectedTab}
+                        />
+                        {currentIssue && <IssueDetails issue={currentIssue} />}
+                    </Flex>
+                </div>
             </Disclosure>
         </Flex>
     );

src/containers/Tenant/TenantDrawerWrappers.tsx

@@ -57,7 +57,7 @@ export function TenantDrawerWrapper({children, database}: TenantDrawerWrapperPro
                 drawerId="tenant-healthcheck-details"
                 storageKey="tenant-healthcheck-details-drawer-width"
                 detectClickOutside
-                showVeil
+                hideVeil={false}
                 isPercentageWidth
                 drawerControls={[
                     {