首页筛选项样式调整

src/Newest/components/NewestLibrary.tsx

@@ -278,21 +278,25 @@ const NewestLibrary: React.FC = props => {
         </div>
       )} */}
       {tagData && tagData?.List1?.length > 0 && (
-        <div className={styles['newestindex-label-wrapper']}>
-          {tagData?.List1?.map((item: string, index: number) => (
-            <div className={handleIncludeIds(item)} key={index} onClick={handleClickTag.bind(this, item, 'activity')}>
-              {item}
-            </div>
-          ))}
+        <div className="m-r-md g-inline-block">
+          <div className={styles['newestindex-label-wrapper']}>
+            {tagData?.List1?.map((item: string, index: number) => (
+              <div className={handleIncludeIds(item)} key={index} onClick={handleClickTag.bind(this, item, 'activity')}>
+                {item}
+              </div>
+            ))}
+          </div>
         </div>
       )}
       {tagData && tagData?.List2?.length > 0 && (
-        <div className={styles['newestindex-label-wrapper']}>
-          {tagData?.List2?.map((item: string, index: number) => (
-            <div className={handleIncludeIds(item)} key={index} onClick={handleClickTag.bind(this, item, 'activity')}>
-              {item}
-            </div>
-          ))}
+        <div className="g-inline-block">
+          <div className={styles['newestindex-label-wrapper']}>
+            {tagData?.List2?.map((item: string, index: number) => (
+              <div className={handleIncludeIds(item)} key={index} onClick={handleClickTag.bind(this, item, 'activity')}>
+                {item}
+              </div>
+            ))}
+          </div>
         </div>
       )}
       {tagData && tagData?.List3?.length > 0 && (
@@ -308,7 +312,7 @@ const NewestLibrary: React.FC = props => {
           ))}
         </div>
       )}
-      <div className="m-t-sm">
+      <div>
         <MasonryContainer
           loadMore={handleLoadMoreData}
           hasMore={hasMore}

src/Newest/css/NewestIndex.module.scss

@@ -107,19 +107,22 @@
   }
 }
 .newestindex-label-wrapper {
+  background: #ffffff;
+  border-radius: 47px;
+  padding: 10px;
+  margin-bottom: 20px;
   display: flex;
   flex-wrap: wrap;
   :global {
     .newestindex-label-item {
       padding: 6px 20px;
-      background: #ffffff;
+      background: #F6F6F6;
       border-radius: 100px;
-      margin: 0 20px 10px 0;
-      line-height: 22px;
+      margin: 0 10px;
+      cursor: pointer;
       &:hover {
         background: #faa12f;
         color: #ffffff;
-        cursor: pointer;
       }
     }
     .act-newestindex-label {