Hopiu/wagtail
1
0
Fork 0
mirror of https://github.com/Hopiu/wagtail.git synced 2026-05-10 16:24:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added message about particularly large images

Browse source
This commit is contained in:
Dave Cranwell 2014-07-18 13:17:53 +01:00
parent e9ce32433b
commit 055233bbd7
3 changed files with 15 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
wagtail/wagtailadmin/static/wagtailadmin/scss/components/typography.scss
View file

@ -56,9 +56,10 @@ kbd{
/* Help text formatters */
.help-block{
display:inline-block;
float:left;
padding:1em;
margin:1em 0;
clear:both;
p{
margin-top:0;

8
wagtail/wagtailimages/static/wagtailimages/js/image-url-generator.js
View file

@ -10,6 +10,7 @@ $(function() {
var $result = $this.find('#result-url');
var $loadingMask = $this.find('.loading-mask')
var $preview = $this.find('img.preview');
var $sizeNote = $('#note-size')
var generatorUrl = $this.data('generatorUrl');
@ -35,6 +36,13 @@ $(function() {
filterSpec += '-' + $widthField.val() + 'x' + $heightField.val();
}
// Display note about scaled down images if image is large
if($widthField.val() > $(window).width()){
$sizeNote.show();
}else{
$sizeNote.hide();
}
// Fields with width and height
$.getJSON(generatorUrl.replace('__filterspec__', filterSpec))
.done(function(data) {

8
wagtail/wagtailimages/templates/wagtailimages/images/url_generator.html
View file

@ -26,10 +26,12 @@
<textarea id="result-url" rows="1"></textarea>
<h2 class="icon icon-view">{% trans "Preview" %}</h2>
<div class="loading-mask inline-block">
<img class="preview" src="" alt="Preview" />
<div>
<div class="loading-mask inline-block">
<img class="preview" src="" alt="Preview" />
</div>
</div>
<p class="help-block help-info">{% trans "Note that images generated larger than the screen will appear smaller when previewed here, so they fit the screen." %}</p>
<p id="note-size" class="help-block help-warning">{% trans "Note that images generated larger than the screen will appear smaller when previewed here, so they fit the screen." %}</p>
</div>
{% endblock %}