Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: static/css/main.css

Issue 29834609: Fixes #108 - Moved video disclaimer underneath video on small screens and removed it's show/hide an… (Closed) Base URL: https://hg.adblockplus.org/web.adblockplus.org
Patch Set: Created July 19, 2018, 5:05 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: static/css/main.css
===================================================================
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -755,60 +755,70 @@
display: block;
position: relative;
}
.video-thumbnail
{
display: block;
width: 100%;
- transition: opacity 0.8s;
opacity: 0.2;
}
.hide-disclaimer .video-thumbnail
{
opacity: 1;
}
.video-disclaimer
{
- visibility: visible;
- opacity: 1;
- position: absolute;
- bottom: 0;
- left: 0;
padding: 1em;
background-color: #fff;
font-size: 0.9em;
text-align: center;
- transition: opacity 0.8s;
+}
+
+@media (min-width: 576px)
+{
+ .video-disclaimer
+ {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ }
}
.content .video-disclaimer
{
margin: 0;
}
.hide-disclaimer .video-disclaimer
{
- visibility: hidden;
- opacity: 0;
+ display: none;
}
.video-play
{
position: absolute;
top: 50%;
left: 50%;
width: 80px;
- margin-top: -60px;
+ margin-top: -40px;
margin-left: -40px;
}
+@media (min-width: 576px)
+{
+ .video-play
+ {
+ margin-top: -60px;
+ }
+}
+
.hide-disclaimer .video-play
{
margin-top: -40px;
}
.hide
{
display: none;
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld