options.html - Issue 6088024630755328: issue 1526 - Implement new options page design for Chrome/Opera/Safari

Side by Side Diff: options.html

Issue 6088024630755328: issue 1526 - Implement new options page design for Chrome/Opera/Safari (Closed)

Patch Set: Created Jan. 21, 2015, 6:52 p.m.

Left:
Right:

Use n/p to move between diff chunks; N/P to move between comments.

Jump to:

View unified diff | Download patch

OLD	NEW
(Empty)
	1 <!DOCTYPE html>
	Thomas Greiner 2015/01/22 17:56:30 This page contains a couple of subpages so I'd fin This page contains a couple of subpages so I'd find it helpful to have comments to mark when the code for the General, Advanced and Help tabs begin. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > This page contains a couple of subpages so I'd find it helpful to have comments > to mark when the code for the General, Advanced and Help tabs begin. Done.
	2 <!--

	3 - This file is part of Adblock Plus <http://adblockplus.org/>,
	Thomas Greiner 2015/01/22 17:56:30 Nit: Change to "https" Nit: Change to "https" saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Nit: Change to "https" Done.
	4 - Copyright (C) 2006-2015 Eyeo GmbH

	5 -

	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

	8 - published by the Free Software Foundation.

	9 -

	10 - Adblock Plus is distributed in the hope that it will be useful,

	11 - but WITHOUT ANY WARRANTY; without even the implied warranty of

	12 - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

	13 - GNU General Public License for more details.

	14 -

	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/>.

	17 -->

	18

	19 <html>

	20 <head>

	21 <meta charset="utf-8">

	22 <title class="i18n_options_page_title"></title>

	23 <link rel="stylesheet" href="skin/options.css">

	24 <script type="text/javascript" src="ext/common.js"></script>
	Thomas Greiner 2015/01/22 17:56:30 No need to specify the <script> type No need to specify the <script> type saroyanm 2015/01/23 18:18:39 Done. We are using type attribute also in other HT Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > No need to specify the <script> type Done. We are using type attribute also in other HTML files, should we also remove them for consistency ? Thomas Greiner 2015/01/26 18:29:17 No, we usually take care of inconsistencies when s Show quoted text On 2015/01/23 18:18:39, saroyanm wrote: > On 2015/01/22 17:56:30, Thomas Greiner wrote: > > No need to specify the <script> type > > Done. > We are using type attribute also in other HTML files, should we also remove them > for consistency ? No, we usually take care of inconsistencies when someone's working at a specific file in a review.
	25 <script type="text/javascript" src="ext/content.js"></script>

	26 <script type="text/javascript" src="i18n.js"></script>

	27 <script type="text/javascript" src="options.js"></script>

	28 </head>

	29 <body>

	30 <div id="left-sidebar">

	31 <div id="fixed-sidebar" class="fixed">

	32 <div id="page-title">

	33 <p class="i18n_options_page_name"></p>

	34 <h1>Adblock <b>Plus</b></h1>
	Thomas Greiner 2015/01/22 17:56:30 This text needs to be taken from "locale/en-US/opt This text needs to be taken from "locale/en-US/options.json" saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > This text needs to be taken from "locale/en-US/options.json" Done.
	35 </div>

	36 <ul class="tabs vertical" id="main-navigation-tabs">

	37 <li id="tab-general" data-show="content-general" class="active"><span class="i18n_options_tab_general"></span><span class="icon"></span></li>
	Thomas Greiner 2015/01/22 17:56:30 Don't put every list item in one single line to im Don't put every list item in one single line to improve legibility. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Don't put every list item in one single line to improve legibility. Done.
	38 <li id="tab-advanced" data-show="content-advanced"><span class="i18n_o ptions_tab_advanced"></span><span class="icon"></span></li>

	39 <li id="tab-help" data-show="content-help"><span class="i18n_options_t ab_help"></span><span class="icon"></span></li>

	40 </ul>

	41 <p class="nav-blue">
	Thomas Greiner 2015/01/22 17:56:30 Don't include colors in class names because the co Don't include colors in class names because the color might change. Rather use more generic names like "nav-link". saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Don't include colors in class names because the color might change. Rather use > more generic names like "nav-link". Done.
	42 <span class="i18n_options_version"></span> <span id="version">2.5.10</ span>
	Thomas Greiner 2015/01/22 17:56:30 Don't hardcode the version number. Request it from Don't hardcode the version number. Request it from the background page using: ext.backgroundPage.sendMessage({ method: "app.get", what: "addonVersion" }, function(addonVersion) { ... }); I'll add the required backend code for that. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Don't hardcode the version number. Request it from the background page using: > > ext.backgroundPage.sendMessage({ > method: "app.get", > what: "addonVersion" > }, function(addonVersion) > { > ... > }); > > I'll add the required backend code for that. Done.
	43 </p>

	44 <ul class="tabs vertical bottom">

	45 <li id="tab-share"><span class="i18n_options_tab_share"></span><span c lass="icon"></span></li>

	46 <li id="tab-donate"><span class="i18n_options_tab_donate"></span><span class="icon"></span></li>

	47 </ul>

	48 </div>

	49 </div>

	50 <div id="tab-content">

	51 <div id="content-wrapper">

	52 <div id="modal-background"></div>

	53 <div id="content-general">

	54 <div>
	Thomas Greiner 2015/01/22 17:56:30 You're wrapping everything inside a <div> but don' You're wrapping everything inside a <div> but don't indent it… that raises the question: Is this <div> really necessary? saroyanm 2015/01/23 18:18:39 Thanks, indentation was missing it wraps Blocking Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > You're wrapping everything inside a <div> but don't indent it… that raises the > question: Is this <div> really necessary? Thanks, indentation was missing it wraps Blocking and Exception sections, for consistency.
	55 <h1 class="i18n_options_blocking"></h1>

	56 <hr>
	Thomas Greiner 2015/01/22 17:56:30 You could use "border-bottom" instead of <hr> here You could use "border-bottom" instead of <hr> here and for any other occurence. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > You could use "border-bottom" instead of <hr> here and for any other occurence. Done.
	57 <div class="flex-container">

	58 <div id="blocking-languages" class="left">
	Thomas Greiner 2015/01/22 17:56:30 Don't use "left" or "right" in class names since w Don't use "left" or "right" in class names since we're building a page that will also work in an RTL environment so "left" could actually be "right" and vice versa. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Don't use "left" or "right" in class names since we're building a page that will > also work in an RTL environment so "left" could actually be "right" and vice > versa. 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>
	Thomas Greiner 2015/01/22 17:56:30 Generally, we avoid using HTML elements that conve Generally, we avoid using HTML elements that convey styling. So please use <strong> instead of <b>. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Generally, we avoid using HTML elements that convey styling. So please use > <strong> instead of <b>. Done.
	60 <ul class="table list" id="blocking-languages-table"></ul>

	61 <hr>

	62 <div class="controls">

	63 <div class="button" id="add-website-language" data-show="blockin g-languages-modal">
	Thomas Greiner 2015/01/22 17:56:30 It'd be great if you could use standard HTML eleme It'd be great if you could use standard HTML elements like <button> for this to keep it accessible. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > It'd be great if you could use standard HTML elements like <button> for this to > keep it accessible. Done.
	64 <span class="icon icon-add"></span><span class="i18n_options_l anguage_add text-blue"></span>

	65 </div>

	66 </div>

	67 </div>

	68 <div id="further-blocking">

	69 <p class="option-name"><b class="i18n_options_furtherBlocking_titl e"></b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p >
	Thomas Greiner 2015/01/22 17:56:30 Again, don't use implementation specific details l Again, don't use implementation specific details like "dotted" in class names. Those might change at any point. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Again, don't use implementation specific details like "dotted" in class names. > Those might change at any point. Done.
	70 <ul class="table list" id="further-list-table"></ul>

	71 <hr>

	72 <div class="controls">

	73 <div class="button" id="add-blocking-list" data-show="further-bl ocking-modal">

	74 <span class="icon icon-add"></span><span class="i18n_options_f urtherBlocking_add text-blue"><span>

	75 </div>

	76 </div>

	77 </div>

	78 </div>

	79 </div>

	80

	81 <div>

	82 <h1 class="i18n_options_exception"></h1>

	83 <hr>

	84 <div class="flex-container">

	85 <div class="left" id="acceptable-ads">

	86 <p class="option-name"><b class="i18n_options_acceptableAds_title" ></b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p>

	87 <ul class="table list">

	88 <li><input type='checkbox'/><label id="allow-whitelist-cb"></lab el><span>Allow some non-intrusive advertising</span></li>
	Thomas Greiner 2015/01/22 17:56:30 Use " instead of ' for consistency Use " instead of ' for consistency Thomas Greiner 2015/01/22 17:56:30 Actually, the <span> should be the label for the c Actually, the <span> should be the label for the checkbox. That's at least what <label> is intended for. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Use " instead of ' for consistency Done. saroyanm 2015/01/23 18:18:39 Yes for now, It make sense to change with span, be Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Actually, the <span> should be the label for the checkbox. That's at least what > <label> is intended for. Yes for now, It make sense to change with span, beforehand were using for labeled control. Thomas Greiner 2015/01/26 18:29:17 That's not what I meant. I thought more of somethi Show quoted text On 2015/01/23 18:18:39, saroyanm wrote: > On 2015/01/22 17:56:30, Thomas Greiner wrote: > > Actually, the <span> should be the label for the checkbox. That's at least > what > > <label> is intended for. > > Yes for now, It make sense to change with span, beforehand were using for > labeled control. That's not what I meant. I thought more of something along the lines of: <li> <label id="allow-whitelist"> <input type="checkbox"> Allow some non-intrusive advertising </label> </li> - <input> will be hidden anyway - <label> used as markup for <input> - icon can be added using "::before" CSS pseudo element (this technique can also be used for other icons on that page like you did with the link icons for the help tab)
	89 </ul>

	90 </div>

	91 <div id="whitelisting">

	92 <p class="option-name"><b class="i18n_options_whitelisted_title">< /b> <a class="i18n_options_readMore dotted" href="#" target="_blank"></a></p>

	93 <ul class="table list" id="whitelisting-table"></ul>

	94 <hr>

	95 <div class="controls">

	96 <span class="icon icon-add" id="whitelisting-add-icon"></span>

	97 <input type="text" id="whitelisting-textbox" />

	98 <span class="icon icon-enter" id="whitelisting-enter-icon"></spa n>

	99 </div>

	100 <div style="display: flex;">
	Thomas Greiner 2015/01/22 17:56:30 All styles should be inside a CSS file to separate All styles should be inside a CSS file to separate structure and styles. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > All styles should be inside a CSS file to separate structure and styles. Done.
	101 <button class="addbtn" id="whitelisting-add-btn">+<span class="i 18n_options_btn_add"></span></button>
	Thomas Greiner 2015/01/22 17:56:30 Why not "button-add"? That should be more consiste Why not "button-add"? That should be more consistent with the other class names you're using. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Why not "button-add"? That should be more consistent with the other class names > you're using. Done.
	102 <span style="flex: 1;"></span>

	103 <button class="i18n_options_btn_cancel cancelbtn" id="whitelisti ng-cancel-btn"></button>

	104 </div>

	105 </div>

	106 </div>

	107 </div>

	108 </div>

	109 <div id="content-advanced">

	110 <div>

	111 <h1 class="i18n_options_tweaks"></h1>

	112 <a class="i18n_options_readMore dotted" href="#"></a>

	113 <hr />

	114 <ul class="table" style="width: auto;">

	115 <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>

	117 </ul>

	118 </div>

	119 <div>

	120 <h1 class="i18n_options_blockingList"></h1>

	121 <a class="i18n_options_readMore dotted" href="#" target="_blank"></a >

	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>

	125 </ul>

	126 <div id="blocking-list">

	127 <div id="blocking-list-overview">

	128 <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>

	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>

	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>

	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>

	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>

	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>

	135 </ul>

	136 <hr class=""/>

	137 <div class="controls">

	138 <div class="button">

	139 <span class="icon icon-add"></span><span class="i18n_options _blockingList_add text-blue"></span>

	140 </div>

	141 <div class="button">

	142 <span class="icon icon-update"></span><span class="i18n_opti ons_blockingList_update text-blue"></span>

	143 </div>

	144 </div>

	145 </div>

	146 <div id="blocking-list-own">

	147 <p class="i18n_options_blockingRules"></p>

	148 <ul class="table list">

	149 <li><span>zap2it.com##.zc-station-position</span></li>

	150 <li><span>downturk.net##.zippo</span></li>

	151 <li><span>yahoo.com##.y708-promo-middle</span></li>

	152 <li><span>reflector.com##.yahooboss</span></li>

	153 <li><span>yardbarker.com##.yard_leader</span></li>

	154 <li><span>espn.co.uk##.will_hill</span></li>

	155 <li><span>listverse.com##.wiki</span></li>

	156 <li><span>planet5d.com##.wp-image-1573</span></li>

	157 <li><span>buzzinn.net##.wpn_finner</span></li>

	158 <li><span>talkers.com##.wpss_slideshow</span></li>

	159 </ul>

	160 <div class="controls" style="margin: 0px;">

	161 <input type="text" placeholder="add your blocking rule here"/>

	162 <div class="input-control">

	163 <span class="input-separator"></span>

	164 <span class="i18n_options_btn_add input-btn-text"></span>

	165 <span class="icon icon-enter-blue"></span>

	166 </div>

	167 </div>

	168 <div class="controls button">

	169 <span class="icon icon-edit"></span>

	170 <span class="i18n_options_blockingRules_edit text-blue"></span >

	171 </div>

	172 </div>

	173 </div>

	174 </div>

	175 </div>

	176 <div id="content-help">

	177 <h1>1. <span class="i18n_options_faq"></span></h1>
	Thomas Greiner 2015/01/22 17:56:30 No need to do manual enumeration. Just use <ol> or No need to do manual enumeration. Just use <ol> or CSS counters (see https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Counters). saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > No need to do manual enumeration. Just use <ol> or CSS counters (see > https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Counters). Done.
	178 <hr />

	179 <p class="i18n_options_faq_description"></p>

	180 <p>

	181 <span class="icon icon-arrow"></span>
	Thomas Greiner 2015/01/22 17:56:30 This can be added using the "::before" pseudo elem This can be added using the "::before" pseudo element to ensure consistency for all similar links. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > This can be added using the "::before" pseudo element to ensure consistency for > all similar links. Done.
	182 <a class="i18n_options_faq_link text-blue" href="#" target="_blank" ></a>

	183 </p>

	184 <h1>2. <span class="i18n_options_forum"></span></h1>

	185 <hr />

	186 <p class="i18n_options_forum_description"></p>

	187 <p>

	188 <span class="icon icon-arrow"></span>

	189 <a class="i18n_options_forum_link text-blue" href="#" target="_blan k"></a>

	190 </p>

	191 <h1>3. <span class="i18n_options_media"></span></h1>

	192 <hr />

	193 <p class="i18n_options_media_description"></p>

	194 <p>

	195 <span class="icon icon-arrow"></span>

	196 <a class="text-blue" href="#" target="_blank">Twitter</a>

	197 <span class="icon icon-arrow"></span>

	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>

	202 </div>

	203 </div>

	204 </div>

	205 <div id="modal" style="display: block;">

	206 <div>
	Thomas Greiner 2015/01/22 17:56:30 We use two spaces for indentation. We use two spaces for indentation. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > We use two spaces for indentation. Done.
	207 <div class="header">
	Thomas Greiner 2015/01/22 17:56:30 Use the <header> element instead to stick to stand Use the <header> element instead to stick to standard markup. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > Use the <header> element instead to stick to standard markup. Done.
	208 <div>

	209 <div>

	210 <span id="modal-title"></span>
	Thomas Greiner 2015/01/22 17:56:30 This structure is quite confusing and looks somewh This structure is quite confusing and looks somewhat redundant. Can't you trim it down? saroyanm 2015/01/23 18:18:39 Thanks, should be better now. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > This structure is quite confusing and looks somewhat redundant. Can't you trim > it down? Thanks, should be better now.
	211 </div>

	212 <div class="close-wrapper">

	213 <span class="separator"></span>
	Thomas Greiner 2015/01/22 17:56:30 I guess this can be achieved using a border. I guess this can be achieved using a border. saroyanm 2015/01/23 18:18:39 Done. Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > I guess this can be achieved using a border. Done.
	214 <div class="button" id="modal-close">

	215 <span class="icon icon-close"></span>

	216 <span class="i18n_options_close close"></span>

	217 </div>

	218 </div>

	219 </div>

	220 </div>

	221 <div class="content" id="modal-content">
	Thomas Greiner 2015/01/22 17:56:30 What about the dialog for "abp:subscribe" links? I What about the dialog for "abp:subscribe" links? I know that we had a separate mockup for that one to prevent editing of the filterlist title and URL. saroyanm 2015/01/23 18:18:39 I thought it should be same dialog. Can you pleas Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > What about the dialog for "abp:subscribe" links? I know that we had a separate > mockup for that one to prevent editing of the filterlist title and URL. I thought it should be same dialog. Can you please provide link to that mockup ? Thomas Greiner 2015/01/26 18:29:17 I asked Sven to attach it to the issue description Show quoted text On 2015/01/23 18:18:39, saroyanm wrote: > On 2015/01/22 17:56:30, Thomas Greiner wrote: > > What about the dialog for "abp:subscribe" links? I know that we had a separate > > mockup for that one to prevent editing of the filterlist title and URL. > > I thought it should be same dialog. > Can you please provide link to that mockup ? 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">
	Thomas Greiner 2015/01/22 17:56:30 What do you need the "data-title" attribute here f What do you need the "data-title" attribute here for? saroyanm 2015/01/23 18:18:39 I'm using that attribute to change the title of mo Show quoted text On 2015/01/22 17:56:30, Thomas Greiner wrote: > What do you need the "data-title" attribute here for? I'm using that attribute to change the title of modal window in options.js line 85: E("modal-title").innerHTML = ext.i18n.getMessage(content.dataset.title); Thomas Greiner 2015/01/26 18:29:17 You could achieve the same effect using a CSS clas Show quoted text On 2015/01/23 18:18:39, saroyanm wrote: > On 2015/01/22 17:56:30, Thomas Greiner wrote: > > What do you need the "data-title" attribute here for? > > I'm using that attribute to change the title of modal window in options.js line > 85: > E("modal-title").innerHTML = ext.i18n.getMessage(content.dataset.title); You could achieve the same effect using a CSS class on the div#modal element which would allow you to define via CSS rules which elements/texts are visible and which ones aren't. That class can be set by the JavaScript to show a specific variant of the dialog.
	223 <div>

	224 <h3 class="i18n_options_modal_language_added"></h3>

	225 <ul class="table list" id="blocking-languages-modal-table"></ul>

	226 </div>

	227 <div id="other-language">

	228 <h3 class="i18n_options_modal_language_other"></h3>

	229 <div>

	230 <input type="text" placeholder="find language" id="find-langua ge" />

	231 </div>

	232 <ul class="table list" id="all-lang-table"></ul>

	233 </div>

	234 </div>

	235 <div style="display: none;" id="further-blocking-modal" data-title=" options_modal_blocklist_title">

	236 <div>

	237 <h3 class="i18n_options_modal_blocklist_subscription_title"></h3 >

	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>

	254 </div>

	255 </div>

	256 </div>

	257 </body>

	258 </html>

OLD	NEW

« locale/en-US/options.json ('K') | « locale/en-US/options.json ('k') | options.js » ('j') | options.js » ('J')