IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-23 09:26:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

FIX: Correct the play icon position (#14295)

Browse Source
This commit is contained in:
Jarek Radosz 2021-09-09 15:10:32 +02:00 committed by GitHub
parent 1205db8f84
commit 02a6b991fe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/assets/stylesheets/common/base/onebox.scss
View File

@ -290,7 +290,12 @@ aside.onebox {
}
}
.instagram-video-icon {
.image-wrapper {
display: block;
position: relative;
}
.video-icon {
&:before {
opacity: 0.8;
// ideally, the SVG used here should be in HTML and reference the SVG sprite

4
lib/onebox/engine/google_photos_onebox.rb
View File

@ -31,9 +31,9 @@ module Onebox
<article class="onebox-body">
<h3><a href="#{escaped_url}" target="_blank" rel="nofollow ugc noopener">#{og.title}</a></h3>
<div class="aspect-image-full-size">
<a href="#{escaped_url}" target="_blank" rel="nofollow ugc noopener">
<a href="#{escaped_url}" target="_blank" rel="nofollow ugc noopener" class="image-wrapper">
<img src="#{og.secure_image_url}" class="scale-image"/>
<span class="instagram-video-icon"></span>
<span class="video-icon"></span>
</a>
</div>
</article>

6
lib/onebox/engine/reddit_media_onebox.rb
View File

@ -25,7 +25,7 @@ module Onebox
</article>
</aside>
HTML
elsif raw[:type] =~ /^video[\/\.]/
elsif raw[:type] =~ /^video[\/\.]/
<<-HTML
<aside class="onebox reddit">
<header class="source">
@ -35,9 +35,9 @@ module Onebox
<article class="onebox-body">
<h3><a href="#{raw[:url]}" target="_blank" rel="nofollow ugc noopener">#{raw[:title]}</a></h3>
<div class="aspect-image-full-size">
<a href="#{raw[:url]}" target="_blank" rel="nofollow ugc noopener">
<a href="#{raw[:url]}" target="_blank" rel="nofollow ugc noopener" class="image-wrapper">
<img src="#{raw[:image]}" class="scale-image"/>
<span class="instagram-video-icon"></span>
<span class="video-icon"></span>
</a>
</div>
<div class="description"><p>#{raw[:description]}</p></div>