Left: | ||
Right: |
LEFT | RIGHT |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
Thomas Greiner
2015/01/22 17:56:30
This page contains a couple of subpages so I'd fin
saroyanm
2015/01/23 18:18:39
Done.
| |
2 <!-- | 2 <!-- |
3 - This file is part of Adblock Plus <http://adblockplus.org/>, | 3 - This file is part of Adblock Plus <https://adblockplus.org/>, |
Thomas Greiner
2015/01/22 17:56:30
Nit: Change to "https"
saroyanm
2015/01/23 18:18:39
Done.
| |
4 - Copyright (C) 2006-2015 Eyeo GmbH | 4 - Copyright (C) 2006-2015 Eyeo GmbH |
5 - | 5 - |
6 - Adblock Plus is free software: you can redistribute it and/or modify | 6 - Adblock Plus is free software: you can redistribute it and/or modify |
7 - it under the terms of the GNU General Public License version 3 as | 7 - it under the terms of the GNU General Public License version 3 as |
8 - published by the Free Software Foundation. | 8 - published by the Free Software Foundation. |
9 - | 9 - |
10 - Adblock Plus is distributed in the hope that it will be useful, | 10 - Adblock Plus is distributed in the hope that it will be useful, |
11 - but WITHOUT ANY WARRANTY; without even the implied warranty of | 11 - but WITHOUT ANY WARRANTY; without even the implied warranty of |
12 - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | 12 - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
13 - GNU General Public License for more details. | 13 - GNU General Public License for more details. |
14 - | 14 - |
15 - You should have received a copy of the GNU General Public License | 15 - You should have received a copy of the GNU General Public License |
16 - along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>. | 16 - along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>. |
17 --> | 17 --> |
18 | 18 |
19 <html> | 19 <html> |
20 <head> | 20 <head> |
21 <meta charset="utf-8"> | 21 <meta charset="utf-8"> |
22 <title class="i18n_options_page_title"></title> | 22 <title class="i18n_options_page_title"></title> |
23 <link rel="stylesheet" href="skin/options.css"> | 23 <link rel="stylesheet" href="skin/options.css"> |
24 <script type="text/javascript" src="ext/common.js"></script> | 24 <style id="search-style"></style> |
Thomas Greiner
2015/01/22 17:56:30
No need to specify the <script> type
saroyanm
2015/01/23 18:18:39
Done.
We are using type attribute also in other HT
Thomas Greiner
2015/01/26 18:29:17
No, we usually take care of inconsistencies when s
| |
25 <script type="text/javascript" src="ext/content.js"></script> | 25 <script src="ext/common.js"></script> |
26 <script type="text/javascript" src="i18n.js"></script> | 26 <script src="ext/content.js"></script> |
27 <script type="text/javascript" src="options.js"></script> | 27 <script src="i18n.js"></script> |
28 <script src="options.js"></script> | |
28 </head> | 29 </head> |
29 <body> | 30 <body data-tab="general"> |
30 <div id="left-sidebar"> | 31 <!-- Navigation sidebar --> |
32 <div id="nav-sidebar"> | |
31 <div id="fixed-sidebar" class="fixed"> | 33 <div id="fixed-sidebar" class="fixed"> |
32 <div id="page-title"> | 34 <div id="page-title"> |
33 <p class="i18n_options_page_name"></p> | 35 <p class="i18n_options_page_header_1"></p> |
34 <h1>Adblock <b>Plus</b></h1> | 36 <h1 class="i18n_options_page_header_2"></h1> |
Thomas Greiner
2015/01/22 17:56:30
This text needs to be taken from "locale/en-US/opt
saroyanm
2015/01/23 18:18:39
Done.
| |
35 </div> | 37 </div> |
36 <ul class="tabs vertical" id="main-navigation-tabs"> | 38 <ul id="main-navigation-tabs" class="tabs vertical"> |
37 <li id="tab-general" data-show="content-general" class="active"><span class="i18n_options_tab_general"></span><span class="icon"></span></li> | 39 <li id="tab-general" data-show="general" class="active"> |
Thomas Greiner
2015/01/22 17:56:30
Don't put every list item in one single line to im
saroyanm
2015/01/23 18:18:39
Done.
| |
38 <li id="tab-advanced" data-show="content-advanced"><span class="i18n_o ptions_tab_advanced"></span><span class="icon"></span></li> | 40 <span class="i18n_options_tab_general"></span> |
39 <li id="tab-help" data-show="content-help"><span class="i18n_options_t ab_help"></span><span class="icon"></span></li> | 41 <span class="icon"></span> |
42 </li> | |
43 <li id="tab-advanced" data-show="advanced"> | |
44 <span class="i18n_options_tab_advanced"></span> | |
45 <span class="icon"></span> | |
46 </li> | |
47 <li id="tab-help" data-show="help"> | |
48 <span class="i18n_options_tab_help"></span> | |
49 <span class="icon"></span> | |
50 </li> | |
40 </ul> | 51 </ul> |
41 <p class="nav-blue"> | 52 <p class="nav-link"> |
Thomas Greiner
2015/01/22 17:56:30
Don't include colors in class names because the co
saroyanm
2015/01/23 18:18:39
Done.
| |
42 <span class="i18n_options_version"></span> <span id="version">2.5.10</ span> | 53 <span class="i18n_options_version"></span> <span id="abp-version"></sp an> |
Thomas Greiner
2015/01/22 17:56:30
Don't hardcode the version number. Request it from
saroyanm
2015/01/23 18:18:39
Done.
| |
43 </p> | 54 </p> |
44 <ul class="tabs vertical bottom"> | 55 <ul class="tabs vertical bottom"> |
45 <li id="tab-share"><span class="i18n_options_tab_share"></span><span c lass="icon"></span></li> | 56 <li id="tab-share"> |
46 <li id="tab-donate"><span class="i18n_options_tab_donate"></span><span class="icon"></span></li> | 57 <span class="i18n_options_tab_share"></span><span class="icon"></spa n> |
58 </li> | |
59 <li id="tab-donate"> | |
60 <span class="i18n_options_tab_donate"></span><span class="icon"></sp an> | |
61 </li> | |
47 </ul> | 62 </ul> |
48 </div> | 63 </div> |
49 </div> | 64 </div> |
50 <div id="tab-content"> | 65 <div id="tab-content"> |
51 <div id="content-wrapper"> | 66 <div id="content-wrapper"> |
52 <div id="modal-background"></div> | 67 <div id="dialog-background"></div> |
68 | |
69 <!-- General tab content --> | |
53 <div id="content-general"> | 70 <div id="content-general"> |
54 <div> | 71 <div> |
Thomas Greiner
2015/01/22 17:56:30
You're wrapping everything inside a <div> but don'
saroyanm
2015/01/23 18:18:39
Thanks, indentation was missing it wraps Blocking
| |
55 <h1 class="i18n_options_blocking"></h1> | 72 <h1 class="i18n_options_blocking_title"></h1> |
56 <hr> | 73 <div class="flex-container"> |
Thomas Greiner
2015/01/22 17:56:30
You could use "border-bottom" instead of <hr> here
saroyanm
2015/01/23 18:18:39
Done.
| |
57 <div class="flex-container"> | 74 <div id="blocking-languages"> |
58 <div id="blocking-languages" class="left"> | 75 <p class="option-name"> |
Thomas Greiner
2015/01/22 17:56:30
Don't use "left" or "right" in class names since w
saroyanm
2015/01/23 18:18:39
Done.
| |
59 <p class="option-name"><b class="i18n_options_language_adblocking" ></b> <span class="i18n_options_language_title"></span> <a class="i18n_options_r eadMore dotted" href="#" target="_blank"></a></p> | 76 <span class="i18n_options_language_title"></span> |
Thomas Greiner
2015/01/22 17:56:30
Generally, we avoid using HTML elements that conve
saroyanm
2015/01/23 18:18:39
Done.
| |
60 <ul class="table list" id="blocking-languages-table"></ul> | 77 <a class="i18n_options_readMore tooltip" target="_blank"></a> |
61 <hr> | 78 </p> |
62 <div class="controls"> | 79 <ul id="blocking-languages-table" class="table list"> |
63 <div class="button" id="add-website-language" data-show="blockin g-languages-modal"> | 80 <template> |
Thomas Greiner
2015/01/22 17:56:30
It'd be great if you could use standard HTML eleme
saroyanm
2015/01/23 18:18:39
Done.
| |
64 <span class="icon icon-add"></span><span class="i18n_options_l anguage_add text-blue"></span> | 81 <input type="checkbox" class="control" /> |
65 </div> | 82 <span class="display"></span> |
66 </div> | 83 </template> |
67 </div> | 84 </ul> |
68 <div id="further-blocking"> | 85 <div class="controls"> |
69 <p class="option-name"><b class="i18n_options_furtherBlocking_titl e"></b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p > | 86 <button id="add-website-language"> |
Thomas Greiner
2015/01/22 17:56:30
Again, don't use implementation specific details l
saroyanm
2015/01/23 18:18:39
Done.
| |
70 <ul class="table list" id="further-list-table"></ul> | 87 <span class="icon icon-add"></span> |
71 <hr> | 88 <span class="i18n_options_language_add"></span> |
72 <div class="controls"> | 89 </button> |
73 <div class="button" id="add-blocking-list" data-show="further-bl ocking-modal"> | 90 </div> |
74 <span class="icon icon-add"></span><span class="i18n_options_f urtherBlocking_add text-blue"><span> | 91 </div> |
75 </div> | 92 <div id="further-blocking"> |
76 </div> | 93 <p class="option-name"> |
77 </div> | 94 <strong class="i18n_options_furtherBlocking_title"></strong> |
78 </div> | 95 <a class="i18n_options_readMore tooltip" target="_blank"></a> |
79 </div> | 96 </p> |
80 | 97 <div id="custom-wrapper"> |
81 <div> | 98 <ul id="recommend-list-table" class="table list"> |
82 <h1 class="i18n_options_exception"></h1> | 99 <template> |
83 <hr> | 100 <input type="checkbox" class=control /> |
84 <div class="flex-container"> | 101 <span class="display"></span> |
85 <div class="left" id="acceptable-ads"> | 102 <span class="popular"></span> |
86 <p class="option-name"><b class="i18n_options_acceptableAds_title" ></b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p> | 103 </template> |
87 <ul class="table list"> | 104 </ul> |
88 <li><input type='checkbox'/><label id="allow-whitelist-cb"></lab el><span>Allow some non-intrusive advertising</span></li> | 105 <ul id="custom-list-table" class="table list"> |
Thomas Greiner
2015/01/22 17:56:30
Use " instead of ' for consistency
Thomas Greiner
2015/01/22 17:56:30
Actually, the <span> should be the label for the c
saroyanm
2015/01/23 18:18:39
Done.
saroyanm
2015/01/23 18:18:39
Yes for now, It make sense to change with span, be
Thomas Greiner
2015/01/26 18:29:17
That's not what I meant. I thought more of somethi
| |
89 </ul> | 106 <template> |
90 </div> | 107 <input type="checkbox" class="control" /> |
91 <div id="whitelisting"> | 108 <span class="display"></span> |
92 <p class="option-name"><b class="i18n_options_whitelisted_title">< /b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p> | 109 </template> |
93 <ul class="table list" id="whitelisting-table"></ul> | 110 </ul> |
94 <hr> | 111 </div> |
95 <div class="controls"> | 112 <div class="controls"> |
96 <span class="icon icon-add" id="whitelisting-add-icon"></span> | 113 <button id="add-blocking-list"> |
97 <input type="text" id="whitelisting-textbox" /> | 114 <span class="icon icon-add"></span> |
98 <span class="icon icon-enter" id="whitelisting-enter-icon"></spa n> | 115 <span class="i18n_options_furtherBlocking_add"><span> |
99 </div> | 116 </button> |
100 <div style="display: flex;"> | 117 </div> |
Thomas Greiner
2015/01/22 17:56:30
All styles should be inside a CSS file to separate
saroyanm
2015/01/23 18:18:39
Done.
| |
101 <button class="addbtn" id="whitelisting-add-btn">+<span class="i 18n_options_btn_add"></span></button> | 118 </div> |
Thomas Greiner
2015/01/22 17:56:30
Why not "button-add"? That should be more consiste
saroyanm
2015/01/23 18:18:39
Done.
| |
102 <span style="flex: 1;"></span> | 119 </div> |
103 <button class="i18n_options_btn_cancel cancelbtn" id="whitelisti ng-cancel-btn"></button> | 120 </div> |
104 </div> | 121 <div> |
105 </div> | 122 <h1 class="i18n_options_exceptions_title"></h1> |
106 </div> | 123 <div class="flex-container"> |
107 </div> | 124 <div id="acceptable-ads"> |
108 </div> | 125 <p class="option-name"> |
126 <strong class="i18n_options_acceptableAds_title"></strong> | |
127 <a class="i18n_options_readMore tooltip" target="_blank"></a> | |
128 </p> | |
129 <ul id="acceptableads-table" class="table list"> | |
130 <template> | |
131 <input type="checkbox" class="control" /> | |
132 <span class="display"></span> | |
133 </template> | |
134 </ul> | |
135 </div> | |
136 <div id="whitelisting"> | |
137 <p class="option-name"> | |
138 <strong class="i18n_options_whitelisted_title"></strong> | |
139 <a class="i18n_options_readMore tooltip" target="_blank"></a> | |
140 </p> | |
141 <ul id="whitelisting-table" class="table list"> | |
142 <template> | |
143 <button class="delete control"></button> | |
144 <span class="display"></span> | |
145 </template> | |
146 </ul> | |
147 <div class="controls"> | |
148 <div> | |
149 <span id="whitelisting-add-icon" class="icon icon-add"></spa n> | |
150 <input type="text" id="whitelisting-textbox" /> | |
151 <span id="whitelisting-enter-icon" class="icon icon-enter">< /span> | |
152 </div> | |
153 <div> | |
154 <button id="whitelisting-add-button" class="button-add"> | |
155 +<span class="i18n_options_button_add"></span> | |
156 </button> | |
157 <span></span> | |
158 <button id="whitelisting-cancel-button" class="i18n_options_ button_cancel cancel-button"></button> | |
159 </div> | |
160 </div> | |
161 </div> | |
162 </div> | |
163 </div> | |
164 </div> | |
165 | |
166 <!-- Advanced tab content --> | |
109 <div id="content-advanced"> | 167 <div id="content-advanced"> |
110 <div> | 168 <div> |
111 <h1 class="i18n_options_tweaks"></h1> | 169 <h1><span class="i18n_options_tweaks_title"></span><a class="i18n_op tions_readMore tooltip" href="#"></a></h1> |
112 <a class="i18n_options_readMore dotted" href="#"></a> | |
113 <hr /> | |
114 <ul class="table" style="width: auto;"> | 170 <ul class="table" style="width: auto;"> |
115 <li> | 171 <li> |
116 <input type='checkbox' id="easylist"/><label for="easylist"></la bel><span class="i18n_options_tweaks_blockElement"></span> <a class="i18n_option s_tweaks_blockElement_highlight dotted" href="#" target="_blank"></a></li> | 172 <input type="checkbox" id="easylist"/><span id="block-element-ex planation" class="i18n_options_tweaks_blockElement"></span></li> |
117 </ul> | 173 </ul> |
118 </div> | 174 </div> |
119 <div> | 175 <div> |
120 <h1 class="i18n_options_blockingList"></h1> | 176 <h1><span class="i18n_options_blockingList_title"></span><a class="i 18n_options_readMore tooltip" href="#" target="_blank"></a></h1> |
121 <a class="i18n_options_readMore dotted" href="#" target="_blank"></a > | 177 <ul id="blocking-list-tabs" class="tabs horizontal"> |
122 <hr /> | |
123 <ul class="tabs horizontal" id="blocking-list-tabs"> | |
124 <li class="i18n_options_tab_overview active" data-show="blocking-l ist-overview"></li><li class="i18n_options_tab_ownList" data-show="blocking-list -own"></li> | 178 <li class="i18n_options_tab_overview active" data-show="blocking-l ist-overview"></li><li class="i18n_options_tab_ownList" data-show="blocking-list -own"></li> |
125 </ul> | 179 </ul> |
126 <div id="blocking-list"> | 180 <div id="blocking-list"> |
127 <div id="blocking-list-overview"> | 181 <div id="blocking-list-overview"> |
128 <ul class="table cols" style="width: auto;"> | 182 <ul class="table cols" style="width: auto;"> |
129 <li class="col-name"><span class="i18n_options_tableCol_name"> </span><span class="i18n_options_tableCol_description"></span><span class="i18n_ options_tableCol_date"></span></li> | 183 <li class="col-name"><span class="i18n_options_tableCol_name"> </span><span class="i18n_options_tableCol_description"></span><span class="i18n_ options_tableCol_date"></span></li> |
130 <li><input type='checkbox' id="easylist"/><label for="easylist "></label><span>Easylist</span><span>Adblocking english sites</span><span>15 Mar ch 14 - 10:31</span></li> | 184 <li><input type="checkbox" id="easylist"/><span>Easylist</span ><span>Adblocking english sites</span><span>15 March 14 - 10:31</span></li> |
131 <li><input type='checkbox' id="easylist+de"/><label for="easyl ist+de"></label><span>Easylist Germany + Easylist</span><span>Adblocking english + german sites</span><span>15 March 14 - 10:31</span></li> | 185 <li><input type="checkbox" id="easylist+de"/><span>Easylist Ge rmany + Easylist</span><span>Adblocking english + german sites</span><span>15 Ma rch 14 - 10:31</span></li> |
132 <li><input type='checkbox' id="annoyance-fb"/><label for="anno yance-fb"></label><span>Facebook annoyance blocker</span><span>Blocks Facebook a nnoyances</span><span>15 March 14 - 10:31</span></li> | 186 <li><input type="checkbox" id="annoyance-fb"/><span>Facebook a nnoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li> |
133 <li><input type='checkbox' id="annoyance-youtube"/><label for= "annoyance-youtube"></label><span>Facebook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li> | 187 <li><input type="checkbox" id="annoyance-youtube"/><span>Faceb ook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 Marc h 14 - 10:31</span></li> |
134 <li><input type='checkbox' id="own-list"/><label for="own-list "></label><span>Own blocking list</span><span>Your own blocking list</span><span ><a href="#">edit your blocking list</a></span></li> | 188 <li><input type="checkbox" id="own-list"/><span>Own blocking l ist</span><span>Your own blocking list</span><span><a href="#">edit your blockin g list</a></span></li> |
135 </ul> | 189 </ul> |
136 <hr class=""/> | 190 <div class="controls"> |
137 <div class="controls"> | 191 <button> |
138 <div class="button"> | 192 <span class="icon icon-add"></span><span class="i18n_options _blockingList_add"></span> |
139 <span class="icon icon-add"></span><span class="i18n_options _blockingList_add text-blue"></span> | 193 </button> |
140 </div> | 194 <button> |
141 <div class="button"> | 195 <span class="icon icon-update"></span><span class="i18n_opti ons_blockingList_update"></span> |
142 <span class="icon icon-update"></span><span class="i18n_opti ons_blockingList_update text-blue"></span> | 196 </button> |
143 </div> | |
144 </div> | 197 </div> |
145 </div> | 198 </div> |
146 <div id="blocking-list-own"> | 199 <div id="blocking-list-own"> |
147 <p class="i18n_options_blockingRules"></p> | 200 <p class="i18n_options_blockingRules"></p> |
148 <ul class="table list"> | 201 <ul class="table list"> |
149 <li><span>zap2it.com##.zc-station-position</span></li> | 202 <li><span>zap2it.com##.zc-station-position</span></li> |
150 <li><span>downturk.net##.zippo</span></li> | 203 <li><span>downturk.net##.zippo</span></li> |
151 <li><span>yahoo.com##.y708-promo-middle</span></li> | 204 <li><span>yahoo.com##.y708-promo-middle</span></li> |
152 <li><span>reflector.com##.yahooboss</span></li> | 205 <li><span>reflector.com##.yahooboss</span></li> |
153 <li><span>yardbarker.com##.yard_leader</span></li> | 206 <li><span>yardbarker.com##.yard_leader</span></li> |
154 <li><span>espn.co.uk##.will_hill</span></li> | 207 <li><span>espn.co.uk##.will_hill</span></li> |
155 <li><span>listverse.com##.wiki</span></li> | 208 <li><span>listverse.com##.wiki</span></li> |
156 <li><span>planet5d.com##.wp-image-1573</span></li> | 209 <li><span>planet5d.com##.wp-image-1573</span></li> |
157 <li><span>buzzinn.net##.wpn_finner</span></li> | 210 <li><span>buzzinn.net##.wpn_finner</span></li> |
158 <li><span>talkers.com##.wpss_slideshow</span></li> | 211 <li><span>talkers.com##.wpss_slideshow</span></li> |
159 </ul> | 212 </ul> |
160 <div class="controls" style="margin: 0px;"> | 213 <div class="controls" style="margin: 0px;"> |
161 <input type="text" placeholder="add your blocking rule here"/> | 214 <input type="text" placeholder="add your blocking rule here"/> |
162 <div class="input-control"> | 215 <div class="input-control"> |
163 <span class="input-separator"></span> | 216 <span class="input-separator"></span> |
164 <span class="i18n_options_btn_add input-btn-text"></span> | 217 <span class="i18n_options_button_add input-button-text"></sp an> |
165 <span class="icon icon-enter-blue"></span> | 218 <span class="icon icon-enter-blue"></span> |
166 </div> | 219 </div> |
167 </div> | 220 </div> |
168 <div class="controls button"> | 221 <div class="controls"> |
169 <span class="icon icon-edit"></span> | 222 <button> |
170 <span class="i18n_options_blockingRules_edit text-blue"></span > | 223 <span class="icon icon-edit"></span> |
171 </div> | 224 <span class="i18n_options_blockingRules_edit"></span> |
172 </div> | 225 </button> |
173 </div> | 226 </div> |
174 </div> | 227 </div> |
175 </div> | 228 </div> |
229 </div> | |
230 </div> | |
231 | |
232 <!-- Help tab content --> | |
176 <div id="content-help"> | 233 <div id="content-help"> |
177 <h1>1. <span class="i18n_options_faq"></span></h1> | 234 <h1 class="i18n_options_faq_title"></h1> |
Thomas Greiner
2015/01/22 17:56:30
No need to do manual enumeration. Just use <ol> or
saroyanm
2015/01/23 18:18:39
Done.
| |
178 <hr /> | |
179 <p class="i18n_options_faq_description"></p> | 235 <p class="i18n_options_faq_description"></p> |
180 <p> | 236 <p> |
181 <span class="icon icon-arrow"></span> | 237 <a class="i18n_options_faq_title" href="#" target="_blank"></a> |
Thomas Greiner
2015/01/22 17:56:30
This can be added using the "::before" pseudo elem
saroyanm
2015/01/23 18:18:39
Done.
| |
182 <a class="i18n_options_faq_link text-blue" href="#" target="_blank" ></a> | |
183 </p> | 238 </p> |
184 <h1>2. <span class="i18n_options_forum"></span></h1> | 239 <h1 class="i18n_options_forum_title"></h1> |
185 <hr /> | |
186 <p class="i18n_options_forum_description"></p> | 240 <p class="i18n_options_forum_description"></p> |
187 <p> | 241 <p> |
188 <span class="icon icon-arrow"></span> | 242 <a class="i18n_options_forum_link" href="#" target="_blank"></a> |
189 <a class="i18n_options_forum_link text-blue" href="#" target="_blan k"></a> | |
190 </p> | 243 </p> |
191 <h1>3. <span class="i18n_options_media"></span></h1> | 244 <h1 class="i18n_options_media_title"></h1> |
192 <hr /> | |
193 <p class="i18n_options_media_description"></p> | 245 <p class="i18n_options_media_description"></p> |
194 <p> | 246 <p> |
195 <span class="icon icon-arrow"></span> | 247 <a href="#" target="_blank">Twitter</a> |
196 <a class="text-blue" href="#" target="_blank">Twitter</a> | 248 <a href="#" target="_blank">Facebook</a> |
197 <span class="icon icon-arrow"></span> | 249 <a href="#" target="_blank">Google+</a> |
198 <a class="text-blue" href="#" target="_blank">Facebook</a> | |
199 <span class="icon icon-arrow"></span> | |
200 <a class="text-blue" href="#" target="_blank">Google+</a> | |
201 </p> | 250 </p> |
202 </div> | 251 </div> |
203 </div> | 252 </div> |
204 </div> | 253 </div> |
205 <div id="modal" style="display: block;"> | 254 |
206 <div> | 255 <!-- Dialog --> |
Thomas Greiner
2015/01/22 17:56:30
We use two spaces for indentation.
saroyanm
2015/01/23 18:18:39
Done.
| |
207 <div class="header"> | 256 <div id="dialog"> |
Thomas Greiner
2015/01/22 17:56:30
Use the <header> element instead to stick to stand
saroyanm
2015/01/23 18:18:39
Done.
| |
257 <header> | |
258 <span id="dialog-title"> | |
259 <span id="dialog-title-customlist" class="i18n_options_dialog_customli st_title"></span> | |
260 <span id="dialog-title-language" class="i18n_options_dialog_language_t itle"></span> | |
261 </span> | |
262 <button id="dialog-close" class="i18n_options_close"></button> | |
263 </header> | |
264 <div id="dialog-body" class="content"> | |
265 <!-- Add other website language: Dialog --> | |
266 <div id="dialog-content-language" class="dialog-content"> | |
267 <div class="dialog-content-block"> | |
268 <h3 class="i18n_options_dialog_language_added"></h3> | |
269 <ul id="blocking-languages-dialog-table" class="table list"> | |
270 <template> | |
271 <span class="display"></span> | |
272 </template> | |
273 </ul> | |
274 </div> | |
275 <div id="other-language" class="dialog-content-block"> | |
276 <h3 class="i18n_options_dialog_language_other"></h3> | |
208 <div> | 277 <div> |
209 <div> | 278 <input type="search" id="find-language" /> |
210 <span id="modal-title"></span> | 279 </div> |
Thomas Greiner
2015/01/22 17:56:30
This structure is quite confusing and looks somewh
saroyanm
2015/01/23 18:18:39
Thanks, should be better now.
| |
211 </div> | 280 <ul id="all-lang-table" class="table list"> |
212 <div class="close-wrapper"> | 281 <template> |
213 <span class="separator"></span> | 282 <button class="button-add control"> |
Thomas Greiner
2015/01/22 17:56:30
I guess this can be achieved using a border.
saroyanm
2015/01/23 18:18:39
Done.
| |
214 <div class="button" id="modal-close"> | 283 +<span></span> |
215 <span class="icon icon-close"></span> | 284 </button> |
216 <span class="i18n_options_close close"></span> | 285 <span class="display"></span> |
217 </div> | 286 </template> |
218 </div> | 287 </ul> |
219 </div> | 288 </div> |
220 </div> | 289 </div> |
221 <div class="content" id="modal-content"> | 290 <!-- Add other blocking list: Dialog --> |
Thomas Greiner
2015/01/22 17:56:30
What about the dialog for "abp:subscribe" links? I
saroyanm
2015/01/23 18:18:39
I thought it should be same dialog.
Can you pleas
Thomas Greiner
2015/01/26 18:29:17
I asked Sven to attach it to the issue description
| |
222 <div style="display: none;" id="blocking-languages-modal" data-title ="options_modal_language_title"> | 291 <div id="dialog-content-customlist" class="dialog-content"> |
Thomas Greiner
2015/01/22 17:56:30
What do you need the "data-title" attribute here f
saroyanm
2015/01/23 18:18:39
I'm using that attribute to change the title of mo
Thomas Greiner
2015/01/26 18:29:17
You could achieve the same effect using a CSS clas
| |
223 <div> | 292 <div class="dialog-content-block"> |
224 <h3 class="i18n_options_modal_language_added"></h3> | 293 <h3 class="i18n_options_dialog_customlist_subscription_title"></h3> |
225 <ul class="table list" id="blocking-languages-modal-table"></ul> | 294 <div> |
226 </div> | 295 <input id="blockingList-textbox" type="text" placeholder="www.exam ple.com/blockinglist.txt" /> |
227 <div id="other-language"> | 296 </div> |
228 <h3 class="i18n_options_modal_language_other"></h3> | 297 <div id="import-blockingList-button" class="button-wrapper"> |
229 <div> | 298 <span class="icon icon-arrow"></span> |
230 <input type="text" placeholder="find language" id="find-langua ge" /> | 299 <span class="i18n_options_dialog_customlist_import"></span> |
231 </div> | 300 </div> |
232 <ul class="table list" id="all-lang-table"></ul> | 301 </div> |
233 </div> | 302 <div class="dialog-content-block"> |
234 </div> | 303 <h3 class="i18n_options_dialog_edit_own_list"></h3> |
235 <div style="display: none;" id="further-blocking-modal" data-title=" options_modal_blocklist_title"> | 304 <div id="edit-ownBlockingList-button" class="button-wrapper"> |
236 <div> | 305 <span class="icon icon-arrow"></span> |
237 <h3 class="i18n_options_modal_blocklist_subscription_title"></h3 > | 306 <span class="i18n_options_dialog_create_own_list"></span> |
238 <div> | |
239 <input id="blockingList-textbox" type="text" placeholder="www. yourURL.com/blockinglist.txt" /> | |
240 </div> | |
241 <div class="btn-wrapper" id="import-blockingList-btn"> | |
242 <span class="icon icon-arrow"></span> | |
243 <span class="i18n_options_modal_blocklist_import text-blue"></ span> | |
244 </div> | |
245 </div> | |
246 <div> | |
247 <h3 class="i18n_options_modal_edit_own_list"></h3> | |
248 <div class="btn-wrapper" id="edit-ownBlockingList-btn"> | |
249 <span class="icon icon-arrow"></span> | |
250 <span class="i18n_options_modal_create_own_list text-blue"></s pan> | |
251 </div> | |
252 </div> | |
253 </div> | 307 </div> |
254 </div> | 308 </div> |
255 </div> | 309 </div> |
256 </div> | 310 </div> |
311 </div> | |
257 </body> | 312 </body> |
258 </html> | 313 </html> |
LEFT | RIGHT |