Side by Side 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.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« no previous file with comments
|
« no previous file
|
no next file »
|
no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| OLD | NEW |
|---|---|
| 1 * | 1 * |
| 2 { | 2 { |
| 3 font-family: Arial, sans; | 3 font-family: Arial, sans; |
| 4 font-size: 16px; | 4 font-size: 16px; |
| 5 } | 5 } |
| 6 | 6 |
| 7 body | 7 body |
| 8 { | 8 { |
| 9 margin: 0; | 9 margin: 0; |
| 10 /* Start below fixed navbar */ | 10 /* Start below fixed navbar */ |
| (...skipping 742 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 753 .video-link | 753 .video-link |
| 754 { | 754 { |
| 755 display: block; | 755 display: block; |
| 756 position: relative; | 756 position: relative; |
| 757 } | 757 } |
| 758 | 758 |
| 759 .video-thumbnail | 759 .video-thumbnail |
| 760 { | 760 { |
| 761 display: block; | 761 display: block; |
| 762 width: 100%; | 762 width: 100%; |
| 763 transition: opacity 0.8s; | |
| 764 opacity: 0.2; | 763 opacity: 0.2; |
| 765 } | 764 } |
| 766 | 765 |
| 767 .hide-disclaimer .video-thumbnail | 766 .hide-disclaimer .video-thumbnail |
| 768 { | 767 { |
| 769 opacity: 1; | 768 opacity: 1; |
| 770 } | 769 } |
| 771 | 770 |
| 772 .video-disclaimer | 771 .video-disclaimer |
| 773 { | 772 { |
| 774 visibility: visible; | |
| 775 opacity: 1; | |
| 776 position: absolute; | |
| 777 bottom: 0; | |
| 778 left: 0; | |
| 779 padding: 1em; | 773 padding: 1em; |
| 780 background-color: #fff; | 774 background-color: #fff; |
| 781 font-size: 0.9em; | 775 font-size: 0.9em; |
| 782 text-align: center; | 776 text-align: center; |
| 783 transition: opacity 0.8s; | 777 } |
| 778 | |
| 779 @media (min-width: 576px) | |
| 780 { | |
| 781 .video-disclaimer | |
| 782 { | |
| 783 position: absolute; | |
| 784 bottom: 0; | |
| 785 left: 0; | |
| 786 } | |
| 784 } | 787 } |
| 785 | 788 |
| 786 .content .video-disclaimer | 789 .content .video-disclaimer |
| 787 { | 790 { |
| 788 margin: 0; | 791 margin: 0; |
| 789 } | 792 } |
| 790 | 793 |
| 791 .hide-disclaimer .video-disclaimer | 794 .hide-disclaimer .video-disclaimer |
| 792 { | 795 { |
| 793 visibility: hidden; | 796 display: none; |
| 794 opacity: 0; | |
| 795 } | 797 } |
| 796 | 798 |
| 797 .video-play | 799 .video-play |
| 798 { | 800 { |
| 799 position: absolute; | 801 position: absolute; |
| 800 top: 50%; | 802 top: 50%; |
| 801 left: 50%; | 803 left: 50%; |
| 802 width: 80px; | 804 width: 80px; |
| 803 margin-top: -60px; | 805 margin-top: -40px; |
| 804 margin-left: -40px; | 806 margin-left: -40px; |
| 805 } | 807 } |
| 806 | 808 |
| 809 @media (min-width: 576px) | |
| 810 { | |
| 811 .video-play | |
| 812 { | |
| 813 margin-top: -60px; | |
| 814 } | |
| 815 } | |
| 816 | |
| 807 .hide-disclaimer .video-play | 817 .hide-disclaimer .video-play |
| 808 { | 818 { |
| 809 margin-top: -40px; | 819 margin-top: -40px; |
| 810 } | 820 } |
| 811 | 821 |
| 812 .hide | 822 .hide |
| 813 { | 823 { |
| 814 display: none; | 824 display: none; |
| 815 } | 825 } |
| OLD | NEW |
« no previous file with comments
|
« no previous file
|
no next file »
|
no next file with comments »
