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

style(md-deck): Use double quotes and shrink-0 class

This commit is contained in:
hyper 2026-06-30 21:35:39 +08:00
parent b3d390dfd5
commit bdc06cc49a
3 changed files with 28 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/md-deck/DeckHeader.tsx
View File

@ -1,5 +1,5 @@
import { For } from 'solid-js';
import type { DeckStore } from './hooks/deckStore';
import { For } from "solid-js";
import type { DeckStore } from "./hooks/deckStore";
export interface DeckHeaderProps {
store: DeckStore;
@ -18,20 +18,20 @@ export function DeckHeader(props: DeckHeaderProps) {
onClick={() => store.actions.setIsEditing(!store.state.isEditing)}
class={`px-3 py-1 rounded text-sm font-medium transition-colors cursor-pointer ${
store.state.isEditing && !store.state.fixed
? 'bg-blue-100 text-blue-600'
: 'bg-gray-100 text-gray-600 hover:bg-gray-200'
? "bg-blue-100 text-blue-600"
: "bg-gray-100 text-gray-600 hover:bg-gray-200"
}`}
>
{store.state.isEditing ? '✓ 编辑中' : '✏️ 编辑'}
{store.state.isEditing ? "✓ 编辑中" : "✏️ 编辑"}
</button>
{/* 导出 PDF 按钮 */}
<button
onClick={() => store.actions.exportDeck()}
class="px-2 py-1 rounded text-xs font-medium transition-colors cursor-pointer bg-green-100 text-green-600 hover:bg-green-200"
>
📥 导出 PDF
</button>
{/* 导出 PDF 按钮 */}
<button
onClick={() => store.actions.exportDeck()}
class="px-2 py-1 rounded text-xs font-medium transition-colors cursor-pointer bg-green-100 text-green-600 hover:bg-green-200"
>
📥 导出 PDF
</button>
{/* Tab 选择器 */}
<div class="flex gap-1 overflow-x-auto flex-1 min-w-0 flex-wrap">
@ -39,10 +39,10 @@ export function DeckHeader(props: DeckHeaderProps) {
{(card, index) => (
<button
onClick={() => store.actions.setActiveTab(index())}
class={`font-medium transition-colors flex-shrink-0 min-w-[1.6em] cursor-pointer px-2 py-1 rounded ${
class={`font-medium transition-colors shrink-0 min-w-[1.6em] cursor-pointer px-2 py-1 rounded ${
store.state.activeTab === index()
? 'bg-blue-100 text-blue-600 border-b-2 border-blue-600'
: 'text-gray-500 hover:text-gray-700 hover:bg-gray-100'
? "bg-blue-100 text-blue-600 border-b-2 border-blue-600"
: "text-gray-500 hover:text-gray-700 hover:bg-gray-100"
}`}
>
{card.label || card.name || `Card ${index() + 1}`}

20
src/components/md-deck/editor-panel/DataEditorPanel.tsx
View File

@ -1,10 +1,10 @@
import { For } from 'solid-js';
import type { DeckStore } from '../hooks/deckStore';
import { For } from "solid-js";
import type { DeckStore } from "../hooks/deckStore";
export interface DataEditorPanelProps {
activeTab: number;
cards: DeckStore['state']['cards'];
updateCardData: DeckStore['actions']['updateCardData'];
cards: DeckStore["state"]["cards"];
updateCardData: DeckStore["actions"]["updateCardData"];
}
/**
@ -12,18 +12,22 @@ export interface DataEditorPanelProps {
*/
export function DataEditorPanel(props: DataEditorPanelProps) {
return (
<div class="w-64 flex-shrink-0">
<div class="w-64 shrink-0">
<h3 class="font-bold mb-2">卡牌数据</h3>
<div class="space-y-2 max-h-96 overflow-y-auto">
<For each={Object.keys(props.cards[props.activeTab] || {})}>
{(key) => (
<div>
<label class="block text-sm font-medium text-gray-700">{key}</label>
<label class="block text-sm font-medium text-gray-700">
{key}
</label>
<textarea
class="w-full border border-gray-300 rounded px-2 py-1 text-sm"
rows={3}
value={props.cards[props.activeTab]?.[key] || ''}
onInput={(e) => props.updateCardData(props.activeTab, key, e.target.value)}
value={props.cards[props.activeTab]?.[key] || ""}
onInput={(e) =>
props.updateCardData(props.activeTab, key, e.target.value)
}
/>
</div>
)}

2
src/components/md-deck/editor-panel/LayerEditorPanel.tsx
View File

@ -55,7 +55,7 @@ function LayerEditorPanel(props: LayerEditorPanelProps) {
});
return (
<div class="w-64 flex-shrink-0">
<div class="w-64 shrink-0">
<h3 class="font-bold mb-2 mt-0">
图层 ({side() === "front" ? "正面" : "背面"})
</h3>