desktop-options.html - Issue 29674584: Issue 5549 - Implement missing error handlings for custom filter lists

Delta Between Two Patch Sets: desktop-options.html

Issue 29674584: Issue 5549 - Implement missing error handlings for custom filter lists (Closed)

Left Patch Set: using convertObject Created Jan. 30, 2018, 1:15 p.m.

Right Patch Set: changed custom-filters-edit-area to custom-filters-control as suggested Created Feb. 5, 2018, 9:05 a.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

LEFT	RIGHT
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <!--	2 <!--

3 - This file is part of Adblock Plus <https://adblockplus.org/>,	3 - This file is part of Adblock Plus <https://adblockplus.org/>,

4 - Copyright (C) 2006-present eyeo GmbH	4 - Copyright (C) 2006-present 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,

(...skipping 286 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
297 <h3 class="i18n_options_customFilters_widget_title"></h3>	297 <h3 class="i18n_options_customFilters_widget_title"></h3>

298 <div id="empty-custom-filters">	298 <div id="empty-custom-filters">

299 <p class="i18n_options_customFilters_tip"></p>	299 <p class="i18n_options_customFilters_tip"></p>

300 <button class="i18n_options_customFilters_start primary" data-acti on="edit-custom-filters">	300 <button class="i18n_options_customFilters_start primary" data-acti on="edit-custom-filters">

301 </button>	301 </button>

302 <p>	302 <p>

303 <a class="i18n_options_customFilters_learn" id="link-filters-2" target="_blank"></a>	303 <a class="i18n_options_customFilters_learn" id="link-filters-2" target="_blank"></a>

304 </p>	304 </p>

305 </div>	305 </div>

306 <textarea id="custom-filters-raw" rows="15"></textarea>	306 <textarea id="custom-filters-raw" rows="15"></textarea>

307 <div id="custom-filters-edit-area">	307 <div id="custom-filters-control">

308 <div id="custom-filters-edit-error" class="i18n_options_customFilt ers_edit_error"></div>	308 <div id="custom-filters-edit-error" class="i18n_options_customFilt ers_edit_error"></div>
saroyanm 2018/02/02 12:30:58 Suggestion: In order to keep simplicity, enhance s Suggestion: In order to keep simplicity, enhance semantics and have better accessibility I think we should have here something along the lines: <div class="side-controls"> ... </div> <div role="alert" aria-hidden="true"> <heading></heading> <ul></ul> </div> I do understand that the way this is defined in the specs the implementation is becoming tricky and keeping it simple as well. So if you agree with me I'll suggest this options: Align with Jeen and move the error message below buttons in the specs, so we can keep the implementation simple. This will help us to simplify the CSS implementation as well. (Sorry that I didn't notice this earlier)
309 <div class="side-controls">	309 <div class="side-controls">

310 <button id="custom-filters-edit" class="i18n_options_customFilte r_edit secondary" data-action="edit-custom-filters">	310 <button id="custom-filters-edit" class="i18n_options_customFilte r_edit secondary" data-action="edit-custom-filters">

311 </button>	311 </button>

312 <div id="custom-filters-raw-controls" class="side-controls">	312 <div id="custom-filters-raw-controls" class="side-controls">

313 <button class="i18n_options_customFilter_cancel secondary" dat a-action="cancel-custom-filters"></button>	313 <button class="i18n_options_customFilter_cancel secondary" dat a-action="cancel-custom-filters"></button>

314 <button class="i18n_options_customFilter_save primary" data-ac tion="save-custom-filters"></button>	314 <button class="i18n_options_customFilter_save primary" data-ac tion="save-custom-filters"></button>

315 </div>	315 </div>

316 </div>	316 </div>

317 </div>	317 </div>

318 <ul id="custom-filters-error"></ul>	318 <ul aria-labelledby="custom-filters-edit-error" role="alert" id="cus tom-filters-error"></ul>

319 </div>	319 </div>

320 </section>	320 </section>

321 </div>	321 </div>

322	322

323 <!-- Help tab content -->	323 <!-- Help tab content -->

324 <div id="content-help" role="tabpanel" aria-labelledby="tab-help">	324 <div id="content-help" role="tabpanel" aria-labelledby="tab-help">

325 <header>	325 <header>

326 <h1 class="i18n_options_tab_help"></h1>	326 <h1 class="i18n_options_tab_help"></h1>

327 <p class="i18n_options_help_description"></p>	327 <p class="i18n_options_help_description"></p>

328 </header>	328 </header>

(...skipping 107 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
436 </div>	436 </div>

437 <!-- Notification -->	437 <!-- Notification -->

438 <div id="notification" aria-hidden="true" aria-live="polite">	438 <div id="notification" aria-hidden="true" aria-live="polite">

439 <strong id="notification-text"></strong>	439 <strong id="notification-text"></strong>

440 <button class="icon close secondary" data-action="hide-notification">	440 <button class="icon close secondary" data-action="hide-notification">

441 <span class="i18n_options_notification_hide sr-only"></span>	441 <span class="i18n_options_notification_hide sr-only"></span>

442 </button>	442 </button>

443 </div>	443 </div>

444 </body>	444 </body>

445 </html>	445 </html>

LEFT	RIGHT