Duncan Lock
8718ba3664
Fixed the responsive styles so they work properly with small, as well as large images
|
11 gadi atpakaļ | |
|---|---|---|
| .. | ||
| test_data | 12 gadi atpakaļ | |
| __init__.py | 12 gadi atpakaļ | |
| better_figures_and_images.py | 11 gadi atpakaļ | |
| readme.rst | 12 gadi atpakaļ | |
readme.rst
Summary
===========
This plug-in:
- Adds a `style="width: ???px;"` attribute to any `` tags in the content, by checking
the dimensions of the image file and adding the appropriate `style="width: ???px; height: auto;"` to the `` tag.
- Also finds any `div class="figures"` tags in the content, that contain images and adds the same style to them too.
- If RESPONSIVE_IMAGES setting is true, it adds `style="max-width: 100%; height: auto;"` instead.
- Corrects Alt text: If an img alt attribute = the image filename, it sets it to ""
Assuming that the image is 250px wide, it turns output like this:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
into output like this:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
or this, if RESPONSIVE_IMAGES = True:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
===========
This plug-in:
- Adds a `style="width: ???px;"` attribute to any `` tags in the content, by checking
the dimensions of the image file and adding the appropriate `style="width: ???px; height: auto;"` to the `` tag.
- Also finds any `div class="figures"` tags in the content, that contain images and adds the same style to them too.
- If RESPONSIVE_IMAGES setting is true, it adds `style="max-width: 100%; height: auto;"` instead.
- Corrects Alt text: If an img alt attribute = the image filename, it sets it to ""
Assuming that the image is 250px wide, it turns output like this:
This is the caption of the figure.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
into output like this:
This is the caption of the figure.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
or this, if RESPONSIVE_IMAGES = True:
This is the caption of the figure.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.