Fix mobile font size and enable smart keyboard features
This commit is contained in:
@@ -596,6 +596,95 @@
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* Markdown preview */
|
||||
.markdown-preview {
|
||||
margin-top: 1rem;
|
||||
background: #0d0d0d;
|
||||
border: 1px solid #333;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.preview-header {
|
||||
padding: 0.5rem 1rem;
|
||||
background: #1a1a1a;
|
||||
color: #888;
|
||||
font-size: 0.85rem;
|
||||
border-bottom: 1px solid #333;
|
||||
}
|
||||
|
||||
.preview-content {
|
||||
padding: 1rem;
|
||||
color: #ccc;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.6;
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.preview-content h1,
|
||||
.preview-content h2,
|
||||
.preview-content h3,
|
||||
.preview-content h4 {
|
||||
color: #fff;
|
||||
margin: 1rem 0 0.5rem;
|
||||
}
|
||||
|
||||
.preview-content h1:first-child,
|
||||
.preview-content h2:first-child,
|
||||
.preview-content h3:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.preview-content p {
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
|
||||
.preview-content strong {
|
||||
color: #a0b4ff;
|
||||
}
|
||||
|
||||
.preview-content em {
|
||||
color: #c9a0ff;
|
||||
}
|
||||
|
||||
.preview-content ul,
|
||||
.preview-content ol {
|
||||
margin: 0.5rem 0;
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
|
||||
.preview-content li {
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
|
||||
.preview-content code {
|
||||
background: rgba(102, 126, 234, 0.2);
|
||||
padding: 0.1rem 0.4rem;
|
||||
border-radius: 4px;
|
||||
font-family: "Fira Code", monospace;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
.preview-content pre {
|
||||
background: #111;
|
||||
padding: 1rem;
|
||||
border-radius: 8px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.preview-content pre code {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.preview-content blockquote {
|
||||
border-left: 3px solid #667eea;
|
||||
padding-left: 1rem;
|
||||
margin: 0.5rem 0;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Character fields */
|
||||
.character-fields {
|
||||
display: flex;
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import { useNavigate, Link, useParams } from "react-router-dom";
|
||||
import ReactMarkdown from "react-markdown";
|
||||
import { useAuth } from "../contexts/AuthContext";
|
||||
import { createStory, getStory, updateStory } from "../services/api";
|
||||
import type { Character } from "../types";
|
||||
@@ -652,7 +653,7 @@ export default function CreateStoryPage() {
|
||||
<label htmlFor="narrativeRules">Инструкции для ИИ</label>
|
||||
<p className="field-hint">
|
||||
Кастомные правила поведения ИИ. Если пусто — используются
|
||||
стандартные правила.
|
||||
стандартные правила. Поддерживается Markdown.
|
||||
</p>
|
||||
<textarea
|
||||
id="narrativeRules"
|
||||
@@ -677,6 +678,14 @@ export default function CreateStoryPage() {
|
||||
rows={14}
|
||||
className="markdown-input"
|
||||
/>
|
||||
{form.narrativeRules.trim() && (
|
||||
<div className="markdown-preview">
|
||||
<div className="preview-header">👁️ Превью</div>
|
||||
<div className="preview-content">
|
||||
<ReactMarkdown>{form.narrativeRules}</ReactMarkdown>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
@@ -752,7 +752,7 @@
|
||||
|
||||
.message-content {
|
||||
padding: 0.75rem 0.875rem;
|
||||
font-size: 0.9rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.quick-actions {
|
||||
@@ -768,7 +768,7 @@
|
||||
.input-container textarea {
|
||||
min-height: 32px;
|
||||
padding: 0.4rem 0.875rem;
|
||||
font-size: 0.9rem;
|
||||
font-size: 16px; /* Минимум 16px чтобы iOS не зумил */
|
||||
}
|
||||
|
||||
.send-btn,
|
||||
|
||||
+84
-33
@@ -395,23 +395,36 @@ export default function GamePage() {
|
||||
|
||||
// Находим следующее сообщение ИИ (если есть)
|
||||
const nextMessage = session.messages[messageIndex + 1];
|
||||
const currentAiResponse = nextMessage?.role === "assistant" ? nextMessage.content : undefined;
|
||||
const currentAiResponse =
|
||||
nextMessage?.role === "assistant" ? nextMessage.content : undefined;
|
||||
|
||||
// Инициализируем версии если их нет (первая версия = оригинал с текущим ответом ИИ)
|
||||
const versions: MessageVersion[] = message.versions || [{
|
||||
content: message.content,
|
||||
timestamp: message.timestamp,
|
||||
aiResponse: currentAiResponse
|
||||
}];
|
||||
const versions: MessageVersion[] = message.versions || [
|
||||
{
|
||||
content: message.content,
|
||||
timestamp: message.timestamp,
|
||||
aiResponse: currentAiResponse,
|
||||
},
|
||||
];
|
||||
|
||||
// Если текущая версия не имеет aiResponse, добавляем его
|
||||
const currentVersionIdx = message.activeVersion || 0;
|
||||
if (versions[currentVersionIdx] && !versions[currentVersionIdx].aiResponse && currentAiResponse) {
|
||||
versions[currentVersionIdx] = { ...versions[currentVersionIdx], aiResponse: currentAiResponse };
|
||||
if (
|
||||
versions[currentVersionIdx] &&
|
||||
!versions[currentVersionIdx].aiResponse &&
|
||||
currentAiResponse
|
||||
) {
|
||||
versions[currentVersionIdx] = {
|
||||
...versions[currentVersionIdx],
|
||||
aiResponse: currentAiResponse,
|
||||
};
|
||||
}
|
||||
|
||||
// Добавляем новую версию (aiResponse добавится после генерации)
|
||||
const newVersion: MessageVersion = { content: editContent.trim(), timestamp: new Date() };
|
||||
const newVersion: MessageVersion = {
|
||||
content: editContent.trim(),
|
||||
timestamp: new Date(),
|
||||
};
|
||||
const newVersions: MessageVersion[] = [...versions, newVersion];
|
||||
const newActiveVersion = newVersions.length - 1;
|
||||
|
||||
@@ -453,7 +466,10 @@ export default function GamePage() {
|
||||
|
||||
// Сохраняем ответ ИИ в текущую версию
|
||||
const finalVersions: MessageVersion[] = [...newVersions];
|
||||
finalVersions[newActiveVersion] = { ...finalVersions[newActiveVersion], aiResponse: response };
|
||||
finalVersions[newActiveVersion] = {
|
||||
...finalVersions[newActiveVersion],
|
||||
aiResponse: response,
|
||||
};
|
||||
|
||||
const finalUserMessage: ChatMessage = {
|
||||
...updatedUserMessage,
|
||||
@@ -467,7 +483,11 @@ export default function GamePage() {
|
||||
timestamp: new Date(),
|
||||
};
|
||||
|
||||
const allMessages = [...messagesUpToEdit, finalUserMessage, assistantMessage];
|
||||
const allMessages = [
|
||||
...messagesUpToEdit,
|
||||
finalUserMessage,
|
||||
assistantMessage,
|
||||
];
|
||||
|
||||
const finalSession: GameSession = {
|
||||
...session,
|
||||
@@ -481,7 +501,10 @@ export default function GamePage() {
|
||||
if (streamingContent.trim()) {
|
||||
// Сохраняем частичный ответ в версию
|
||||
const finalVersions: MessageVersion[] = [...newVersions];
|
||||
finalVersions[newActiveVersion] = { ...finalVersions[newActiveVersion], aiResponse: streamingContent };
|
||||
finalVersions[newActiveVersion] = {
|
||||
...finalVersions[newActiveVersion],
|
||||
aiResponse: streamingContent,
|
||||
};
|
||||
|
||||
const finalUserMessage: ChatMessage = {
|
||||
...updatedUserMessage,
|
||||
@@ -512,7 +535,10 @@ export default function GamePage() {
|
||||
};
|
||||
|
||||
// Переключить версию сообщения
|
||||
const handleSwitchVersion = async (messageId: string, direction: "prev" | "next") => {
|
||||
const handleSwitchVersion = async (
|
||||
messageId: string,
|
||||
direction: "prev" | "next",
|
||||
) => {
|
||||
if (!session || !story || !currentSessionId) return;
|
||||
|
||||
const messageIndex = session.messages.findIndex((m) => m.id === messageId);
|
||||
@@ -525,18 +551,24 @@ export default function GamePage() {
|
||||
let newVersion: number;
|
||||
|
||||
if (direction === "prev") {
|
||||
newVersion = currentVersion > 0 ? currentVersion - 1 : message.versions.length - 1;
|
||||
newVersion =
|
||||
currentVersion > 0 ? currentVersion - 1 : message.versions.length - 1;
|
||||
} else {
|
||||
newVersion = currentVersion < message.versions.length - 1 ? currentVersion + 1 : 0;
|
||||
newVersion =
|
||||
currentVersion < message.versions.length - 1 ? currentVersion + 1 : 0;
|
||||
}
|
||||
|
||||
// Сохраняем текущий ответ ИИ в текущую версию перед переключением
|
||||
const nextMessage = session.messages[messageIndex + 1];
|
||||
const currentAiResponse = nextMessage?.role === "assistant" ? nextMessage.content : undefined;
|
||||
const currentAiResponse =
|
||||
nextMessage?.role === "assistant" ? nextMessage.content : undefined;
|
||||
|
||||
const updatedVersions: MessageVersion[] = [...message.versions];
|
||||
if (currentAiResponse && updatedVersions[currentVersion]) {
|
||||
updatedVersions[currentVersion] = { ...updatedVersions[currentVersion], aiResponse: currentAiResponse };
|
||||
updatedVersions[currentVersion] = {
|
||||
...updatedVersions[currentVersion],
|
||||
aiResponse: currentAiResponse,
|
||||
};
|
||||
}
|
||||
|
||||
const selectedVersion = updatedVersions[newVersion];
|
||||
@@ -601,7 +633,12 @@ export default function GamePage() {
|
||||
};
|
||||
|
||||
const handleSwitchSession = async (sessionId: string) => {
|
||||
console.log("[GamePage] Switching to session:", sessionId, "current:", currentSessionId);
|
||||
console.log(
|
||||
"[GamePage] Switching to session:",
|
||||
sessionId,
|
||||
"current:",
|
||||
currentSessionId,
|
||||
);
|
||||
if (!id || sessionId === currentSessionId) {
|
||||
setShowSessionMenu(false);
|
||||
return;
|
||||
@@ -755,16 +792,21 @@ export default function GamePage() {
|
||||
<div className="version-switcher">
|
||||
<button
|
||||
className="version-btn"
|
||||
onClick={() => handleSwitchVersion(message.id, "prev")}
|
||||
onClick={() =>
|
||||
handleSwitchVersion(message.id, "prev")
|
||||
}
|
||||
>
|
||||
‹
|
||||
</button>
|
||||
<span className="version-indicator">
|
||||
{(message.activeVersion || 0) + 1}/{message.versions.length}
|
||||
{(message.activeVersion || 0) + 1}/
|
||||
{message.versions.length}
|
||||
</span>
|
||||
<button
|
||||
className="version-btn"
|
||||
onClick={() => handleSwitchVersion(message.id, "next")}
|
||||
onClick={() =>
|
||||
handleSwitchVersion(message.id, "next")
|
||||
}
|
||||
>
|
||||
›
|
||||
</button>
|
||||
@@ -772,7 +814,9 @@ export default function GamePage() {
|
||||
)}
|
||||
<button
|
||||
className="edit-btn"
|
||||
onClick={() => handleEditMessage(message.id, message.content)}
|
||||
onClick={() =>
|
||||
handleEditMessage(message.id, message.content)
|
||||
}
|
||||
title="Редактировать"
|
||||
>
|
||||
✏️
|
||||
@@ -836,7 +880,13 @@ export default function GamePage() {
|
||||
</div>
|
||||
*/}
|
||||
|
||||
<form className="input-container" onSubmit={(e) => { e.preventDefault(); handleSend(); }}>
|
||||
<form
|
||||
className="input-container"
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
handleSend();
|
||||
}}
|
||||
>
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
value={input}
|
||||
@@ -844,7 +894,8 @@ export default function GamePage() {
|
||||
setInput(e.target.value);
|
||||
// Auto-resize
|
||||
e.target.style.height = "auto";
|
||||
e.target.style.height = Math.min(e.target.scrollHeight, 150) + "px";
|
||||
e.target.style.height =
|
||||
Math.min(e.target.scrollHeight, 150) + "px";
|
||||
}}
|
||||
onKeyDown={handleKeyDown}
|
||||
placeholder="Что ты хочешь сделать?..."
|
||||
@@ -852,24 +903,24 @@ export default function GamePage() {
|
||||
rows={1}
|
||||
name="chat-input"
|
||||
autoComplete="off"
|
||||
autoCorrect="off"
|
||||
autoCapitalize="off"
|
||||
spellCheck={false}
|
||||
autoCorrect="on"
|
||||
autoCapitalize="sentences"
|
||||
spellCheck={true}
|
||||
enterKeyHint="send"
|
||||
data-form-type="other"
|
||||
data-lpignore="true"
|
||||
data-gramm="false"
|
||||
/>
|
||||
{isLoading ? (
|
||||
<button type="button" onClick={handleStop} className="send-btn stop-btn">
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleStop}
|
||||
className="send-btn stop-btn"
|
||||
>
|
||||
⏹
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
type="submit"
|
||||
disabled={!input.trim()}
|
||||
className="send-btn"
|
||||
>
|
||||
<button type="submit" disabled={!input.trim()} className="send-btn">
|
||||
➤
|
||||
</button>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user