附件列表样式优化

This commit is contained in:
unknown
2023-07-30 13:23:14 +08:00
parent 531b09cb53
commit 70e5646e6b
2 changed files with 22 additions and 20 deletions

View File

@@ -213,12 +213,12 @@
} }
.title { .title {
width: 276px; width: 276px;
margin-top: 15px; margin-top: 14px;
height: 14px; height: 16px;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
color: rgba(0, 0, 0, 0.88); color: rgba(0, 0, 0, 0.88);
line-height: 14px; line-height: 16px;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;

View File

@@ -1,5 +1,5 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Image, ProgressCircle } from "antd-mobile"; import { Image, ProgressCircle, Tabs } from "antd-mobile";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
import { useNavigate, useLocation, useParams } from "react-router-dom"; import { useNavigate, useLocation, useParams } from "react-router-dom";
import backIcon from "../../assets/images/commen/icon-back-n.png"; import backIcon from "../../assets/images/commen/icon-back-n.png";
@@ -155,22 +155,24 @@ const CoursePage = () => {
</div> </div>
<div className={styles["other-content"]}> <div className={styles["other-content"]}>
<div className={styles["tabs"]}> <div className={styles["tabs"]}>
{items.map((item: any) => ( <Tabs
<div activeKey={String(tabKey)}
key={item.key} onChange={(key: any) => {
className={ setTabKey(Number(key));
item.key === tabKey }}
? styles["tab-active-item"] style={{
: styles["tab-item"] "--fixed-active-line-width": "20px",
} "--active-line-height": "3px",
onClick={() => { "--active-title-color": "rgba(0,0,0,0.88)",
onChange(item.key); "--active-line-border-radius": "2px",
}} "--title-font-size": "16px",
>
<div className={styles["tit"]}>{item.label}</div> }}
{item.key === tabKey && <i className={styles["act-line"]}></i>} >
</div> {items.map((item) => (
))} <Tabs.Tab title={item.label} key={item.key} />
))}
</Tabs>
</div> </div>
{tabKey === 1 && ( {tabKey === 1 && (
<> <>