hypercross
/
ttrpg-tools
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: layout

This commit is contained in:
hypercross 2026-03-03 00:48:13 +08:00
parent a02edabc41
commit 6b77653d27
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
content/yarn-test.md Normal file
View File

@ -0,0 +1 @@
:md-yarn-spinner[./adventures/test.yarn]

9
src/components/md-yarn-spinner.tsx
View File

@ -63,6 +63,7 @@ customElement<RunnerOptions>('md-yarn-spinner', {
function advance(index?: number){ function advance(index?: number){
const runner = runnerInstance(); const runner = runnerInstance();
if(!runner) return; if(!runner) return;
if(runner.currentResult?.type !== 'options' && runner.currentResult?.isDialogueEnd) return;
runner.advance(index); runner.advance(index);
processRunnerOutput(runner); processRunnerOutput(runner);
} }
@ -123,9 +124,9 @@ customElement<RunnerOptions>('md-yarn-spinner', {
}; };
return ( return (
<div class="yarn-spinner w-full max-w-2xl mx-auto shadow-sm"> <div class="yarn-spinner w-full max-w-2xl mx-auto shadow-sm relative">
{/* 对话历史 */} {/* 对话历史 */}
<div class="dialogue-history p-4 min-h-[200px] max-h-[60vh] overflow-y-auto bg-gray-50"> <div class="dialogue-history p-4 h-64 overflow-y-auto bg-gray-50">
<Show when={dialogueHistory().length === 0 && !yarnContent.loading}> <Show when={dialogueHistory().length === 0 && !yarnContent.loading}>
<div class="text-gray-400 text-center py-8">点击重新开始开始对话</div> <div class="text-gray-400 text-center py-8">点击重新开始开始对话</div>
</Show> </Show>
@ -156,8 +157,8 @@ customElement<RunnerOptions>('md-yarn-spinner', {
</div> </div>
</Show> </Show>
{/* 工具栏 */} {/* 浮动工具栏 */}
<div class="toolbar p-2 border-t bg-gray-100 flex justify-end gap-2"> <div class="toolbar absolute top-0 right-0 p-2 bg-gray-100 border-t border-l rounded-tl-lg shadow-sm flex gap-2">
<button <button
onClick={restart} onClick={restart}
class="restart-button px-3 py-1 text-sm bg-gray-200 hover:bg-gray-300 class="restart-button px-3 py-1 text-sm bg-gray-200 hover:bg-gray-300