Issue 1292 - Optimized first-run page share section for smaller screens

skin/firstRun.css

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2015 Eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 137 matching lines @@
   box-sizing: border-box;
 }
 
 #general
 {
   display: table;
   padding-left: 0px;
   padding-right: 0px;
 }
 
-#general > div
+#general > .block
 {
   display: table-cell;
   width: 50%;
   vertical-align: top;
   padding: 0px 50px;
   border: dashed 0 #969085;
   -webkit-border-start-width: 1px;
   -moz-border-start-width: 1px;
   border-inline-start-width: 1px;
 }
 
-#general > div:first-child
+#general > .block:first-child
 {
   border: none;
 }
 
 #acceptable-ads-block h2
 {
   margin-bottom: 34px;
 }
 
 #abb-promotion-block:lang(fr)
@@ skipping 176 matching lines @@
   font-size: 22px;
   display: block;
 }
 
 #donate:hover, .share-buttons a:hover
 {
   box-shadow: 0px 0px 0px 2px #8ca7c4;
   border-radius: 30px;
 }
 
-#donate-block span, #share-block span
+#share > .block
 {
-  margin: 10px 20px;
-}
-
-#donate-block, #share-block
-{
-  min-width: 250px;
   display: inline-block;
   vertical-align: top;
-  padding: 5px 0 5px 0;
+  width: 49%;
+  padding: 5px 0px;
   border: 1px dashed #37506d;
   border-style: none dashed;
 }
 
-#donate-block
+#share > .block:last-child
 {
-  width: 50%;
+  -webkit-border-start-style: none;
+  -moz-border-start-style: none;
 }
 
-#share-block
+#share > .block > span
 {
-  width: 49%;
-
-  -webkit-border-start-style: none;
-  -moz-border-start-style: none;
+  margin: 10px 20px;
 }
 
 .share-buttons
 {
   margin-top: 6px;
-  cursor: pointer;
   vertical-align: top;
   /* because inline block creates
    * space if not captured with
    * font-size and line-height 0px
    */
   font-size: 0px;
   line-height: 0px;
 }
 
 .share-buttons > a
@@ skipping 245 matching lines @@
     width: 64px;
     height: 64px;
   }
 
   section
   {
     padding: 40px 20px;
   }
 
   #general,
-  #general > div
+  #general > .block,
+  #share > .block
   {
     display: block;
   }
 
-  #general > div
+  #general > .block
   {
     width: auto;
+    margin-left: 20px;
+    margin-right: 20px;
     padding: 10px 0px;
     border-width: 1px 0px 0px;
   }
 
-  #general > div,
-  #can-do-more > h2,
-  #can-do-more-content
+  #share > .block
   {
-    margin-left: 20px;
-    margin-right: 20px;
+    width: auto;
+    padding: 20px 0px;
+    border-style: dashed none none;
+  }
+
+  #donate,
+  .share-buttons
+  {
+    margin-top: 10px;
   }
   
   #can-do-more,
   #can-do-more .feature h3
   {
     text-align: center;
   }
 
   #can-do-more .feature-description-textblock
   {
     text-align: start;
   }
 
   .toggle
   {
     margin-top: 14px;
   }
 }