lotobo/pdf-tools
1
0
Fork 0
Code Issues 14 Pull Requests Releases 6 Wiki Activity

feat: add shared Toolbox header and themes

Browse Source
This commit is contained in:
Albrecht Degering
2026-07-23 00:29:21 +02:00
parent d40a288a4e
commit 8425d44658
19 changed files with 356 additions and 274 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/components/WorkspacePanel.tsx
View File

@@ -54,7 +54,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
<div className="card">
<h2>Workspace</h2>
<p style={{ fontSize: '0.85rem', color: '#6b7280' }}>
<p style={{ fontSize: '0.85rem', color: 'var(--pdf-muted-soft)' }}>
Save named workspaces in this browser. PDF binaries are stored in
IndexedDB; nothing is uploaded.
</p>
@@ -78,7 +78,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
minWidth: 0,
padding: '0.45rem 0.55rem',
borderRadius: '0.5rem',
border: '1px solid #d1d5db',
border: '1px solid var(--pdf-border-strong)',
fontSize: '0.9rem',
}}
/>
@@ -140,7 +140,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
style={{
marginTop: '0.5rem',
fontSize: '0.8rem',
color: '#92400e',
color: 'var(--pdf-warning-text)',
}}
>
Unsaved workspace changes.
@@ -152,7 +152,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
style={{
marginTop: '0.5rem',
fontSize: '0.85rem',
color: '#166534',
color: 'var(--pdf-success-text)',
}}
>
{workspaceMessage}
@@ -178,10 +178,12 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
<div
key={workspace.id}
style={{
border: '1px solid #e5e7eb',
border: '1px solid var(--pdf-border)',
borderRadius: '0.5rem',
padding: '0.5rem',
background: active ? '#eff6ff' : '#f9fafb',
background: active
? 'var(--pdf-info-surface)'
: 'var(--pdf-surface-soft)',
display: 'flex',
justifyContent: 'space-between',
gap: '0.75rem',
@@ -193,11 +195,19 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
<div style={{ fontSize: '0.9rem' }}>
<strong>{workspace.name}</strong>
{active && (
<span style={{ color: '#2563eb' }}> · active</span>
<span style={{ color: 'var(--pdf-primary)' }}>
{' '}
· active
</span>
)}
</div>
<div style={{ fontSize: '0.75rem', color: '#6b7280' }}>
<div
style={{
fontSize: '0.75rem',
color: 'var(--pdf-muted-soft)',
}}
>
{workspace.pdfName} · source pages:{' '}
{workspace.sourcePageCount} · workspace pages:{' '}
{workspace.workspacePageCount} · undo:{' '}
@@ -228,8 +238,8 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
disabled={isBusy}
onClick={() => onDeleteWorkspace(workspace.id)}
style={{
background: '#fee2e2',
color: '#991b1b',
background: 'var(--pdf-danger-soft)',
color: 'var(--pdf-danger-text)',
}}
>
Delete
@@ -261,8 +271,8 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
key={entry.id}
style={{
fontSize: '0.8rem',
color: '#374151',
borderLeft: '3px solid #2563eb',
color: 'var(--pdf-muted)',
borderLeft: '3px solid var(--pdf-primary)',
paddingLeft: '0.45rem',
paddingTop: '0.2rem',
paddingBottom: '0.2rem',
@@ -272,7 +282,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
Undo {history.length - index}. {entry.label}
</strong>
<br />
<span style={{ color: '#6b7280' }}>
<span style={{ color: 'var(--pdf-muted-soft)' }}>
{new Date(entry.timestamp).toLocaleString()}
</span>
</div>
@@ -282,12 +292,12 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
style={{
margin: '0.25rem 0',
borderRadius: '999px',
background: '#ecfdf5',
color: '#166534',
background: 'var(--pdf-success-surface)',
color: 'var(--pdf-success-text)',
fontSize: '0.8rem',
fontWeight: 600,
alignSelf: 'flex-start',
border: '2px solid #166534',
border: '2px solid var(--pdf-success-text)',
width: '100%',
}}
></div>
@@ -300,8 +310,8 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
key={entry.id}
style={{
fontSize: '0.8rem',
color: '#9ca3af',
borderLeft: '3px solid #d1d5db',
color: 'var(--pdf-muted-faint)',
borderLeft: '3px solid var(--pdf-border-strong)',
paddingLeft: '0.45rem',
paddingTop: '0.2rem',
paddingBottom: '0.2rem',
@@ -312,7 +322,7 @@ const WorkspacePanel: React.FC<WorkspacePanelProps> = ({
Redo {index + 1}. {entry.label}
</strong>
<br />
<span style={{ color: '#9ca3af' }}>
<span style={{ color: 'var(--pdf-muted-faint)' }}>
{new Date(entry.timestamp).toLocaleString()}
</span>
</div>