Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
845e41c060
commit
401c1bef7c
2 files changed
+26
-3
No files matched your search
@@ -17,6 +17,16 @@ defineProps<{
|
||||
const emit = defineEmits<{ solved: [exerciseId: number] }>()
|
||||
|
||||
const isDark = useDark()
|
||||
|
||||
/** 学习目标那几行只有行内的 **加粗** 和 `代码`,先转义再换成标签,别为它拉一个 MdPreview */
|
||||
function inline(text: string) {
|
||||
return text
|
||||
.replace(/&/g, "&")
|
||||
.replace(/</g, "<")
|
||||
.replace(/>/g, ">")
|
||||
.replace(/`([^`]+)`/g, '<code class="ic">$1</code>')
|
||||
.replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>")
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -32,7 +42,7 @@ const isDark = useDark()
|
||||
<h2 v-else-if="seg.type === 'heading'" :id="seg.id" class="h2">{{ seg.text }}</h2>
|
||||
<div v-else-if="seg.type === 'goals'" :id="seg.id" class="goals">
|
||||
<div class="goals-title">学完这课你能</div>
|
||||
<div v-for="item in seg.items" :key="item">· {{ item.replace(/`/g, "") }}</div>
|
||||
<div v-for="item in seg.items" :key="item">· <span v-html="inline(item)" /></div>
|
||||
</div>
|
||||
<CodeRunBlock
|
||||
v-else-if="seg.type === 'code'"
|
||||
@@ -80,6 +90,17 @@ const isDark = useDark()
|
||||
line-height: 1.8;
|
||||
scroll-margin-top: 16px;
|
||||
}
|
||||
.goals :deep(.ic) {
|
||||
font-family: var(--learn-code-font);
|
||||
font-size: 13px;
|
||||
padding: 1px 5px;
|
||||
border-radius: 3px;
|
||||
background: var(--learn-soft);
|
||||
color: #c7254e;
|
||||
}
|
||||
html.dark .goals :deep(.ic) {
|
||||
color: #f08a9b;
|
||||
}
|
||||
.goals-title {
|
||||
font-weight: 700;
|
||||
margin-bottom: 2px;
|
||||
|
||||
@@ -413,12 +413,14 @@ function jumpExercise(id: number) {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
/* 桌面端固定高度,三栏各自滚动 */
|
||||
/* 桌面端固定高度,三栏各自滚动。72 = 顶栏 56 + 外框上内边距 16;
|
||||
底下的 16 内边距用负外边距吃掉,上一课 / 下一课那条贴着屏幕底 */
|
||||
.layout {
|
||||
display: grid;
|
||||
grid-template-columns: 260px minmax(0, 1fr) 220px;
|
||||
grid-template-rows: minmax(0, 1fr);
|
||||
height: calc(100vh - 134px);
|
||||
height: calc(100vh - 72px);
|
||||
margin-bottom: -16px;
|
||||
}
|
||||
@media (max-width: 1180px) {
|
||||
.layout {
|
||||
|
||||
Reference in new issue
Block a user