Settings reorganization

This commit is contained in:
Stefan Hardegger
2025-09-17 15:06:35 +02:00
parent c0b3ae3b72
commit 64f97f5648
9 changed files with 1200 additions and 952 deletions

View File

@@ -55,6 +55,17 @@ export default function StoryCard({
return new Date(dateString).toLocaleDateString();
};
const calculateReadingPercentage = (story: Story): number => {
if (!story.readingPosition) return 0;
const totalLength = story.contentPlain?.length || story.contentHtml.length;
if (totalLength === 0) return 0;
return Math.round((story.readingPosition / totalLength) * 100);
};
const readingPercentage = calculateReadingPercentage(story);
if (viewMode === 'list') {
return (
<div className="theme-card theme-shadow rounded-lg p-4 hover:shadow-lg transition-shadow">
@@ -100,6 +111,11 @@ export default function StoryCard({
<div className="flex items-center gap-4 mt-2 text-sm theme-text">
<span>{formatWordCount(story.wordCount)}</span>
<span>{formatDate(story.createdAt)}</span>
{readingPercentage > 0 && (
<span className="bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 px-2 py-1 rounded text-xs font-mono">
{readingPercentage}% read
</span>
)}
{story.seriesName && (
<span>
{story.seriesName} #{story.volume}
@@ -231,6 +247,11 @@ export default function StoryCard({
<div className="text-xs theme-text space-y-1">
<div>{formatWordCount(story.wordCount)}</div>
<div>{formatDate(story.createdAt)}</div>
{readingPercentage > 0 && (
<div className="bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 px-2 py-1 rounded font-mono inline-block">
{readingPercentage}% read
</div>
)}
{story.seriesName && (
<div>
{story.seriesName} #{story.volume}