Unified Diff: index.html
Issue 8681060:
share-page: Implement final design (Closed)
Patch Set:
Created Oct. 26, 2012, 3:15 p.m.
Use n/p to move between diff chunks;
N/P to move between comments.
« no previous file with comments
|
« googleplus.png ('k')
|
twitter.png » ('j')
|
no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| Index: index.html |
| =================================================================== |
| --- a/index.html |
| +++ b/index.html |
| @@ -1,20 +1,22 @@ |
| <!DOCTYPE html> |
| <html> |
| <head> |
| +<title>Share</title> |
| <style> |
| body |
| { |
| - width: 600px; |
| - height: 540px; |
| + width: 680px; |
| + height: 570px; |
| margin: auto; |
| + padding-left: 30px; |
| border: 5px solid #a42c23; |
| background: white; |
| } |
| #headline |
| { |
| - height: 120px; |
| + height: 100px; |
| font-family: Arial, Helvetica, sans; |
| font-size: 28px; |
| text-align: center; |
| @@ -32,11 +34,13 @@ |
| #facebook, #twitter, #gplus |
| { |
| - padding-left: 125px; |
| + margin-bottom: 10px; |
| + padding-left: 140px; |
| + width: 500px; |
| height: 140px; |
| background-repeat: no-repeat; |
| - background-size: 64px; |
| - background-position: 30px 50%; |
| + background-size: 140px; |
| + background-position: 0px 50%; |
| display: -webkit-box; |
| -webkit-box-orient: vertical; |
| @@ -45,34 +49,44 @@ |
| display: box; |
| box-orient: vertical; |
| box-pack: center; |
| -} |
| -#facebook, #twitter |
| -{ |
| - padding-left: 135px; |
| + border-radius: 7px; |
| } |
| { |
| background-image: url("/facebook.png"); |
| - background-color: #f3f4f8; |
| + background-color: #8e9bb2; |
| } |
| { |
| background-image: url("/twitter.png"); |
| - background-color: #d7e8f1; |
| + background-color: #64abcb; |
| } |
| #gplus |
| { |
| background-image: url("/googleplus.png"); |
| - background-color: #f1f1f1; |
| + background-color: #cf6d5c; |
| } |
| -#___plus_0 |
| +.widget-container |
| { |
| - margin-top: 12px !important; |
| + width: 490px; |
| + height: 118px; |
| + border-radius: 0px 3px 3px 0px; |
| + background-color: white; |
| +} |
| + |
| +.fb-like { |
| + margin-top: 30px; |
| + margin-left: 12px; |
| +} |
| + |
| +#twitter iframe { |
| + margin-top: 40px; |
| + margin-left: 10px; |
| } |
| </style> |
| <script><!-- |
| @@ -152,20 +166,26 @@ |
| </head> |
| <body> |
| -<div id="headline">Think Adblock Plus is worth sharing?</div> |
| +<div id="headline">Is Adblock Plus worth sharing?</div> |
| <div id="facebook"> |
| - <div id="fb-root"></div> |
| - <div class="fb-like" data-href="https://www.facebook.com/adblockplus" data-send="true" data-width="450" data-show-faces="true"></div> |
| + <div class="widget-container"> |
| + <div id="fb-root"></div> |
| + <div class="fb-like" data-href="https://www.facebook.com/adblockplus" data-send="true" data-width="450" data-show-faces="true"></div> |
| + </div> |
| </div> |
| <div id="twitter"> |
| - <a href="https://twitter.com/AdblockPlus" class="twitter-follow-button" data-show-count="false" data-size="large">Follow @AdblockPlus</a> |
| - <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://adblockplus.org" data-text="I browse the web without annoying ads thanks to @AdblockPlus!" data-size="large">Tweet</a> |
| + <div class="widget-container"> |
| + <a href="https://twitter.com/AdblockPlus" class="twitter-follow-button" data-show-count="false" data-size="large">@AdblockPlus folgen</a> |
| + <a href="https://twitter.com/share" class="twitter-share-button" data-url="https://adblockplus.org" data-text="I browse the web without annoying ads thanks to @AdblockPlus!" data-size="large">Twittern</a> |
| + </div> |
| </div> |
| <div id="gplus"> |
| - <div class="g-plus" data-href="https://plus.google.com/110020691898167279887" data-rel="publisher"></div> |
| + <div class="widget-container"> |
| + <div class="g-plus" data-href="https://plus.google.com/110020691898167279887" data-width="490" data-rel="publisher"></div> |
| + </div> |
| </div> |
| </body> |
« no previous file with comments
|
« googleplus.png ('k')
|
twitter.png » ('j')
|
no next file with comments »
