Commit Graph

920 Commits

Author SHA1 Message Date
Gigi
ffafc6f64d chore: bump version to 0.6.1 v0.6.1 2025-10-14 00:20:37 +02:00
Gigi
eadab9a37f fix(highlights): restore scroll-to-highlight functionality with MutationObserver
- Add MutationObserver to detect when highlights are added/removed from DOM
- Use contentVersion state to trigger re-attachment of click handlers
- Add contentVersion dependency to scroll effect so it re-runs after DOM updates
- Add 100ms delay to scroll effect to ensure DOM is fully rendered
- Add warning log when mark element cannot be found
- Fixes issue where clicking highlights in sidebar wouldn't scroll after DOM changes
2025-10-14 00:19:45 +02:00
Gigi
13b1692931 fix(highlights): create single continuous highlight element for multi-node selections
- Use DOM Range API to extract and wrap content in a single mark element
- Preserves internal DOM structure (links, formatting) within the highlight
- Eliminates visual breaks between multiple mark elements
- Ensures highlight appears as one continuous selection even across inline elements
2025-10-14 00:18:30 +02:00
Gigi
3a78289fee fix(highlights): make multi-node highlights appear seamless
- Remove border-radius (set to 0) to eliminate rounded corner breaks
- Remove horizontal padding (only 0.1rem vertical for slight breathing room)
- Remove all box-shadows that create visual separation
- Simplify hover states for cleaner appearance
- Highlights spanning multiple DOM nodes now appear as one continuous highlight
2025-10-14 00:16:37 +02:00
Gigi
12c70b06de fix(highlights): improve text matching to handle multi-node selections
- Add tryMultiNodeMatch function to find text spanning multiple DOM nodes
- Build combined text from all text nodes for comprehensive matching
- Handle highlighting across node boundaries with proper offsets
- Falls back to multi-node matching when single-node match fails
- Fixes issue where selections with inline formatting couldn't be matched
2025-10-14 00:05:43 +02:00
Gigi
c7c82954ad feat(highlights): force synchronous render for immediate highlight display
- Use flushSync to force React to render synchronously after highlight creation
- Eliminates render cycle delay for instant visual feedback
- Highlights now appear immediately in the text when created
2025-10-14 00:03:56 +02:00
Gigi
3b639e2783 feat(highlights): clear browser selection immediately after creating highlight
- Add window.getSelection().removeAllRanges() after highlight creation
- Ensures DOM can update immediately without selection interference
- Improves perceived responsiveness of highlight creation
2025-10-14 00:03:19 +02:00
Gigi
946584236d fix(mobile): prevent horizontal overflow from code blocks and wide content
- Add mobile-specific styles for pre/code elements with word-wrap
- Use pre-wrap for code blocks to wrap long lines on mobile
- Add max-width and overflow-x constraints to main pane container
- Add overflow-x: hidden to body to prevent horizontal scrolling
- Handle tables and images with max-width: 100% on mobile
- Ensure all content respects viewport width on mobile devices
2025-10-13 23:58:39 +02:00
Gigi
aadbf2084f fix(mobile): hide sidebar/highlights toggle buttons on settings, explore, and me pages
- Only show mobile floating buttons when viewing article content
- Hide buttons on settings/explore/me views to avoid UI clutter
- Update conditional rendering logic in ThreePaneLayout
2025-10-13 23:57:06 +02:00
Gigi
3d7b649cba fix(ui): prevent long relay URLs from causing horizontal overflow on mobile
- Add relay-url className to relay URL elements
- Override inline nowrap styles on mobile with word-break: break-all
- Allow relay URLs to wrap across multiple lines on mobile
- Prevent horizontal overflow from long relay names like proxy URLs
2025-10-13 23:55:35 +02:00
Gigi
caa07012a7 fix(ui): make settings view mobile-friendly
- Add max-width: 100% and overflow handling to preview content
- Add word-break and overflow-wrap to prevent text overflow
- Make inline settings stack vertically on mobile
- Reduce padding on mobile for settings view
- Make zap preset buttons flex to fit mobile width
- Ensure all setting controls respect viewport width
- Fix preview heading size on mobile
2025-10-13 23:53:43 +02:00
Gigi
ad5cd875de feat(ui): improve zap splits settings styling
- Add styled preset buttons (Default, Generous, Selfless, Boris)
- Make sliders 100% width with full-width container
- Style active preset button with indigo-500
- Add hover effects to preset buttons and slider thumbs
- Improve slider thumb appearance with rounded design
- Style description box with proper background and borders
- Use Tailwind colors throughout (zinc, indigo)
2025-10-13 23:50:00 +02:00
Gigi
0a4bc2cfbb fix(ui): show filename for videos instead of 'Error Loading Content'
- Add getFilenameFromUrl helper to extract filename from URL
- Use filename as title when content loading fails (e.g., for video files)
- Decode URI component to handle special characters in filenames
- Improves UX for video and media file viewing
2025-10-13 23:48:11 +02:00
Gigi
605dd41939 fix(ui): render AddBookmarkModal using portal to fix z-index stacking
Use React createPortal to render modal directly to document.body, bypassing the sidebar's stacking context (z-index: 1) which was preventing the modal from appearing above other elements
2025-10-13 23:46:50 +02:00
Gigi
8679ae7a37 feat(ui): increase horizontal padding for reader text content on desktop
Add 2rem left and right padding to reader-html and reader-markdown on desktop (min-width: 769px) for better text spacing from edges
2025-10-13 23:43:28 +02:00
Gigi
3c1e4312c9 feat(me): add Writings tab to display user's published articles
- Add 'writings' tab type to Me component
- Fetch articles written by logged-in user using fetchBlogPostsFromAuthors
- Display writings in same grid style as archive tab
- Add pen-to-square icon for writings tab
- Add /me/writings route
- Update Bookmarks component to handle writings tab routing
- Show article count in tab badge
- Empty state message for users with no published articles
2025-10-13 23:42:26 +02:00
Gigi
53ed6849af feat(ui): add vertical padding to blockquotes
Add 1rem top and bottom padding to blockquotes for better spacing and visual separation
2025-10-13 23:38:14 +02:00
Gigi
4b95e6c262 feat(ui): add comprehensive list styling for articles
- Add proper ul/ol styling with disc and decimal markers
- Add 2rem left padding for list indentation
- Add proper spacing between list items (0.375rem)
- Style nested lists with circle (ul) and lower-alpha (ol)
- Reduce margins for nested lists
- Handle paragraphs within list items with reduced margins
- Use zinc-200 color for list items
- Support both markdown and HTML content
2025-10-13 23:37:32 +02:00
Gigi
40ab215c4d refactor(ui): simplify blockquote styling to minimal indent and italic
- Remove colored left border
- Remove background color
- Remove border radius and padding
- Keep only 2rem left padding for indentation
- Keep italic style for differentiation
- Cleaner, more minimal appearance
2025-10-13 23:36:28 +02:00
Gigi
823927525f feat(ui): add comprehensive headline styling with Tailwind typography
- Add proper h1-h6 styling for both markdown and HTML content
- Use Tailwind font sizes: h1 (text-4xl), h2 (text-3xl), h3 (text-2xl), h4 (text-xl), h5 (text-lg), h6 (text-base)
- Apply appropriate font weights: h1 (700), h2-h6 (600)
- Use zinc-100 for h1-h3, zinc-200 for h4-h6 for proper hierarchy
- Add proper top and bottom margins for better spacing
- Set line heights for optimal readability
2025-10-13 23:35:38 +02:00
Gigi
6277824b32 feat(ui): add blockquote styling with Tailwind colors
- Add blockquote styles for both markdown and HTML content
- Use indigo-500 left border for visual distinction
- Use zinc-800 background for subtle emphasis
- Add proper spacing and rounded corners
- Apply zinc-300 color and italic style for readability
- Properly handle nested paragraph margins
2025-10-13 23:34:30 +02:00
Gigi
f94e4ba900 feat(ui): make article titles larger and show summaries
- Increase title font size to 2.5rem (desktop) and 2rem (mobile)
- Add font-weight: 700 and better line-height to titles
- Increase summary font size to 1.2rem with better line-height
- Fix missing summary display by passing summary prop to ReaderHeader
- Improve readability and visual hierarchy of article headers
2025-10-13 23:33:23 +02:00
Gigi
acf14ccee9 feat(ui): add 100vh height and drop-shadows to sidebars
- Set sidebars to always have 100vh height on desktop
- Add drop-shadow to left sidebar (2px right shadow)
- Add drop-shadow to right highlights panel (2px left shadow)
- Improves visual separation and depth perception
2025-10-13 23:28:00 +02:00
Gigi
f882b63359 fix(ui): remove padding gaps around sidebars
Remove md:p-4 padding from root container to eliminate gaps between screen edges and sidebars
2025-10-13 23:26:25 +02:00
Gigi
7b1e3be39b fix(api): resolve TypeScript errors in video-meta.ts
- Remove non-existent getVideoDetails import from youtube-caption-extractor
- Add Subtitle type definition for proper type conversion
- Remove invalid 'auto' parameter from getSubtitles call
- Convert Subtitle[] to Caption[] with proper type casting
- Simplify title/description extraction for YouTube metadata
2025-10-13 23:23:52 +02:00
Gigi
ee17018076 docs: add comprehensive color system documentation 2025-10-13 23:19:57 +02:00
Gigi
1dd2e1dc38 refactor: switch to brighter yellow-300 for highlight defaults and add semantic color aliases 2025-10-13 23:19:33 +02:00
Gigi
4cd1aa89ad chore: remove migration plan file 2025-10-13 23:18:26 +02:00
Gigi
e667cf05c2 refactor: update default highlight color to yellow-400 in useSettings 2025-10-13 23:18:13 +02:00
Gigi
7512375728 refactor: update default highlight color to yellow-400 in ThreePaneLayout 2025-10-13 23:17:46 +02:00
Gigi
f108e2e70a refactor: replace arbitrary color values with Tailwind utilities in ThreePaneLayout 2025-10-13 23:17:21 +02:00
Gigi
daa43ec4c4 refactor: migrate global.css to Tailwind color palette 2025-10-13 23:16:51 +02:00
Gigi
ab2223e739 refactor: migrate app.css to Tailwind color palette 2025-10-13 23:16:28 +02:00
Gigi
e8cbb3af4b refactor: migrate legacy.css to Tailwind color palette 2025-10-13 23:16:06 +02:00
Gigi
f374a9af28 refactor: migrate settings.css to Tailwind color palette 2025-10-13 23:15:40 +02:00
Gigi
f2cbc66a97 refactor: migrate profile.css to Tailwind color palette 2025-10-13 23:15:21 +02:00
Gigi
1627d4f53e refactor: migrate me.css to Tailwind color palette 2025-10-13 23:14:56 +02:00
Gigi
b93a4d072a refactor: migrate reader.css to Tailwind color palette 2025-10-13 23:14:02 +02:00
Gigi
3e4bc97684 refactor: migrate toast.css to Tailwind color palette 2025-10-13 23:12:48 +02:00
Gigi
3c0c20f61c refactor: migrate modals.css to Tailwind color palette 2025-10-13 23:12:26 +02:00
Gigi
dae63e210b refactor: migrate forms.css to Tailwind color palette 2025-10-13 23:11:42 +02:00
Gigi
dc500cc296 refactor: migrate cards.css to Tailwind color palette 2025-10-13 23:11:03 +02:00
Gigi
1fc1e4f102 refactor: migrate icon-button.css to Tailwind color palette 2025-10-13 23:08:31 +02:00
Gigi
524b5e1559 refactor: migrate sidebar.css to Tailwind color palette 2025-10-13 23:07:53 +02:00
Gigi
930de76d1f refactor: migrate highlights.css to Tailwind color palette 2025-10-13 23:06:09 +02:00
Gigi
b85fc820d1 refactor: setup Tailwind color foundation with semantic aliases and updated defaults 2025-10-13 23:03:07 +02:00
Gigi
b145aee29d docs: add comprehensive Tailwind color migration plan 2025-10-13 22:54:22 +02:00
Gigi
a0e65a48f1 refactor: clean up legacy.css removing unused debugging styles 2025-10-13 22:51:49 +02:00
Gigi
ccdfc54cdc style: increase spacing between highlight card header/footer and content 2025-10-13 22:49:37 +02:00
Gigi
61ce338b8c fix: show reading progress indicator on mobile at full width 2025-10-13 22:48:39 +02:00