Skip to content

Latest commit

 

History

History
37 lines (27 loc) · 2.73 KB

README.md

File metadata and controls

37 lines (27 loc) · 2.73 KB

designr logo

designr inspects CSS styles and saves snapshots of web components and designs

Chrome Web Store


🎨   Functionality  

designr is an open-source browser extension designed to inspect and save CSS styling on web pages. designr provides information about element styles and save the styles into a palette for later use. designr is a simple and intuitive way for designers and web developers to save CSS references.


🛠   Setup  

To get started with development, fork or clone the repository. Once the repository is installed, go to the extensions page in your brower. For example, the extension manager page for Chrome is chrome://extensions which will let you edit and upload the extension package. On the extension manager page, toggle Developer Mode on, click Load unpacked, and select the folder of the downloaded extension.


⚙️   Code Structure  

The code for designr adheres to the following structure:

assets/ includes all assets for the extension
css/designr.css CSS file for the designr element inspector view
css/styles.css CSS file for the designr popup view
js/libs contains all JS code for libraries
js/background.js background JS code for designr
js/designr.js JS code for the designr element inspector view
js/script.js JS code for the designr popup view
index.html HTML code for the designr popup view

💜   Contributing  

If you would like to contibute new features, bug fixes, or have any recommendations on how the extension can be improved, feel free to contribute by forking this repository, contributing a change that either resolve an issue or adds a new feature, and submitting a PR for review.