?
avatar htmgarcia
htmgarcia
12 Dec 2016

Steps to reproduce the issue

Make sure Protostar is your default template, and loads modal library.

You can do this by adding a line of code to templates/protostar/index.php (or to a duplicated template based on protostar):
JHtml::_('behavior.modal');
screen shot 2016-12-12 at 2 56 41 pm

In a module or an article insert a link pointing to a big image (ideally wider than high) and with modal class:
<a class="modal" href="path/to/image.jpg">Modal link</a>

Expected result

In mobile devices, when you click the link to open the image, it should load fine keeping the aspect ratio.

Actual result

The image loads with 100% height and width, losing the proportions (the image is stretched):
screen shot 2016-12-12 at 3 02 41 pm

System information (as much as possible)

Firefox 50.0.2
MacOS Sierra

Additional comments

avatar htmgarcia htmgarcia - open - 12 Dec 2016
avatar joomla-cms-bot joomla-cms-bot - change - 12 Dec 2016
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - labeled - 12 Dec 2016
avatar htmgarcia htmgarcia - change - 12 Dec 2016
The description was changed
avatar htmgarcia htmgarcia - edited - 12 Dec 2016
avatar htmgarcia htmgarcia - edited - 12 Dec 2016
avatar htmgarcia htmgarcia - change - 12 Dec 2016
The description was changed
avatar htmgarcia htmgarcia - edited - 12 Dec 2016
avatar htmgarcia
htmgarcia - comment - 12 Dec 2016

This seems to be the code involved: https://github.com/joomla/joomla-cms/blob/staging/media/system/css/modal.css#L74

Changing to height: auto; may partially solve the issue.

avatar C-Lodder
C-Lodder - comment - 13 Dec 2016

I don't see why this should be fixed personally. JHtml::_('behavior.modal'); is deprecated.

Instead, you should use JHtml::_('bootstrap.renderModal');

avatar htmgarcia
htmgarcia - comment - 13 Dec 2016

@C-Lodder thanks for the clarification!

avatar franz-wohlkoenig
franz-wohlkoenig - comment - 1 Feb 2017

@htmgarcia is this Issue resolved?

avatar htmgarcia
htmgarcia - comment - 2 Feb 2017

@franz-wohlkoenig please see @C-Lodder reply.
Regards

avatar htmgarcia htmgarcia - change - 2 Feb 2017
Status New Closed
Closed_Date 0000-00-00 00:00:00 2017-02-02 23:13:54
Closed_By htmgarcia
avatar htmgarcia htmgarcia - close - 2 Feb 2017

Add a Comment

Login with GitHub to post a comment