https://github.com/pseudomuto/chrome-breakview
A breakpoint viewer for Chrome
https://github.com/pseudomuto/chrome-breakview
Last synced: 10 months ago
JSON representation
A breakpoint viewer for Chrome
- Host: GitHub
- URL: https://github.com/pseudomuto/chrome-breakview
- Owner: pseudomuto
- Created: 2013-06-17T16:56:41.000Z (almost 13 years ago)
- Default Branch: master
- Last Pushed: 2013-06-18T00:38:46.000Z (almost 13 years ago)
- Last Synced: 2025-03-25T16:53:33.341Z (about 1 year ago)
- Language: CoffeeScript
- Size: 145 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# chrome-breakview
A breakpoint viewer for Chrome. Quickly resize to one of your defined breakpoints for testing your responsive web site.
## Usage
The is a Page Action extension (icon will be in the address bar). The icon will only show up, if your page has an element with id "chrome-breakpoints" defined that has children for each of your defined breakpoints. For example:
When you select the page action, you will be presented with a popup that lets you select which breakpoint you would like to resize to. Selecting a breakpoint will resize the browser window and refresh the page.
__*I realize that rendering DOM elements for breakpoints is less that ideal. This will be addressed in the near future.*__
## Contributors
You will need node.js and coffeescript to contribute to this project. There is a Cakefile with build and watch tasks which generate the extension file in `./build` (ignored by `.gitignore`). You can then add this folder to Chrome's extensions (in Developer mode) for testing.
For testing purposes, there is a sample_page.html file in the root directory which will trigger the extension.
With that, fork away...looking forward to pull requests!