Skip to content

Chrome extension that allows easy extraction of CSS and HTML from selected element.

Notifications You must be signed in to change notification settings

kdzwinel/SnappySnippet

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

61 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SnappySnippet

Chrome/Chromium extension that allows easy CSS+HTML extraction of specific DOM element. Created snippet can be then exported to CodePen, jsFiddle or JS Bin with one click.

Other features:

  • cleans up HTML (removing unnecessary attributes, fixing indentation)
  • optimizes CSS to make it readable
  • fully configurable (all filters can be turned off)
  • nice UI thanks to Bootstrap & Flat-UI projects
  • works with :before and :after pseudo elements

Screenshot

Installation

Download the extension and manually load it as an 'Unpacked extension' via the extensions page.

Usage

Open Developer Tools, you should see the new SnappySnippet tab. Inspect an element on the page and switch to the new tab, you will see options for settings and exporting the code for the element you selected.

For more details, see this demonstration video.

Bugs and Features

If you found a bug or have a feature request, please create an issue here on GitHub.

https://github.com/kdzwinel/SnappySnippet/issues

Changelog

0.5

  • #13 IFrames support (by @crdev)
  • #19 Prefixing/namespacing CSS IDs

0.4

  • #8 Extract DOM and CSS up to the root element (by @crdev)
  • #15 Preserve settings (by @crdev)
  • Fix for #7 bug where shorthand property values were sometimes invalid
  • Workarounds for buggy 'content' property

0.3

  • JS Bin support (by @remy)
  • temporary workaround for getComputedStyle bug in border-radius property (issue #4, thanks to @zessx for spotting this)

Special thanks to

Author

Konrad Dzwinel

License

This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.

You should have received a copy of the GNU General Public License along with this program. If not, see http://www.gnu.org/licenses/.

About

Chrome extension that allows easy extraction of CSS and HTML from selected element.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •