提交 4e345fb5 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 样式优化

上级 4d5dfcfd
...@@ -169,6 +169,7 @@ function handleTop(data: CourseListItemType) { ...@@ -169,6 +169,7 @@ function handleTop(data: CourseListItemType) {
margin-left: 5px; margin-left: 5px;
.el-progress__text { .el-progress__text {
font-size: 12px !important; font-size: 12px !important;
min-width: unset;
} }
} }
} }
......
...@@ -81,15 +81,13 @@ function formatDuration(duration: number | undefined) { ...@@ -81,15 +81,13 @@ function formatDuration(duration: number | undefined) {
default-expand-all default-expand-all
row-key="id" row-key="id"
style="width: 100%" style="width: 100%"
:header-cell-style="{ 'background-color': '#F7F8FA' }" :header-cell-style="{ 'background-color': '#F7F8FA', 'font-size': '16px', 'font-weight': 400 }">
>
<el-table-column prop="name" label="章节"> <el-table-column prop="name" label="章节">
<template #default="{ row }"> <template #default="{ row }">
<template v-if="row.depth === 3"> <template v-if="row.depth === 3">
<router-link <router-link
:to="`/course/player?course_id=${courseId}&chapter_id=${row.chapter_id}&section_id=${row.section_id}&resource_id=${row.resource_id}&semester_id=${semesterId}`" :to="`/course/player?course_id=${courseId}&chapter_id=${row.chapter_id}&section_id=${row.section_id}&resource_id=${row.resource_id}&semester_id=${semesterId}`"
target="_blank" target="_blank">
>
{{ row.name }} {{ row.name }}
</router-link> </router-link>
</template> </template>
...@@ -128,4 +126,14 @@ function formatDuration(duration: number | undefined) { ...@@ -128,4 +126,14 @@ function formatDuration(duration: number | undefined) {
color: #333333; color: #333333;
} }
} }
:deep(.el-table__row--level-0) {
font-size: 16px;
font-weight: 500;
color: #333;
}
:deep(.el-table__row--level-1) {
font-size: 16px;
font-weight: 400;
color: #333;
}
</style> </style>
...@@ -94,8 +94,7 @@ function showInfo(title: string, content: string) { ...@@ -94,8 +94,7 @@ function showInfo(title: string, content: string) {
:autoplay="false" :autoplay="false"
indicator-position="none" indicator-position="none"
:arrow="detail.lecturers.length > 1 ? 'always' : 'never'" :arrow="detail.lecturers.length > 1 ? 'always' : 'never'"
height="126px" height="126px">
>
<el-carousel-item v-for="item in detail.lecturers" :key="item.id" class="lecturer-item"> <el-carousel-item v-for="item in detail.lecturers" :key="item.id" class="lecturer-item">
<img :src="item.avatar" class="lecturer-item__pic" /> <img :src="item.avatar" class="lecturer-item__pic" />
<div class="lecturer-item__info"> <div class="lecturer-item__info">
...@@ -105,8 +104,7 @@ function showInfo(title: string, content: string) { ...@@ -105,8 +104,7 @@ function showInfo(title: string, content: string) {
<div <div
class="lecturer-item__content" class="lecturer-item__content"
v-html="item.summarize" v-html="item.summarize"
style="height: 66px; overflow: hidden" style="height: 66px; overflow: hidden"></div>
></div>
</template> </template>
<div class="lecturer-item__content" v-html="item.summarize"></div> <div class="lecturer-item__content" v-html="item.summarize"></div>
</el-popover> </el-popover>
...@@ -142,7 +140,7 @@ function showInfo(title: string, content: string) { ...@@ -142,7 +140,7 @@ function showInfo(title: string, content: string) {
</div> </div>
</div> </div>
<el-dialog v-model="dialogInfo.visible" :title="dialogInfo.title" width="472px" center> <el-dialog v-model="dialogInfo.visible" :title="dialogInfo.title" width="472px" center>
<div v-html="dialogInfo.content"></div> <div v-html="dialogInfo.content" class="dialog-info"></div>
</el-dialog> </el-dialog>
</template> </template>
...@@ -164,8 +162,8 @@ function showInfo(title: string, content: string) { ...@@ -164,8 +162,8 @@ function showInfo(title: string, content: string) {
color: #333333; color: #333333;
} }
ul { ul {
margin-top: 10px; margin-top: 20px;
margin-bottom: 20px; margin-bottom: 30px;
display: flex; display: flex;
} }
li { li {
...@@ -240,4 +238,9 @@ function showInfo(title: string, content: string) { ...@@ -240,4 +238,9 @@ function showInfo(title: string, content: string) {
.course-view-bd { .course-view-bd {
padding: 10px 20px; padding: 10px 20px;
} }
.dialog-info {
:deep(img) {
max-width: 100%;
}
}
</style> </style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论