Clarify language for Verbose Logging setting (#9237)

2 files changed, 11 insertions, 1 deletions

diff --git a/packages/astro/src/runtime/client/dev-overlay/plugins/settings.ts b/packages/astro/src/runtime/client/dev-overlay/plugins/settings.ts
index 15d18d161..b0a262dfa 100644
--- a/packages/astro/src/runtime/client/dev-overlay/plugins/settings.ts
+++ b/packages/astro/src/runtime/client/dev-overlay/plugins/settings.ts
@@ -25,17 +25,21 @@ const settingsRows = [
 				}
 
 				settings.updateSetting('disablePluginNotification', evt.currentTarget.checked);
+				const action = evt.currentTarget.checked ? 'enabled' : 'disabled';
+				settings.log(`Plugin notification badges ${action}`);
 			}
 		},
 	},
 	{
 		name: 'Verbose logging',
-		description: 'Log additional information to the console.',
+		description: 'Logs dev overlay events in the browser console.',
 		input: 'checkbox',
 		settingKey: 'verbose',
 		changeEvent: (evt: Event) => {
 			if (evt.currentTarget instanceof HTMLInputElement) {
 				settings.updateSetting('verbose', evt.currentTarget.checked);
+				const action = evt.currentTarget.checked ? 'enabled' : 'disabled';
+				settings.log(`Verbose logging ${action}`);
 			}
 		},
 	},
diff --git a/packages/astro/src/runtime/client/dev-overlay/settings.ts b/packages/astro/src/runtime/client/dev-overlay/settings.ts
index 7ba12f2db..c67f3e978 100644
--- a/packages/astro/src/runtime/client/dev-overlay/settings.ts
+++ b/packages/astro/src/runtime/client/dev-overlay/settings.ts
@@ -23,10 +23,16 @@ function getSettings() {
 		localStorage.setItem('astro:dev-overlay:settings', JSON.stringify(_settings));
 	}
 
+	function log(message: string) {
+		// eslint-disable-next-line no-console
+		console.log(`%cAstro`, 'background: linear-gradient(66.77deg, #D83333 0%, #F041FF 100%); color: white; padding-inline: 4px; border-radius: 2px; font-family: monospace;', message);
+	}
+
 	return {
 		get config() {
 			return _settings;
 		},
 		updateSetting,
+		log
 	};
 }