mozzie/web-backset.cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'feat/backset.cn-dev-2.1' into release/1.0

Browse Source
This commit is contained in:
mozzie 2023-03-23 15:45:46 +08:00
commit 630c8ca1b5
2 changed files with 34 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
apps/web/src/view/CourseDetail/index.less
View File

@ -8,31 +8,47 @@
overflow-y: auto; overflow-y: auto;
border-right: 1px solid var(--color-border-2); border-right: 1px solid var(--color-border-2);
> h2 { > h3 {
margin-bottom: 10px; margin: 0 0 10px 0;
} }
.toc { .toc {
padding-top: 20px; padding-top: 20px;
.level-1 { .level-1 {
color: var(--color-text-4); color: var(--color-text-3);
line-height: 1.5; line-height: 1.5;
padding-top: 10px; padding-top: 24px;
font-size: 13px;
&:first-of-type {
padding-top: 0;
}
} }
.level-2 { .level-2 {
padding: 5px 0; margin: 6px 0;
padding: 6px 12px 6px 6px;
line-height: 1.5;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
font-size: 14px;
color: var(--color-text-2); color: var(--color-text-2);
cursor: pointer; cursor: pointer;
&:hover { &:hover {
color: var(--color-text-1); color: var(--color-text-1);
background: var(--color-fill-1);
border-radius: 6px;
} }
&.active { &.active {
background: var(--color-fill-2);
border-radius: 6px;
color: var(--color-primary-1);
.xicon,
.time {
color: var(--color-primary-1); color: var(--color-primary-1);
} }
}
.xicon { .xicon {
color: var(--color-text-4);
margin-right: 6px; margin-right: 6px;
} }
.time { .time {

18
apps/web/src/view/CourseDetail/index.tsx
View File

@ -8,6 +8,7 @@ import { getCourseDetailById } from "../../api";
import { ms2Time } from "./util"; import { ms2Time } from "./util";
import Result from "../../components/Result"; import Result from "../../components/Result";
import PlayCircle20Regular from "@ricons/fluent/PlayCircle20Regular"; import PlayCircle20Regular from "@ricons/fluent/PlayCircle20Regular";
import DocumentChevronDouble20Regular from "@ricons/fluent/DocumentChevronDouble20Regular";
import { Icon } from "@ricons/utils"; import { Icon } from "@ricons/utils";
import dayjs from "dayjs"; import dayjs from "dayjs";
@ -52,6 +53,11 @@ function CourseDetail() {
level: 2, level: 2,
time: "", time: "",
active: true, active: true,
icon: (
<Icon size={20}>
<DocumentChevronDouble20Regular />
</Icon>
),
view: <Guide mdText={data?.guide.guide_html} />, view: <Guide mdText={data?.guide.guide_html} />,
}, },
...processToc, ...processToc,
@ -83,12 +89,10 @@ function CourseDetail() {
{toc.length > 0 ? ( {toc.length > 0 ? (
<> <>
<aside className="table-of-content"> <aside className="table-of-content">
<h2>{course.course_title}</h2> <h3>{course.course_title}</h3>
<div> <div style={{ color: "var(--color-text-3)", fontSize: 13 }}>
<div style={{ color: "var(--color-text-3)" }}>
<span>{course.course_createtime}</span> <span>{course.course_createtime}</span>
</div> </div>
</div>
<div className="toc"> <div className="toc">
{toc.map((i: any) => { {toc.map((i: any) => {
if (i.level === 1) { if (i.level === 1) {
@ -104,9 +108,11 @@ function CourseDetail() {
key={i.title} key={i.title}
onClick={() => onclickItem(i)} onClick={() => onclickItem(i)}
> >
<div className="bs ellipsis fc"> <div className="bs fc">
{i.icon} {i.icon}
<span>{i.title}</span> <span style={{ padding: "0 12px 0 6px" }}>
{i.title}
</span>
</div> </div>
<span className="time">{i.time}</span> <span className="time">{i.time}</span>
</div> </div>