Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Delta Between Two Patch Sets: static/css/index.css

Issue 29721720: Fixes #32 - Adjustments to cross-promotion section (Closed) Base URL: https://hg.adblockplus.org/web.adblockplus.org
Left Patch Set: Addressed note_63196626 Created March 14, 2018, 12:23 p.m.
Right Patch Set: Removed global font-size change Created March 14, 2018, 12:48 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
Left: Side by side diff | Download
Right: Side by side diff | Download
« no previous file with change/comment | « locales/en/abb-notification.json ('k') | no next file » | no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
1 /****************************************************************************** 1 /******************************************************************************
2 * Temparary styles 2 * Temparary styles
3 *****************************************************************************/ 3 *****************************************************************************/
4 4
5 .avoid-wrap {display: inline-block;} 5 .avoid-wrap {display: inline-block;}
6 .small {font-size: smaller;} 6 .small {font-size: smaller;}
7 .maxthon-only {display: none;} 7 .maxthon-only {display: none;}
8 .maxthon .maxthon-only {display: block;} 8 .maxthon .maxthon-only {display: block;}
9 9
10 #content, 10 #content,
(...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after
66 #hero-download-video 66 #hero-download-video
67 { 67 {
68 display: block; 68 display: block;
69 } 69 }
70 } 70 }
71 71
72 /****************************************************************************** 72 /******************************************************************************
73 * #media 73 * #media
74 *****************************************************************************/ 74 *****************************************************************************/
75 75
76 #media-section { clear: both; } 76 #media-section
77 77 {
78 #media-header h2, 78 clear: both;
79 #media-list 79 text-align: center;
80 {
81 margin: 0;
82 } 80 }
83 81
84 #media-header 82 #media-header
85 { 83 {
86 margin-bottom: 2em; 84 margin-bottom: 1em;
87 } 85 }
88 86
89 #media-header h2 87 #media-header h2
90 { 88 {
91 font-size: 1em; 89 font-size: 1em;
92 font-weight: normal; 90 font-weight: normal;
93 text-transform: uppercase; 91 text-transform: uppercase;
92 }
93
94 #media-header h2,
95 #media-list
96 {
97 margin: 0;
94 } 98 }
95 99
96 #media-list li 100 #media-list li
97 { 101 {
98 display: inline-block; 102 display: inline-block;
99 } 103 }
100 104
101 #media-list img 105 #media-list img
102 { 106 {
103 max-width: 10em; 107 max-width: 10em;
(...skipping 26 matching lines...) Expand all
130 border-radius: 50%; 134 border-radius: 50%;
131 background-color: #000; 135 background-color: #000;
132 background-image: url(../img/external-icon.png); 136 background-image: url(../img/external-icon.png);
133 background-image: linear-gradient(transparent, transparent), 137 background-image: linear-gradient(transparent, transparent),
134 url(../img/external-icon.svg); 138 url(../img/external-icon.svg);
135 background-repeat: no-repeat; 139 background-repeat: no-repeat;
136 background-position: center; 140 background-position: center;
137 background-size: 1em; 141 background-size: 1em;
138 } 142 }
139 143
140 @media (min-width: 992px) 144 @media (min-width: 1024px)
141 { 145 {
142 #media-header small 146 #media
143 { 147 {
144 display: none;
145 }
146
147 #media-list
148 {
149 display: table;
150 width: 100%;
151 }
152
153 #media-list li
154 {
155 display: table-cell;
156 vertical-align: middle;
157 }
158
159 #media-list img
160 {
161 margin: 0 2em;
162 }
163 }
164
165 @media (min-width: 768px)
166 {
167 #media {
168 display: table; 148 display: table;
169 width: 100%; 149 width: 100%;
170 } 150 }
171 151
172 #media-header, 152 #media-header,
173 #media-list 153 #media-list
174 { 154 {
175 display: table-cell; 155 display: table-cell;
176 vertical-align: middle; 156 vertical-align: middle;
177 width: auto; 157 width: auto;
178 } 158 }
179 159
180 #media-header 160 #media-header
181 { 161 {
182 margin-bottom: 0; 162 margin-bottom: 0;
163 }
164
165 #media-header small
166 {
167 display: none;
183 } 168 }
184 169
185 #media-list { direction: rtl; } 170 #media-list { direction: rtl; }
186 [dir="rtl"] #media-list { direction: ltr; } 171 [dir="rtl"] #media-list { direction: ltr; }
187 172
188 @supports (display: flex) 173 @supports (display: flex)
189 { 174 {
190 #media-list 175 #media-list
191 { 176 {
192 display: flex; 177 display: flex;
193 justify-content: space-between; 178 justify-content: space-between;
194 align-items: center; 179 align-items: center;
195 } 180 }
196 } 181 }
197 182
183 #media-list
184 {
185 display: table;
186 width: 100%;
187 }
188
189 #media-list li
190 {
191 display: table-cell;
192 vertical-align: middle;
193 }
194
195 #media-list img
196 {
197 margin: 0 2em;
198 }
198 } 199 }
199 200
200 /****************************************************************************** 201 /******************************************************************************
201 * #abb-notification 202 * #abb-notification
202 *****************************************************************************/ 203 *****************************************************************************/
203 204
204 #abb-notification 205 #abb-notification
205 { 206 {
206 padding: 3em 0; 207 padding: 3em 0;
207 } 208 }
(...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after
255 padding-right: 2em; 256 padding-right: 2em;
256 } 257 }
257 } 258 }
258 259
259 /****************************************************************************** 260 /******************************************************************************
260 * #footnote 261 * #footnote
261 *****************************************************************************/ 262 *****************************************************************************/
262 263
263 #footnote 264 #footnote
264 { 265 {
265 margin-top: 20px; 266 padding-top: 3em;
266 text-align: start; 267 padding-bottom: 2em;
268 font-size: 13px;
267 color: #7d7d7d; 269 color: #7d7d7d;
268 } 270 }
269
270 #footnote,
271 #footnote li,
272 #footnote a,
273 #footnote strong
274 {
275 font-size: 11px;
276 }
277
278 #footnote li
279 {
280 padding-bottom: 5px;
281 }
282
283 #footnote li:first-child
284 {
285 padding-top: 5px;
286 }
287
288 #footnote ul
289 {
290 margin: 0px;
291 padding: 0px 30px;
292 }
293
294 @media(max-width: 767px)
295 {
296 #footnote
297 {
298 padding: 0px 20px;
299 }
300 }
LEFTRIGHT

Powered by Google App Engine
This is Rietveld