UX: oneboxes with avatars now display consistently

Onebox avatar size is reduced to 60px

Also fixes regression with some oneboxes not cooking after post
This commit is contained in:
Sam 2017-11-08 11:50:01 +11:00
parent d7880af0bb
commit fc7dca58fe
4 changed files with 21 additions and 10 deletions

View File

@ -35,7 +35,7 @@ gem 'redis-namespace'
gem 'active_model_serializers', '~> 0.8.3'
gem 'onebox', '1.8.22'
gem 'onebox', '1.8.23'
gem 'http_accept_language', '~>2.0.5', require: false

View File

@ -228,7 +228,7 @@ GEM
omniauth-twitter (1.3.0)
omniauth-oauth (~> 1.1)
rack
onebox (1.8.22)
onebox (1.8.23)
fast_blank (>= 1.0.0)
htmlentities (~> 4.3)
moneta (~> 1.0)
@ -464,7 +464,7 @@ DEPENDENCIES
omniauth-oauth2
omniauth-openid
omniauth-twitter
onebox (= 1.8.22)
onebox (= 1.8.23)
openid-redis-store
pg
pry-nav
@ -505,4 +505,4 @@ DEPENDENCIES
webmock
BUNDLED WITH
1.15.4
1.16.0

View File

@ -241,8 +241,8 @@ aside.onebox {
aside.onebox .onebox-body .onebox-avatar {
max-height: none;
max-width: none;
height: 90px;
width: 90px;
height: 60px;
width: 60px;
}
blockquote {
@ -358,8 +358,7 @@ aside.onebox.twitterstatus .onebox-body {
}
.date {
clear: left;
padding-top: 5px;
margin-left: 58px;
padding-top: 10px;
}
}
@ -397,7 +396,7 @@ aside.onebox.twitterstatus .onebox-body {
// resize stackexchange onebox image
aside.onebox.stackexchange .onebox-body {
img {
img:not(.onebox-avatar) {
max-height: 60%;
max-width: 10%;
}
@ -443,6 +442,14 @@ aside.onebox.stackexchange .onebox-body {
}
}
.onebox.githubcommit {
pre.message {
clear: left;
padding: 0;
padding-top: 10px;
}
}
// mobile specific style
.mobile-view article.onebox-body {
border-top: none;

View File

@ -326,7 +326,11 @@ class CookedPostProcessor
# and wrap in a div
oneboxed_images.each do |img|
limit_size!(img)
if img.parent["class"].include?("onebox-body") && (width = img["width"].to_i) > 0 && (height = img["height"].to_i) > 0
next if img["class"]&.include?('onebox-avatar')
parent_class = img.parent && img.parent["class"]
if parent_class&.include?("onebox-body") && (width = img["width"].to_i) > 0 && (height = img["height"].to_i) > 0
img.delete('width')
img.delete('height')
new_parent = img.add_next_sibling("<div class='aspect-image' style='--aspect-ratio:#{width}/#{height};'/>")