Description
Currently, KireiTab's Quick Links are a vital feature for user productivity but are limited to simple text and URLs. To significantly boost the user experience (UX) and visual aesthetic of the New Tab dashboard, we need to upgrade the Quick Links:
- Add support for custom icons to make the dashboard visually engaging.
- Enable drag-and-drop reordering on the Options Page for easy personalization.
This high-impact enhancement will transform the Quick Links from a basic list into a professional, personalized, and user-friendly dashboard element, making the extension much more attractive.
Tasks (Implementation Plan)
1. Quick Link Icon Support
- Options Page (
options.html / options.js):
- Add a new optional input field (or a simple emoji picker/selector) in the "Add Link" form for the user to specify an icon (e.g., an emoji, a custom icon class, or a simple Font Awesome class).
- The link object saved in
chrome.storage.local must be updated to include a new property, e.g., icon.
- New Tab Display (
newtab.js / newtab.html):
- Update the link rendering logic to display the chosen Icon prominently on the main new tab screen.
- Fallback Logic: If the user does not provide an icon, the system should default to using the first letter of the link name (as it may currently do) or a generic link emoji (🔗).
2. Drag-and-Drop Reordering
- Options Page Reordering:
- Implement Drag-and-Drop functionality within the Quick Links list (
#linksList in options.html). This can be done using a lightweight library or the native HTML Drag and Drop API.
- The user must be able to visually reorder the links by dragging them up or down.
- Storage Update:
- After the drag operation is complete, the new order of the
quickLinks array must be immediately saved back to chrome.storage.local.
- Visual Feedback:
- Ensure the drag operation provides clear visual feedback (e.g., a subtle shadow on the dragged item and a space for where it will drop) for a smooth UX.
This is a great feature that will greatly enhance KireiTab's visual appeal and usability!
Description
Currently, KireiTab's Quick Links are a vital feature for user productivity but are limited to simple text and URLs. To significantly boost the user experience (UX) and visual aesthetic of the New Tab dashboard, we need to upgrade the Quick Links:
This high-impact enhancement will transform the Quick Links from a basic list into a professional, personalized, and user-friendly dashboard element, making the extension much more attractive.
Tasks (Implementation Plan)
1. Quick Link Icon Support
options.html/options.js):chrome.storage.localmust be updated to include a new property, e.g.,icon.newtab.js/newtab.html):2. Drag-and-Drop Reordering
#linksListinoptions.html). This can be done using a lightweight library or the native HTML Drag and Drop API.quickLinksarray must be immediately saved back tochrome.storage.local.This is a great feature that will greatly enhance KireiTab's visual appeal and usability!