feat(dashboard): replace emojis with Font Awesome, add theme support, and styled dialogs
This commit implements three major improvements to the dashboard system: 1. **Font Awesome Icons for Tabs** - Replace emoji tab icons (📊, 🌍, 🎒) with Font Awesome classes - Update defaultLayout.js with fa-solid icon classes - Add automatic migration for existing saved dashboards with emoji icons - Implement migrateEmojiIcons() to convert old emoji icons on load - Update fallback icons throughout the system 2. **Custom Theme Support for Dashboard** - Replace all --SmartTheme* variables with --rpg-* variables - Ensure custom themes (sci-fi, fantasy, cyberpunk) apply to dashboard - Update CSS for tabs, buttons, dropdowns, modals, and widget cards - Dashboard now respects extension themes instead of main SillyTavern theme 3. **Styled Confirmation Dialogs** - Create confirmDialog.js with showConfirmDialog() and showAlertDialog() - Support three variants: danger (red), warning (yellow), info (blue) - Add keyboard navigation (Enter/Escape) and accessibility features - Replace all native confirm() and alert() calls with styled dialogs - Add confirmation dialog modal to dashboardTemplate.html Files Modified: - src/systems/dashboard/confirmDialog.js (NEW) - src/systems/dashboard/dashboardManager.js - src/systems/dashboard/defaultLayout.js - src/systems/dashboard/tabManager.js - src/systems/dashboard/dashboardIntegration.js - src/systems/dashboard/editModeManager.js - src/systems/dashboard/widgets/inventoryWidget.js - src/systems/dashboard/dashboardTemplate.html - style.css
This commit is contained in:
@@ -5,6 +5,8 @@
|
||||
* Handles edit controls, widget library, and layout modifications.
|
||||
*/
|
||||
|
||||
import { showConfirmDialog } from './confirmDialog.js';
|
||||
|
||||
/**
|
||||
* @typedef {Object} EditModeConfig
|
||||
* @property {HTMLElement} container - Dashboard container element
|
||||
@@ -453,9 +455,16 @@ export class EditModeManager {
|
||||
* Show confirmation dialog before canceling
|
||||
* @param {Function} onConfirm - Callback if confirmed
|
||||
*/
|
||||
confirmCancel(onConfirm) {
|
||||
const message = 'You have unsaved changes. Are you sure you want to cancel?';
|
||||
if (confirm(message)) {
|
||||
async confirmCancel(onConfirm) {
|
||||
const confirmed = await showConfirmDialog({
|
||||
title: 'Discard Changes?',
|
||||
message: 'You have unsaved changes. Are you sure you want to discard them?',
|
||||
variant: 'warning',
|
||||
confirmText: 'Discard',
|
||||
cancelText: 'Keep Editing'
|
||||
});
|
||||
|
||||
if (confirmed) {
|
||||
onConfirm();
|
||||
}
|
||||
}
|
||||
@@ -464,9 +473,16 @@ export class EditModeManager {
|
||||
* Show confirmation dialog before deleting widget
|
||||
* @param {string} widgetId - Widget ID to delete
|
||||
*/
|
||||
confirmDeleteWidget(widgetId) {
|
||||
const message = 'Are you sure you want to delete this widget?';
|
||||
if (confirm(message)) {
|
||||
async confirmDeleteWidget(widgetId) {
|
||||
const confirmed = await showConfirmDialog({
|
||||
title: 'Delete Widget?',
|
||||
message: 'Are you sure you want to delete this widget? This action cannot be undone.',
|
||||
variant: 'danger',
|
||||
confirmText: 'Delete',
|
||||
cancelText: 'Cancel'
|
||||
});
|
||||
|
||||
if (confirmed) {
|
||||
if (this.onWidgetDelete) {
|
||||
this.onWidgetDelete(widgetId);
|
||||
}
|
||||
@@ -477,9 +493,16 @@ export class EditModeManager {
|
||||
* Show confirmation dialog before resetting layout
|
||||
* @param {Function} onConfirm - Callback if confirmed
|
||||
*/
|
||||
confirmReset(onConfirm) {
|
||||
const message = 'This will reset the layout to default. Are you sure?';
|
||||
if (confirm(message)) {
|
||||
async confirmReset(onConfirm) {
|
||||
const confirmed = await showConfirmDialog({
|
||||
title: 'Reset Layout?',
|
||||
message: 'This will reset the layout to default. All widgets will be removed and the default layout will be restored.',
|
||||
variant: 'danger',
|
||||
confirmText: 'Reset',
|
||||
cancelText: 'Cancel'
|
||||
});
|
||||
|
||||
if (confirmed) {
|
||||
onConfirm();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user