feat: 给分板样式调整

src/components/shared/ScoringPanelItem.vue

@@ -12,7 +12,7 @@
         </div>
       </template>
     </toggle-dialog-render>
-    <div class="flex flex-1 flex-wrap items-center score-list" :class="getClass('justify-start', 'justify-center')">
+    <div class="flex flex-1 flex-wrap score-list">
       <div
         v-for="scoreItem in scoreList"
         :key="scoreItem"
@@ -251,9 +251,9 @@ const onToggleClick = () => {
   font-size: $MediumFont;
   margin-bottom: 6px;
   &.sticky {
-    height: $MainLayoutHeaderHeight;
+    // height: $MainLayoutHeaderHeight;
     align-items: center;
-    padding: 0 20px;
+    padding: 10px 20px;
   }
 
   .dialog-name {
@@ -264,16 +264,18 @@ const onToggleClick = () => {
 
   .score-list {
     font-size: $BaseFont;
-
+    margin-bottom: -8px;
+    margin-left: 8px;
     .score-span {
       width: 46px;
-      height: 46px;
-      line-height: 46px;
+      height: 32px;
+      line-height: 32px;
       text-align: center;
       border-radius: 4px;
       border: 1px solid #e5e5e5;
       color: #666666;
       margin-left: 8px;
+      margin-bottom: 8px;
       cursor: pointer;
 
       &.active,
@@ -293,6 +295,7 @@ const onToggleClick = () => {
       line-height: 32px;
       min-width: 84px;
       overflow: hidden;
+      margin-bottom: 8px;
 
       .score-num {
         width: 40px;
@@ -324,7 +327,7 @@ const onToggleClick = () => {
 
   .toggle-icon {
     opacity: 0;
-    &.toggle-visible {
+    &.visible {
       opacity: 1;
     }
   }