 Issue 29334775:
  Issue 2873 - Making contributor tables responsive  (Closed)
    
  
    Issue 29334775:
  Issue 2873 - Making contributor tables responsive  (Closed) 
  | Left: | ||
| Right: | 
| OLD | NEW | 
|---|---|
| 1 title=Adblock Plus - Contributor Credits | 1 title=Adblock Plus - Contributor Credits | 
| 2 | 2 | 
| 3 <head> | 3 <head> | 
| 4 <style type="text/css"> | 4 <style type="text/css"> | 
| 5 #content | 5 #content | 
| 6 { | 6 { | 
| 7 width: 980px; | 7 position: relative; | 
| 8 overflow: auto; | |
| 9 } | |
| 10 | |
| 11 @media(min-width: 980px) | |
| 12 { | |
| 13 #content | |
| 14 { | |
| 15 width: 980px; | |
| 16 } | |
| 17 } | |
| 18 | |
| 19 #content h3 | |
| 20 { | |
| 21 margin: 0px 0 10px 0; | |
| 
saroyanm
2016/02/04 16:03:45
Detail: please make styling consistent by specifin
 
juliandoucette
2016/02/05 13:30:25
Done.
 | |
| 8 } | 22 } | 
| 9 | 23 | 
| 10 #pageactions | 24 #pageactions | 
| 11 { | 25 { | 
| 12 margin-left: 0; | 26 margin-left: 0; | 
| 13 margin-right: 0; | 27 margin-right: 0; | 
| 14 width: 100%; | 28 width: 100%; | 
| 15 } | 29 } | 
| 16 | 30 | 
| 17 section | 31 #content > section | 
| 18 { | 32 { | 
| 19 display: inline-block; | 33 display: block; | 
| 20 margin: 0 40px 0 0; | 34 float: left; | 
| 
saroyanm
2016/02/04 16:03:45
Can't see reason why to use float in this case to
 
juliandoucette
2016/02/05 13:30:25
Done.
 | |
| 21 } | 35 width: 50%; | 
| 22 | 36 margin-top: 1em; | 
| 
saroyanm
2016/02/04 16:03:45
Detail: Please use px to make it consistent with o
 
juliandoucette
2016/02/05 13:30:25
Done.
 | |
| 23 h3 | |
| 24 { | |
| 25 margin: 0px 0 10px 0; | |
| 26 } | 37 } | 
| 27 | 38 | 
| 28 .contributors-table | 39 .contributors-table | 
| 29 { | 40 { | 
| 30 display: block; | 41 width: 90%; | 
| 31 margin: 0 0 40px 0; | 42 } | 
| 43 | |
| 44 @media(max-width: 980px) | |
| 45 { | |
| 46 #content > section | |
| 47 { | |
| 48 display: block; | |
| 
saroyanm
2016/02/04 16:03:45
This float hack shouldn't be necessary if we will
 
juliandoucette
2016/02/05 13:30:25
Done.
 | |
| 49 float: none; | |
| 50 clear: both; | |
| 51 width: 100%; | |
| 52 } | |
| 53 .contributors-table | |
| 54 { | |
| 55 width: 100%; | |
| 56 } | |
| 57 } | |
| 58 | |
| 59 .contributors-table | |
| 60 { | |
| 32 border: 0; | 61 border: 0; | 
| 33 } | 62 } | 
| 34 | 63 | 
| 35 .contributors-table td | 64 .contributors-table td | 
| 36 { | 65 { | 
| 37 padding: 10px 5px; | 66 padding: 10px 5px; | 
| 67 border: 0; | |
| 
saroyanm
2016/02/04 16:03:45
Detail: please specify units.
 
juliandoucette
2016/02/05 13:30:25
Acknowledged.
I just moved this line. I didn't ch
 | |
| 38 min-width: 200px; | 68 min-width: 200px; | 
| 39 border: 0; | |
| 40 } | 69 } | 
| 41 | 70 | 
| 42 .contributors-table thead | 71 .contributors-table thead | 
| 43 { | 72 { | 
| 44 border-width: 1px; | 73 border-width: 1px; | 
| 45 border-color: #7d7d7d; | 74 border-color: #7d7d7d; | 
| 46 border-style: dashed none; | 75 border-style: dashed none; | 
| 47 } | 76 } | 
| 48 | 77 | 
| 49 .contributors-table thead td | 78 .contributors-table thead td | 
| (...skipping 13 matching lines...) Expand all Loading... | |
| 63 { | 92 { | 
| 64 height: 40px; | 93 height: 40px; | 
| 65 padding: 10px 0 5px 0; | 94 padding: 10px 0 5px 0; | 
| 66 vertical-align: bottom; | 95 vertical-align: bottom; | 
| 67 } | 96 } | 
| 68 | 97 | 
| 69 .contributors-table tbody td | 98 .contributors-table tbody td | 
| 70 { | 99 { | 
| 71 padding: 5px 5px; | 100 padding: 5px 5px; | 
| 72 } | 101 } | 
| 102 | |
| 103 @media(max-width: 460px) | |
| 104 { | |
| 105 .contributors-table td | |
| 106 { | |
| 107 font-size: 12px; | |
| 108 min-width: 140px; | |
| 109 } | |
| 110 } | |
| 111 | |
| 112 .contributors-table | |
| 73 </style> | 113 </style> | 
| 74 </head> | 114 </head> | 
| 75 <section id="team"> | 115 <section id="team"> | 
| 76 <h3>{{s1 Team}}</h3> | 116 <h3>{{s1 Team}}</h3> | 
| 77 <table class="contributors-table" rules="groups"> | 117 <table class="contributors-table" rules="groups"> | 
| 78 <thead> | 118 <thead> | 
| 79 <tr> | 119 <tr> | 
| 80 <td>{{s2 Name}}</td> | 120 <td>{{s2 Name}}</td> | 
| 81 <td>{{s3 Role}}</td> | 121 <td>{{s3 Role}}</td> | 
| 82 </tr> | 122 </tr> | 
| (...skipping 167 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 250 <td>Nickolay Ponomarev</td> | 290 <td>Nickolay Ponomarev</td> | 
| 251 <td>{{s44 Developer (performance)}}</td> | 291 <td>{{s44 Developer (performance)}}</td> | 
| 252 </tr> | 292 </tr> | 
| 253 <tr> | 293 <tr> | 
| 254 <td>Sebastian Schmidt (yath)</td> | 294 <td>Sebastian Schmidt (yath)</td> | 
| 255 <td>{{s45 Developer (Adblock Plus for Android bug fix)}}</td> | 295 <td>{{s45 Developer (Adblock Plus for Android bug fix)}}</td> | 
| 256 </tr> | 296 </tr> | 
| 257 </tbody> | 297 </tbody> | 
| 258 </table> | 298 </table> | 
| 259 </section> | 299 </section> | 
| OLD | NEW |