pabloid
/
tsgames
1
0
Fork 0
Code

Send icons

This commit is contained in:
Pabloader 2026-04-09 14:26:23 +00:00
parent 3074d6dd8d
commit f7dd0176c7
2 changed files with 21 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/games/storywriter/assets/chat-sidebar.module.css
View File

@ -51,6 +51,12 @@
opacity: 1;
}
@media (max-width: 1000px) {
.messageActions {
opacity: 1;
}
}
.iconButton {
display: flex;
align-items: center;
@ -308,15 +314,17 @@
}
.sendButton {
padding: 5px 14px;
font-size: 13px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
color: var(--bg);
background: var(--accent);
border: none;
border-radius: 4px;
cursor: pointer;
height: 28px;
width: 28px;
&:hover:not(:disabled) {
background: var(--accent-alt);
@ -329,15 +337,17 @@
}
.stopButton {
padding: 5px 14px;
font-size: 13px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
color: var(--bg);
background: var(--error, #f44336);
border: none;
border-radius: 4px;
cursor: pointer;
height: 28px;
width: 28px;
&:hover {
background: #d32f2f;

9
src/games/storywriter/components/chat-sidebar.tsx
View File

@ -3,7 +3,7 @@ import { highlight } from "@common/highlight";
import { useInputState } from "@common/hooks/useInputState";
import { useMediaQuery } from "@common/hooks/useMediaQuery";
import clsx from "clsx";
import { Check, ChevronsRight, Edit2, GitFork, RefreshCw, Sparkles, Trash2, X } from "lucide-preact";
import { Check, ChevronsRight, Edit2, GitFork, RefreshCw, SendHorizonal, Sparkles, Square, Trash2, X } from "lucide-preact";
import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks";
import { MOBILE_BREAKPOINT } from '../assets/breakpoints';
import styles from '../assets/chat-sidebar.module.css';
@ -584,8 +584,8 @@ export const ChatPanel = ({ visible }: { visible: boolean }) => {
</div>
<div class={styles.inputFooterRight}>
{isLoading ? (
<button class={styles.stopButton} onClick={handleStopGeneration}>
Stop
<button class={styles.stopButton} onClick={handleStopGeneration} title="Stop">
<Square size={14} />
</button>
) : (
<>
@ -621,8 +621,9 @@ export const ChatPanel = ({ visible }: { visible: boolean }) => {
class={styles.sendButton}
onClick={handleSendMessage}
disabled={isDisabled}
title="Send"
>
Send
<SendHorizonal size={14} />
</button>
</>
)}