This browser extension is designed to display the current window size and corresponding Material-UI breakpoint in real-time. It's a useful tool for developers and designers who want to quickly see how their website or application responds to different viewport sizes and breakpoints. The extension automatically detects the window's width and updates the display with the current size in pixels and the associated Material-UI breakpoint (xs, sm, md, lg, xl).
- Displays the current window width in pixels and the corresponding Material-UI breakpoint (xs, sm, md, lg, xl).
- Updates the display in real-time as the browser window is resized.
- Provides a clear and unobtrusive view at the bottom right corner of the browser window.
To install the extension:
- Clone or download the extension repository to your local machine.
- Open your browser and navigate to the extensions page (e.g.,
chrome://extensionsfor Chrome). - Enable Developer Mode.
- Click on "Load unpacked" and select the extension directory where the
manifest.jsonfile is located. - The extension should now be installed and visible in your browser.
Once installed, the extension will automatically display the current window size and Material-UI breakpoint at the bottom right corner of your browser window. You can see the display update in real-time as you resize your browser window.
Contributions are welcome! If you have suggestions for improvements or encounter any issues, please feel free to submit an issue or pull request on the repository.
Specify the license under which the extension is released, ensuring users are aware of their rights and any restrictions when using or modifying the extension.