Side by Side Diff: static/css/main.css
Issue 29703633:
Noissue - Abstracted embedded video for use in blog (Closed)
Base URL: https://hg.adblockplus.org/web.adblockplus.org
Patch Set: Addressed #7, moved video* to main*, and refactored Video class
Created Feb. 23, 2018, 1:30 p.m.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« includes/index.tmpl ('K')
|
« static/css/index.css ('k')
|
static/js/index.js » ('j')
|
static/js/main.js » ('J')
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 line-height: 1.5; | 10 line-height: 1.5; |
| (...skipping 698 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 709 { | 709 { |
| 710 display: none; | 710 display: none; |
| 711 } | 711 } |
| 712 | 712 |
| 713 /* overriding display:none above */ | 713 /* overriding display:none above */ |
| 714 #footer #social-list | 714 #footer #social-list |
| 715 { | 715 { |
| 716 display: block; | 716 display: block; |
| 717 } | 717 } |
| 718 } | 718 } |
| 719 | |
| 720 /* Video | |
| 721 ****************************************************************************/ | |
| 722 | |
| 723 .video-parent | |
| 724 { | |
| 725 position: relative; | |
| 726 display: block; | |
| 727 width: 100%; | |
| 728 padding: 0; | |
| 729 border: 1px solid #c9c9c9; | |
| 730 box-shadow: 1px 1px 0 0 #dbdbdb; | |
| 731 overflow: hidden; | |
| 732 } | |
| 733 | |
| 734 .video-parent.has-iframe::before | |
| 735 { | |
| 736 display: block; | |
| 737 content: ""; | |
| 738 padding-top: 56.25%; | |
| 739 } | |
| 740 | |
| 741 .video-parent iframe | |
| 742 { | |
| 743 position: absolute; | |
| 744 top: 0; | |
| 745 bottom: 0; | |
| 746 left: 0; | |
| 747 width: 100%; | |
| 748 height: 100%; | |
| 749 border: 0; | |
| 750 } | |
| 751 | |
| 752 .video-link | |
| 753 { | |
| 754 display: block; | |
| 755 position: relative; | |
| 756 } | |
| 757 | |
| 758 .video-thumbnail | |
| 759 { | |
| 760 width: 100%; | |
| 761 transition: opacity 0.8s; | |
| 762 opacity: 0.2; | |
| 763 } | |
| 764 | |
| 765 .hide-disclaimer .video-thumbnail | |
| 766 { | |
| 767 opacity: 1; | |
| 768 } | |
| 769 | |
| 770 .video-disclaimer | |
| 771 { | |
| 772 visibility: visible; | |
| 773 opacity: 1; | |
| 774 position: absolute; | |
| 775 bottom: 0; | |
| 776 left: 0; | |
| 777 padding: 0 1em; | |
| 778 background-color: #fff; | |
| 779 font-size: 0.9em; | |
| 780 text-align: center; | |
| 781 transition: opacity 0.8s; | |
| 782 } | |
| 783 | |
| 784 .hide-disclaimer .video-disclaimer | |
| 785 { | |
| 786 visibility: hidden; | |
| 787 opacity: 0; | |
| 788 } | |
| 789 | |
| 790 .video-play | |
| 791 { | |
| 792 position: absolute; | |
| 793 top: 50%; | |
| 794 left: 50%; | |
| 795 width: 80px; | |
| 796 margin-top: -60px; | |
| 797 margin-left: -40px; | |
| 798 } | |
| 799 | |
| 800 .hide-disclaimer .video-play | |
| 801 { | |
| 802 margin-top: -40px; | |
| 803 } | |
| OLD | NEW |
« includes/index.tmpl ('K')
|
« static/css/index.css ('k')
|
static/js/index.js » ('j')
|
static/js/main.js » ('J')
