Left: | ||
Right: |
LEFT | RIGHT |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 | 2 |
3 <!-- | 3 <!-- |
4 - This file is part of Adblock Plus <https://adblockplus.org/>, | 4 - This file is part of Adblock Plus <https://adblockplus.org/>, |
5 - Copyright (C) 2006-2016 Eyeo GmbH | 5 - Copyright (C) 2006-2016 Eyeo GmbH |
6 - | 6 - |
7 - Adblock Plus is free software: you can redistribute it and/or modify | 7 - Adblock Plus is free software: you can redistribute it and/or modify |
8 - it under the terms of the GNU General Public License version 3 as | 8 - it under the terms of the GNU General Public License version 3 as |
9 - published by the Free Software Foundation. | 9 - published by the Free Software Foundation. |
10 - | 10 - |
(...skipping 21 matching lines...) Expand all Loading... | |
32 * | 32 * |
33 { | 33 { |
34 box-sizing: border-box; | 34 box-sizing: border-box; |
35 } | 35 } |
36 html | 36 html |
37 { | 37 { |
38 height: 100%; | 38 height: 100%; |
39 } | 39 } |
40 body | 40 body |
41 { | 41 { |
42 height: 100%; | |
43 margin: 0px; | |
44 padding: 5px; | |
42 font-family: Arial, Helvetica, sans-serif; | 45 font-family: Arial, Helvetica, sans-serif; |
saroyanm
2016/03/03 15:29:25
Detail: Can you please reorder css properties with
Sebastian Noack
2016/03/03 15:40:14
Done, I think.
saroyanm
2016/03/03 16:11:34
Yes only one small note: please move display prope
Sebastian Noack
2016/03/03 17:42:32
I did leave the display property definition below
| |
43 font-size: 13px; | 46 font-size: 13px; |
44 margin: 0px; | |
45 padding: 5px; | |
46 height: 100%; | |
47 display: -webkit-flex; | 47 display: -webkit-flex; |
48 display: flex; | 48 display: flex; |
49 -webkit-flex-direction: column; | 49 -webkit-flex-direction: column; |
50 flex-direction: column; | 50 flex-direction: column; |
51 } | 51 } |
52 #title, | 52 #title, |
53 #filters | 53 #filters |
54 { | 54 { |
55 margin-bottom: 3px; | 55 margin-bottom: 3px; |
56 } | 56 } |
57 #title > * | 57 #title > * |
58 { | 58 { |
59 vertical-align: middle; | 59 vertical-align: middle; |
60 } | 60 } |
61 #title > img | 61 #title > img |
62 { | 62 { |
63 margin-right: 5px; | 63 margin-right: 5px; |
64 } | 64 } |
65 #title, #buttons | 65 #title, #buttons |
66 { | 66 { |
67 -webkit-flex-shrink: 0; | 67 -webkit-flex-shrink: 0; |
68 flex-shrink: 0; | 68 flex-shrink: 0; |
69 } | 69 } |
70 #filters | 70 #filters |
71 { | 71 { |
72 width: 100%; | 72 width: 100%; |
73 height: 100px; | |
saroyanm
2016/03/03 15:29:25
while we are using the grow factor I think we can
Sebastian Noack
2016/03/03 15:40:14
Yes, for modern browsers, the height doesn't have
| |
74 resize: none; | 73 resize: none; |
75 white-space: pre; | 74 white-space: pre; |
76 word-wrap: normal; | 75 word-wrap: normal; |
77 -webkit-flex-grow: 1; | 76 -webkit-flex-grow: 1; |
78 flex-grow: 1; | 77 flex-grow: 1; |
79 } | 78 } |
80 #buttons | 79 #buttons |
81 { | 80 { |
82 text-align: right; | 81 text-align: right; |
83 } | 82 } |
(...skipping 12 matching lines...) Expand all Loading... | |
96 | 95 |
97 <textarea id="filters"></textarea> | 96 <textarea id="filters"></textarea> |
98 | 97 |
99 <div id="buttons"> | 98 <div id="buttons"> |
100 <button id="addButton" class="i18n_add"></button> | 99 <button id="addButton" class="i18n_add"></button> |
101 <button id="cancelButton" class="i18n_cancel"></button> | 100 <button id="cancelButton" class="i18n_cancel"></button> |
102 </div> | 101 </div> |
103 | 102 |
104 </body> | 103 </body> |
105 </html> | 104 </html> |
LEFT | RIGHT |