fix(Tenant): align info in overview

Author: ariser

src/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.scss

@@ -1,3 +1,6 @@
+$section-title-margin: 20px;
+$section-title-line-height: 24px;
+
 .kv-detailed-overview {
     display: flex;
     gap: 20px;

src/containers/Tenant/Diagnostics/Healthcheck/Healthcheck.js

@@ -97,10 +97,14 @@ class Healthcheck extends React.Component {
                     </div>
                     {this.renderUpdateButton()}
                 </div>
-                <div>
+                <div className={b('preview-content')}>
                     {text}
                     {!statusOk && (
-                        <Button view="flat-info" onClick={showMoreHandler}>
+                        <Button
+                            view="flat-info"
+                            onClick={showMoreHandler}
+                            size="s"
+                        >
                             Show details
                         </Button>
                     )}

src/containers/Tenant/Diagnostics/Healthcheck/Healthcheck.scss

@@ -1,3 +1,4 @@
+@use '../DetailedOverview/DetailedOverview.scss' as detailedOverview;
 @import '../../../../styles/mixins.scss';
 
 .healthcheck {
@@ -37,14 +38,17 @@
 
     &__status-wrapper {
         display: flex;
-        align-items: baseline;
 
-        margin-bottom: 15px;
+        margin-bottom: detailedOverview.$section-title-margin;
         gap: 8px;
     }
 
     &__preview-title {
         font-weight: 600;
+        line-height: detailedOverview.$section-title-line-height;
+    }
+
+    &__preview-content {
         line-height: 24px;
     }
 

src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.scss

@@ -1,3 +1,5 @@
+@use '../DetailedOverview/DetailedOverview.scss' as detailedOverview;
+
 .tenant-overview {
     padding-bottom: 20px;
     &__loader {
@@ -30,13 +32,15 @@
         align-items: center;
 
         margin-bottom: 10px;
+
+        line-height: 24px;
     }
 
     &__top-label {
-        margin-bottom: 20px;
+        margin-bottom: detailedOverview.$section-title-margin;
 
         font-weight: 600;
-        line-height: 24px;
+        line-height: detailedOverview.$section-title-line-height;
         gap: 10px;
     }
 
@@ -54,7 +58,7 @@
         flex-wrap: wrap;
         align-items: center;
 
-        margin-bottom: 20px;
+        margin-bottom: 35px;
     }
 
     &__collapse-title {
@@ -88,7 +92,7 @@
         margin-bottom: 20px;
 
         font-size: var(--yc-text-body-2-font-size);
-        font-weight: 500;
+        font-weight: 600;
         line-height: var(--yc-text-body-2-line-height);
     }
 }