fix: 实体关系模块右侧列表详情样式调整

src/assets/css/components/views/charts2/graphRightDetailBlock.scss

@@ -1,11 +1,23 @@
-$font-size: 14px;
+$font-size: 12px;
 .graph-detail-basic-info {
   position: relative;
-  padding-bottom: 20px;
+  padding-bottom: 12px;
   display: flex;
   justify-content: space-between;
   //height: 100%;
 
+  .graph-detail-header {
+    display: flex;
+    flex-direction: column;
+
+    .entity-graph-type {
+      font-family: NotoSansSChineseRegular;
+      font-size: 12px;
+      color: #717171;
+      font-weight: 400;
+    }
+  }
+
   .entity-type {
     color: #717171;
   }
@@ -31,8 +43,8 @@ $font-size: 14px;
         display: flex;
         justify-content: center;
         align-items: center;
-        height: 28px;
-        width: 28px;
+        height: 18px;
+        width: 18px;
         border-radius: 50%;
         background-color: #EFF1F4;
         cursor: pointer;
@@ -40,15 +52,16 @@ $font-size: 14px;
 
         i {
           color: #717171;
-          font-size: 12px;
+          font-size: 10px;
+          -webkit-transform: scale(0.8); // 强制给文字进行缩放，达到12px以下小字体的效果
         }
       }
     }
   }
 
   .graph-detail__icon {
-    width: 52px;
-    height: 52px;
+    width: 50px;
+    height: 50px;
     overflow: hidden;
     display: flex;
     justify-content: center;
@@ -56,7 +69,7 @@ $font-size: 14px;
     align-items: center;
     margin-right: 10px;
     border-radius: 50%;
-    background-color: #e5edf3;
+    background-color: #F3F7FA;
 
     i {
       font-size: 26px;
@@ -72,7 +85,8 @@ $font-size: 14px;
 }
 
 .graph-basic-info__block {
-  margin: 10px 0;
+  margin-top: 12px;
+  margin-bottom: 18px;
 
   .graph-header__icon {
     width: 3px !important;
@@ -103,6 +117,7 @@ $font-size: 14px;
         color: #353636;
         font-weight: 400;
         overflow-wrap: break-word;
+        line-height: normal;
       }
     }
 
@@ -117,18 +132,21 @@ $font-size: 14px;
 
       .graph-relationship-item-label, .graph-relationship-item-value {
         font-family: NotoSansSChineseRegular;
-        font-size: $font-size; // 原型上为12px，呈现效果不好，后续再调节
+        font-size: $font-size;
         color: #353636;
         font-weight: 400;
         //height: 40px;
         display: flex;
         align-items: center !important;
         padding-top: 1px;
+
+        .graph-relationship-item-label-icon {
+          font-size: 14px;
+        }
       }
 
       .graph-relationship-item-value {
         color: #717171;
-
       }
     }
   }
@@ -143,7 +161,13 @@ $font-size: 14px;
       margin-bottom: 10px;
       margin-right: 9px;
       padding: 0 8px;
+      height: 24px;
+      line-height: 24px;
       font-size: 12px;
+
+      span {
+        margin-top: -2px;
+      }
     }
   }
 }
@@ -152,6 +176,10 @@ $font-size: 14px;
   padding-bottom: 10px;
 }
 
+.padding-b-4 {
+  padding-bottom: 4px;
+}
+
 //修改popover样式
 .graph-popover {
   width: auto !important;
@@ -165,6 +193,16 @@ $font-size: 14px;
   background: #303133 !important;
 }
 
-.graph-expand-relationship__icon:hover {
-  color: #D80000 !important;
+.graph-expand-relationship__icon {
+  font-size: 13px;
+  &:hover {
+    color: #D80000 !important;
+  }
+}
+
+.graph-basic-info__block-title {
+  font-family: NotoSansHans-Medium;
+  font-size: 13px;
+  color: #353636;
+  font-weight: 600;
 }