wancat/linux-odyssey
1
0 Fork 0
mirror of https://github.com/linux-odyssey/linux-odyssey.git synced 2026-11-08 11:30:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: overflow in hint

Browse Source
This commit is contained in:
wancat committed 2024-02-29 10:54:53 +08:00
1 parent 90e661f77b
commit 622d64dd45
1 file changed
+59 -56
Download Patch File Download Diff File Expand all files Collapse all files
app/src/components/HintPart.vue
+59 -56
View File
@@ -26,62 +26,65 @@ const right = () => {
</script> </script>
<template> <template>
<div class="w-full flex items-center p-2 overflow-auto"> <div class="h-full flex flex-col">
<font-awesome-icon <!-- Hint Header -->
:icon="['far', 'lightbulb']" <div class="flex items-center p-2 h-10">
class="text-yellow-200 p-2 content-center" <font-awesome-icon
/> :icon="['far', 'lightbulb']"
<h1 class="inline text-text w-1/2 font-xl p-2 m-1"> class="text-yellow-200 p-2 content-center"
<!-- Hint --> />
提示 <h1 class="inline text-text w-1/2 font-xl p-2 m-1">
</h1> <!-- Hint -->
<div v-if="current !== -1" class="flex w-full justify-end items-end"> 提示
<button </h1>
class="p-2 m-1 w-1/8" <div v-if="current !== -1" class="flex w-full justify-end items-end">
id="Lbutton" <button
@click="left" class="p-2 m-1 w-1/8"
:disabled="current <= 0" id="Lbutton"
> @click="left"
<font-awesome-icon :disabled="current <= 0"
:icon="['fas', 'arrow-right']" >
class="text-text" <font-awesome-icon
rotation="180" :icon="['fas', 'arrow-right']"
/> class="text-text"
</button> rotation="180"
<p class="inline text-text font-xl w-1/14 p-2 m-1">{{ current + 1 }}</p> />
<p class="inline text-text font-xl w-1/14 p-2 m-1">/</p> </button>
<p class="inline text-text font-xl w-1/14 p-2 m-1"> <p class="inline text-text font-xl w-1/14 p-2 m-1">{{ current + 1 }}</p>
{{ sessionStore.session.hints.length }} <p class="inline text-text font-xl w-1/14 p-2 m-1">/</p>
</p> <p class="inline text-text font-xl w-1/14 p-2 m-1">
<button {{ sessionStore.session.hints.length }}
class="p-2 m-1 w-1/8" </p>
id="Rbutton" <button
@click="right" class="p-2 m-1 w-1/8"
:disabled="current === sessionStore.session.hints.length - 1" id="Rbutton"
> @click="right"
<font-awesome-icon :icon="['fas', 'arrow-right']" class="text-text" /> :disabled="current === sessionStore.session.hints.length - 1"
</button> >
<font-awesome-icon :icon="['fas', 'arrow-right']" class="text-text" />
</button>
</div>
</div>
<div id="hint" class="bg-bg p-8 overflow-y-auto">
<ul>
<li
v-for="response in sessionStore.session.responses[current]"
:key="response"
class="text-text font-xl whitespace-pre-wrap"
>
<div v-for="content in response.content" :key="content">
<MarkdownText :content="content" />
</div>
</li>
<li
v-for="hint in sessionStore.session.hints[current]"
:key="hint"
class="text-text-primary font-xl whitespace-pre-wrap"
>
<MarkdownText :content="hint" />
</li>
</ul>
<br />
</div> </div>
</div> </div>
<div id="hint" class="bg-bg flex flex-wrap p-8 overflow-auto">
<ul>
<li
v-for="response in sessionStore.session.responses[current]"
:key="response"
class="text-text font-xl whitespace-pre-wrap"
>
<div v-for="content in response.content" :key="content">
<MarkdownText :content="content" />
</div>
</li>
<li
v-for="hint in sessionStore.session.hints[current]"
:key="hint"
class="text-text font-xl whitespace-pre-wrap"
>
<MarkdownText :content="hint" />
</li>
</ul>
<br />
</div>
</template> </template>