From 3e355be2454b2f20eb87aaaada753bee20923d24 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Mon, 24 Oct 2022 11:51:30 -0400
Subject: [PATCH] feat: have save button turn into green checkmark on
 successful save

---
 public/scss/admin/admin.scss | 18 ++++++++++++++++++
 public/src/admin/settings.js |  5 +++++
 2 files changed, 23 insertions(+)

diff --git a/public/scss/admin/admin.scss b/public/scss/admin/admin.scss
index 1e75ead6fe..ff4dce1161 100644
--- a/public/scss/admin/admin.scss
+++ b/public/scss/admin/admin.scss
@@ -270,4 +270,22 @@ form small {
     border-top: 4px dashed;
     border-right: 4px solid transparent;
     border-left: 4px solid transparent;
+}
+
+#save {
+	width: 64px;
+	height: 64px;
+	transition: background-color 250ms linear;
+
+	i {
+		font-size: 1.5em;
+	}
+
+	&.saved {
+		background-color: $success;
+
+		i {
+			@include fa-icon-solid($fa-var-check);
+		}
+	}
 }
\ No newline at end of file
diff --git a/public/src/admin/settings.js b/public/src/admin/settings.js
index 2a52bdf794..65e809b314 100644
--- a/public/src/admin/settings.js
+++ b/public/src/admin/settings.js
@@ -79,6 +79,11 @@ define('admin/settings', ['uploader', 'mousetrap', 'hooks', 'alerts'], function
 
 				app.flags._unsaved = false;
 
+				saveBtn.get(0).classList.toggle('saved', true);
+				setTimeout(() => {
+					saveBtn.get(0).classList.toggle('saved', false);
+				}, 5000);
+
 				alerts.alert({
 					alert_id: 'config_status',
 					timeout: 2500,