课程详情tab栏样式优化

src/main.scss

@@ -155,3 +155,15 @@ code {
 .dplayer-mobile-play {
   opacity: 1 !important;
 }
+
+.course-tab-box {
+  width: 100%;
+  min-height: 24px;
+  display: flex;
+  align-items: center;
+  position: relative;
+  margin-bottom: 20px;
+  .adm-tabs-tab-wrapper {
+    padding: 0 36px 0 0;
+  }
+}

src/pages/course/index.module.scss

@@ -86,40 +86,6 @@
     align-items: center;
     position: relative;
     margin-bottom: 20px;
-    .tab-item {
-      width: auto;
-      min-height: 24px;
-      margin-right: 36px;
-      position: relative;
-      .tit {
-        font-size: 16px;
-        font-weight: 400;
-        color: rgba(0, 0, 0, 0.45);
-        line-height: 16px;
-      }
-    }
-    .tab-active-item {
-      width: auto;
-      min-height: 24px;
-      margin-right: 36px;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      .tit {
-        font-size: 16px;
-        font-weight: 500;
-        color: rgba(0, 0, 0, 0.88);
-        line-height: 16px;
-      }
-      .act-line {
-        margin-top: 5px;
-        display: block;
-        width: 20px;
-        height: 3px;
-        background: #ff4d4f;
-        border-radius: 2px;
-      }
-    }
   }
   .desc {
     width: 100%;

src/pages/course/index.tsx

@@ -154,8 +154,9 @@ const CoursePage = () => {
         </div>
       </div>
       <div className={styles["other-content"]}>
-        <div className={styles["tabs"]}>
+        <div className="course-tab-box">
           <Tabs
+            activeLineMode="fixed"
             activeKey={String(tabKey)}
             onChange={(key: any) => {
               setTabKey(Number(key));
@@ -166,7 +167,7 @@ const CoursePage = () => {
               "--active-title-color": "rgba(0,0,0,0.88)",
               "--active-line-border-radius": "2px",
               "--title-font-size": "16px",
-          
+              "--content-padding":"18px"
             }}
           >
             {items.map((item) => (