Environment Banner Marker

WHAT IT DOES

Environment Banner Marker is a floating panel that allows you to set an environment label for the current website and display a persistent colored banner at the top of the page. Choose from predefined environments — Production (red), Staging (yellow), Development (blue), Testing (purple) — or create a custom label with your own color. The banner stays visible as you navigate the site, helping you instantly recognize which environment you're working in. This is especially useful for developers, QA testers, and operations teams who work across multiple deployment environments and need to avoid accidentally performing actions in the wrong environment.

WHERE IT RUNS

This script runs on any website you visit. It reads only the page you are looking at, never other tabs, bookmarks, or browser data. All data stays in your browser — nothing is sent anywhere.

HOW TO USE

Click the Environment Banner Marker panel button in the BotGentz extension toolbar. The panel appears at the edge of the page. Select an environment from the dropdown — Production, Staging, Development, Testing, or Custom. If you choose Custom, enter a label and select a color. Click "Apply Banner" to add the banner to the current page. The banner appears at the top of the page with the environment name and a close button. Use "Remove Banner" to hide it, or "Show Banner" to re-display a dismissed banner. The banner persists across page reloads until you remove it.

TECHNICAL MECHANISM

The tool stores the environment label and color settings using GM_setValue and restores them with GM_getValue. When a banner is applied, the tool creates a fixed-position div at the top of the page with a z-index of 999999, ensuring it overlays all page content. The banner's background color is set via CSS classes for predefined environments or inline styles for custom colors. A close button allows the user to dismiss the banner, which sets a flag in storage to prevent it from reappearing until the user clicks "Show Banner." The banner persists across page loads by checking the stored settings and re-creating the banner on each new page. The tool also adds a margin-top to the body to prevent page content from being hidden behind the banner. All operations run client-side in pure JavaScript.

THE PANEL

The panel is a floating overlay that you can drag anywhere on the screen by its header. It remembers its position per site so it reappears where you left it. The panel can be collapsed into a small handle to get it out of the way, and snapped to the edge of the page. It can be resized to fit your workflow. Press Escape to close the panel.

PLEASE NOTE

This script requires the free BotGentz extension to run. All data stays in your browser — nothing is transmitted or shared. The panel works on any website. The banner persists across pages until you remove it or dismiss it. The banner is a visual indicator only and does not affect the functionality of the website. Custom colors are applied using inline styles. The tool is for personal use — it does not sync settings across devices. Sites change — the script may need updates to match new site structures.