html-img package

Fill image size automatically.

• Supports HTML, Jade, EJS, ECO, ERB and PHP
• Supports png, jpg and gif
• Supports absolute url: Like /images/sample.png (requires document_root property in project.json)
• Supports relative url: Like images/smaple.png
• Supports protocol-absolute url: Like http://example.com/images/sample.png
• Supports protocol-relative url: Like //example.com/images/sample.png (requires protocol property in project.json)
• Fills only width, height or both
• Fills as full or half size
• Overwrites wrong size

Changelog

Keymap

• ctrl-i or ctrl-i enter: Fill width and height
• ctrl-i /: Fill width and height as half
• ctrl-alt-i or ctrl-alt-i enter: Fill width
• ctrl-alt-i /: Fill width as half
• ctrl-shift-i or ctrl-shift-i enter: Fill height
• ctrl-shift-i /: Fill height as half

Override keymap with Atom > Open Your Keymap.

Configuration

When you specify src absolute or protocol-relative url, you can create project.json at the project root.

project.json

• document_root: Used for resolving absolute url. Default is ''.
• protocol: Used for resolving protocol-relative url. Default is 'http'.

Example

.
├──public          # Document root
│   └──index.html  # Files
└──project.json    # Configuration for html-img

{
  "document_root": "public",
  "protocol": "https"
}

TODO

• Support Haml and Slim