aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2025-12-18 23:24:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: ensure reading progress bar shows for all bookmark types across all view modes

Browse Source 
- Update CompactView to always show progress bar for all bookmark types
- Update LargeView to always show progress bar for all bookmark types
- Remove conditional logic that only showed progress for articles
- Ensure consistent visual separator across CardView, CompactView, and LargeView
- Maintain empty state display (1px border line) when no progress available
This commit is contained in:
Gigi
2025-10-25 01:48:42 +02:00
parent 1df00fbfda
commit 13462efaed
2 changed files with 35 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/BookmarkViews/CompactView.tsx
View File

@@ -86,8 +86,7 @@ export const CompactView: React.FC<CompactViewProps> = ({
{/* CTA removed */} {/* CTA removed */}
</div> </div>
{/* Reading progress indicator for all bookmark types with reading data */} {/* Reading progress indicator for all bookmark types - always shown */}
{readingProgress !== undefined && readingProgress > 0 && (
<div <div
style={{ style={{
height: '1px', height: '1px',
@@ -101,13 +100,12 @@ export const CompactView: React.FC<CompactViewProps> = ({
<div <div
style={{ style={{
height: '100%', height: '100%',
width: `${Math.round(readingProgress * 100)}%`, width: readingProgress ? `${Math.round(readingProgress * 100)}%` : '0%',
background: progressColor, background: readingProgress ? progressColor : 'var(--color-border)',
transition: 'width 0.3s ease, background 0.3s ease' transition: 'width 0.3s ease, background 0.3s ease'
}} }}
/> />
</div> </div>
)}
</div> </div>
) )
} }

8
src/components/BookmarkViews/LargeView.tsx
View File

@@ -122,8 +122,7 @@ export const LargeView: React.FC<LargeViewProps> = ({
<RichContent content={bookmark.content} className="large-text" /> <RichContent content={bookmark.content} className="large-text" />
)} )}
{/* Reading progress indicator for articles - shown only if there's progress */} {/* Reading progress indicator for all bookmark types - always shown */}
{isArticle && readingProgress !== undefined && readingProgress > 0 && (
<div <div
style={{ style={{
height: '3px', height: '3px',
@@ -136,13 +135,12 @@ export const LargeView: React.FC<LargeViewProps> = ({
<div <div
style={{ style={{
height: '100%', height: '100%',
width: `${progressPercent}%`, width: readingProgress ? `${progressPercent}%` : '0%',
background: progressColor, background: readingProgress ? progressColor : 'var(--color-border)',
transition: 'width 0.3s ease, background 0.3s ease' transition: 'width 0.3s ease, background 0.3s ease'
}} }}
/> />
</div> </div>
)}
<div className="large-footer"> <div className="large-footer">
<span className="bookmark-type-large"> <span className="bookmark-type-large">