Merge pull request #5181 from vinothkannans/image-placeholder-styling
UX: Placeholder images color changed & tootip added
This commit is contained in:
commit
11cc8ff52d
|
@ -423,6 +423,7 @@ a.mention, a.mention-group {
|
|||
}
|
||||
|
||||
.broken-image, .large-image {
|
||||
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%));
|
||||
border: 1px solid $primary-low;
|
||||
font-size: 32px;
|
||||
padding: 16px;
|
||||
|
|
|
@ -110,13 +110,25 @@ module Jobs
|
|||
if broken_images.include?(src)
|
||||
tag.name = 'span'
|
||||
tag.set_attribute('class', 'broken-image fa fa-chain-broken')
|
||||
tag.set_attribute('title', I18n.t('post.image_placeholder.broken'))
|
||||
tag.remove_attribute('src')
|
||||
tag.remove_attribute('width')
|
||||
tag.remove_attribute('height')
|
||||
elsif large_images.include?(src)
|
||||
tag.name = 'a'
|
||||
tag.set_attribute('href', src)
|
||||
tag.set_attribute('target', '_blank')
|
||||
tag.set_attribute('title', I18n.t('post.image_placeholder.large'))
|
||||
tag.remove_attribute('src')
|
||||
tag.remove_attribute('width')
|
||||
tag.remove_attribute('height')
|
||||
tag.inner_html = '<span class="large-image fa fa-picture-o"></span>'
|
||||
parent = tag.parent
|
||||
if parent.name == 'a'
|
||||
parent.add_next_sibling(tag)
|
||||
parent.add_next_sibling('<br>')
|
||||
parent.content = parent["href"]
|
||||
end
|
||||
end
|
||||
end
|
||||
if start_html == post.cooked && doc.to_html != post.cooked
|
||||
|
|
|
@ -516,6 +516,10 @@ en:
|
|||
title: "leader"
|
||||
change_failed_explanation: "You attempted to demote %{user_name} to '%{new_trust_level}'. However their trust level is already '%{current_trust_level}'. %{user_name} will remain at '%{current_trust_level}' - if you wish to demote user lock trust level first"
|
||||
|
||||
post:
|
||||
image_placeholder:
|
||||
broken: "This image is broken"
|
||||
large: "Click to view the image"
|
||||
|
||||
rate_limiter:
|
||||
slow_down: "You have performed this action too many times, try again later."
|
||||
|
|
|
@ -99,7 +99,7 @@ describe Jobs::PullHotlinkedImages do
|
|||
<img src='#{image_url}'>
|
||||
#{url}
|
||||
<img src='#{broken_image_url}'>
|
||||
<img src='#{large_image_url}'>
|
||||
<a href='#{url}'><img src='#{large_image_url}'></a>
|
||||
")
|
||||
|
||||
Jobs::ProcessPost.new.execute(post_id: post.id)
|
||||
|
@ -110,8 +110,8 @@ describe Jobs::PullHotlinkedImages do
|
|||
|
||||
expect(post.cooked).to match(/<p><img src=.*\/uploads/)
|
||||
expect(post.cooked).to match(/<img src=.*\/uploads.*\ class="thumbnail"/)
|
||||
expect(post.cooked).to match(/<span .*\ class="broken-image fa fa-chain-broken/)
|
||||
expect(post.cooked).to match(/<a .*\ href=.*\ target="_blank"><span class="large-image fa fa-picture-o"><\/span><\/a>/)
|
||||
expect(post.cooked).to match(/<span class="broken-image fa fa-chain-broken/)
|
||||
expect(post.cooked).to match(/<\/a><br><a href=.*\ target="_blank" .*\><span class="large-image fa fa-picture-o"><\/span><\/a>/)
|
||||
end
|
||||
end
|
||||
end
|
||||
|
@ -124,7 +124,7 @@ describe Jobs::PullHotlinkedImages do
|
|||
Jobs::PullHotlinkedImages.new.execute(post_id: post.id)
|
||||
post.reload
|
||||
|
||||
expect(post.cooked).to match(/<span .*\ class="broken-image fa fa-chain-broken/)
|
||||
expect(post.cooked).to match(/<span class="broken-image fa fa-chain-broken/)
|
||||
end
|
||||
|
||||
it 'large image with placeholder' do
|
||||
|
@ -134,7 +134,7 @@ describe Jobs::PullHotlinkedImages do
|
|||
Jobs::PullHotlinkedImages.new.execute(post_id: post.id)
|
||||
post.reload
|
||||
|
||||
expect(post.cooked).to match(/<a .*\ href=.*\ target="_blank"><span class="large-image fa fa-picture-o"><\/span><\/a>/)
|
||||
expect(post.cooked).to match(/<a href=.*\ target="_blank" .*\><span class="large-image fa fa-picture-o"><\/span><\/a>/)
|
||||
end
|
||||
end
|
||||
|
||||
|
|
Loading…
Reference in New Issue