Skip to content

Commit 46be195

Browse files
authored
docs: add hide code btn in the bottom for code box (#6917)
1 parent 089548e commit 46be195

File tree

2 files changed

+24
-1
lines changed

2 files changed

+24
-1
lines changed

site/src/components/DemoBox.vue

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,22 @@
8282
<slot v-if="type === 'TS'" name="htmlCode" />
8383
<slot v-else name="jsVersionHtml" />
8484
</div>
85+
<div class="code-box-actions code-box-actions-bottom">
86+
<a-tooltip :title="$t(`app.demo.code.hide`)">
87+
<span class="code-expand-icon code-box-code-action">
88+
<img
89+
alt="expand code"
90+
:src="
91+
theme === 'dark'
92+
? 'https://gw.alipayobjects.com/zos/antfincdn/CjZPwcKUG3/OpROPHYqWmrMDBFMZtKF.svg'
93+
: 'https://gw.alipayobjects.com/zos/antfincdn/4zAaozCvUH/unexpand.svg'
94+
"
95+
:class="'code-expand-icon-show'"
96+
@click="handleCodeExpand($event, sectionId)"
97+
/>
98+
</span>
99+
</a-tooltip>
100+
</div>
85101
</section>
86102
</section>
87103
</template>
@@ -164,11 +180,17 @@ export default defineComponent({
164180
).trim()
165181
: '',
166182
);
167-
const handleCodeExpand = () => {
183+
const handleCodeExpand = (_, sectionId?) => {
168184
if (globalConfig.blocked.value) {
169185
warning();
170186
return;
171187
}
188+
if (sectionId) {
189+
const element = document.getElementById(sectionId);
190+
if (element) {
191+
element.scrollIntoView();
192+
}
193+
}
172194
codeExpand.value = !codeExpand.value;
173195
};
174196
const handleCodeCopied = () => {

site/src/theme/static/common.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ html {
22
&.rtl {
33
direction: rtl;
44
}
5+
scroll-behavior: smooth;
56
}
67

78
body {

0 commit comments

Comments
 (0)