feat: enhance UI components and error handling
- Updated HTML structure for navigation buttons in the calendar, adding SVG icons for improved visual clarity. - Introduced a new muted text style in CSS for better presentation of empty duty list messages. - Enhanced calendar CSS for navigation buttons and day indicators, improving layout and responsiveness. - Improved error handling in the UI by adding retry functionality to the error display, allowing users to retry actions directly from the error message. - Updated internationalization messages to include a retry option for error handling. - Added unit tests to verify the new error handling behavior and UI updates.
This commit is contained in:
@@ -339,10 +339,14 @@ function ensurePanelInDom() {
|
||||
panelEl.hidden = true;
|
||||
|
||||
const closeLabel = t(state.lang, "day_detail.close");
|
||||
const closeIcon =
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>';
|
||||
panelEl.innerHTML =
|
||||
'<button type="button" class="day-detail-close" aria-label="' +
|
||||
escapeHtml(closeLabel) +
|
||||
'">×</button><div class="day-detail-body"></div>';
|
||||
'">' +
|
||||
closeIcon +
|
||||
'</button><div class="day-detail-body"></div>';
|
||||
|
||||
const closeBtn = panelEl.querySelector(".day-detail-close");
|
||||
if (closeBtn) {
|
||||
|
||||
Reference in New Issue
Block a user