diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json index 307e50eb0..4ebe9338a 100644 --- a/apps/client/src/translations/en/translation.json +++ b/apps/client/src/translations/en/translation.json @@ -2214,7 +2214,6 @@ "save_status_saving": "Saving...", "save_status_unsaved": "Unsaved", "save_status_error": "Save failed", - "save_status_saved_tooltip": "All changes have been saved.", "save_status_saving_tooltip": "Changes are being saved.", "save_status_unsaved_tooltip": "There are unsaved changes. They will be saved automatically in a moment.", "save_status_error_tooltip": "An error occurred while saving the note. If possible, try copying the note content elsewhere and reloading the application." diff --git a/apps/client/src/widgets/layout/NoteBadges.css b/apps/client/src/widgets/layout/NoteBadges.css index 1e5f13ab5..e745edf2f 100644 --- a/apps/client/src/widgets/layout/NoteBadges.css +++ b/apps/client/src/widgets/layout/NoteBadges.css @@ -2,6 +2,11 @@ contain: none; } +@keyframes fadeOut { + from { opacity: var(--default-opacity); } + to { opacity: 0; } +} + .note-badges { display: flex; gap: 5px; @@ -17,13 +22,19 @@ &.clipped-note-badge {--color: var(--badge-clipped-note-background-color);} &.execute-badge {--color: var(--badge-execute-background-color);} &.save-status-badge { - opacity: 0.4; + --default-opacity: 0.4; + opacity: var(--default-opacity); transition: opacity 250ms ease-in; &.error { color: var(--dropdown-item-icon-destructive-color); opacity: 1; } + + &.saved { + animation: fadeOut 250ms ease-in 5s forwards; + pointer-events: none; + } } min-width: 0; diff --git a/apps/client/src/widgets/layout/NoteBadges.tsx b/apps/client/src/widgets/layout/NoteBadges.tsx index bdb334684..c3da77d4a 100644 --- a/apps/client/src/widgets/layout/NoteBadges.tsx +++ b/apps/client/src/widgets/layout/NoteBadges.tsx @@ -120,7 +120,6 @@ function SaveStatusBadge() { case "saved": icon = "bx bx-check"; title = t("breadcrumb_badges.save_status_saved"); - tooltip = t("breadcrumb_badges.save_status_saved_tooltip"); break; case "saving": icon = "bx bx-loader bx-spin";