Index: new-options.html |
=================================================================== |
--- a/new-options.html |
+++ b/new-options.html |
@@ -30,311 +30,301 @@ |
</head> |
<body data-tab="general"> |
<!-- Navigation sidebar --> |
- <div id="nav-sidebar"> |
- <div id="fixed-sidebar" class="fixed"> |
- <header id="page-title"> |
- <p class="i18n_options_page_header_1"></p> |
- <h1 class="i18n_options_page_header_2"></h1> |
+ <div id="sidebar"> |
+ <div class="fixed"> |
+ <header> |
+ <img id="sidebar-logo" alt="Adblock Plus logo" src="skin/abp-logo.svg"> |
+ <h1> |
+ Adblock <strong>Plus</strong> |
juliandoucette
2017/08/28 11:16:41
NIT: The weight of strong is different in FF and C
saroyanm
2017/08/28 11:39:43
Fixed.
|
+ </h1> |
+ <p class="i18n_options_page_title"></p> |
</header> |
<nav> |
- <ul id="nav-tablist" class="tabs vertical" |
+ <ul class="tabs" |
role="tablist" data-action="switch-tab" |
data-keys="ArrowLeft ArrowUp ArrowRight ArrowDown"> |
- <li id="tab-general" role="tab" data-tab="general" |
- aria-selected="true" aria-controls="content-general" |
- tabindex="0"> |
- <span class="i18n_options_tab_general"></span> |
+ <li role="presentation"> |
+ <a href="#general" class="i18n_options_tab_general" role="tab" aria-selected="true" tabindex="-1" aria-controls="content-general"></a> |
</li> |
- <li id="tab-whitelist" role="tab" data-tab="whitelist" |
- aria-controls="content-whitelist" |
- tabindex="-1"> |
- <span class="i18n_options_tab_whitelist"></span> |
+ <li role="presentation"> |
+ <a href="#whitelist" class="i18n_options_tab_whitelist" role="tab" tabindex="-1" aria-controls="content-whitelist"></a> |
</li> |
- <li id="tab-advanced" role="tab" data-tab="advanced" |
- aria-controls="content-advanced" tabindex="-1"> |
- <span class="i18n_options_tab_advanced"></span> |
+ <li role="presentation"> |
+ <a href="#advanced" class="i18n_options_tab_advanced" role="tab" tabindex="-1" aria-controls="content-advanced"></a> |
</li> |
- <li id="tab-help" role="tab" data-tab="help" |
- aria-controls="content-help" tabindex="-1"> |
- <span class="i18n_options_tab_help"></span> |
+ <li role="presentation"> |
+ <a href="#help" class="i18n_options_tab_help" role="tab" tabindex="-1" aria-controls="content-help"></a> |
</li> |
</ul> |
</nav> |
- |
- <a id="link-version"> |
- <span class="i18n_options_version"></span> |
- <span id="abp-version"></span> |
- </a> |
- |
<footer> |
- <ul class="tabs vertical bottom" data-action="open-doclink" |
- data-keys="Enter"> |
- <li id="tab-share" data-doclink="share-general" tabindex="0"> |
- <span class="i18n_options_tab_share"></span> |
- </li> |
- <li id="tab-contribute" data-doclink="contribute" tabindex="0"> |
- <span class="i18n_options_tab_contribute"></span> |
- </li> |
- </ul> |
- </footer> |
+ <p> |
+ <a id="contribute" |
+ class="i18n_options_footer_contribute button secondary" |
+ target="_blank"></a> |
+ </p> |
+ <p> |
+ <button class="i18n_options_footer_about link" |
+ data-action="open-dialog" data-dialog="about"></button> |
+ </p> |
+ </footer> |
</div> |
</div> |
- <div id="content"> |
- <div id="content-wrapper"> |
- <div id="dialog-background"></div> |
+ <main> |
+ <div id="dialog-background"></div> |
- <!-- General tab content --> |
- <div id="content-general" role="tabpanel" aria-labelledby="tab-general"> |
- <h1 class="i18n_options_tab_general"></h1> |
- <p class="i18n_options_general_description"></p> |
- <section> |
- <h2 class="i18n_options_privacy_header"></h2> |
- <ul id="recommend-protection-list-table" class="table list"> |
+ <!-- General tab content --> |
+ <div id="content-general" role="tabpanel" aria-labelledby="tab-general"> |
+ <h1 class="i18n_options_tab_general"></h1> |
+ <p class="i18n_options_general_description"></p> |
+ <section> |
+ <h2 class="i18n_options_privacy_header"></h2> |
+ <ul id="recommend-protection-list-table" class="table list"> |
+ <template> |
+ <button data-action="toggle-remove-subscription" role="checkbox" class="control"></button> |
+ <label class="display"></label> |
+ <span class="i18n_options_readMore" data-tooltip="options_protection_%value%_tooltip"></span> |
+ </template> |
+ </ul> |
+ </section> |
+ <section> |
+ <h2 class="i18n_options_acceptableAds_header"></h2> |
+ <p class="i18n_options_acceptableAds_description"></p> |
+ <form id="acceptable-ads"> |
+ <div> |
+ <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="ads"> |
+ <label class="i18n_options_acceptableAds_ads_label"></label> |
+ <p id="enable-aa-description" class="i18n_options_acceptableAds_ads_description_1"></p> |
+ <p class="i18n_options_acceptableAds_ads_description_2"></p> |
+ </div> |
+ <div> |
+ <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="privacy"> |
+ <label class="i18n_options_acceptableAds_privacy_label"></label> |
+ <p class="i18n_options_acceptableAds_privacy_description"></p> |
+ <p id="dnt" class="i18n_options_acceptableAds_dnt_notification"></p> |
+ </div> |
+ <div> |
+ <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="none"> |
+ <label class="i18n_options_acceptableAds_none_label"></label> |
+ </div> |
+ </form> |
+ </section> |
+ <section> |
+ <h2 class="i18n_options_language_header"></h2> |
+ <p class="i18n_options_language_description"></p> |
+ <div id="blocking-languages"> |
+ <ul id="blocking-languages-table" class="table list"> |
<template> |
- <button data-action="toggle-remove-subscription" role="checkbox" class="control"></button> |
<label class="display"></label> |
- <span class="i18n_options_readMore" data-tooltip="options_protection_%value%_tooltip"></span> |
+ <button data-single="hidden" data-action="remove-subscription" class="delete control" title="options_control_remove_title"></button> |
+ <button data-single="visible" data-action="open-dialog" data-dialog="language-change" class="i18n_options_language_change"></button> |
</template> |
</ul> |
- </section> |
+ <div class="controls"> |
+ <button data-action="open-dialog" data-dialog="language-add"> |
+ <span class="i18n_options_language_add"></span> |
+ </button> |
+ </div> |
+ </div> |
+ <p class="i18n_options_language_tip"></p> |
+ </section> |
+ <section> |
+ <h2 class="i18n_options_more_filters_header"></h2> |
+ <p class="i18n_options_more_filters_description"></p> |
+ <ul id="custom-list-table" class="table list"> |
+ <template> |
+ <label class="display"></label> |
+ <button data-action="remove-subscription" class="delete control" title="options_control_remove_title"></button> |
+ </template> |
+ </ul> |
+ <p class="i18n_options_more_filters_note"></p> |
+ </section> |
+ </div> |
+ |
+ <!-- Whitelist tab content --> |
+ <div id="content-whitelist" role="tabpanel" aria-labelledby="tab-whitelist"> |
+ <h1 class="i18n_options_tab_whitelist"></h1> |
+ <p class="i18n_options_whitelist_description"></p> |
+ <form> |
+ <input id="whitelisting-textbox" type="text"> |
+ <button id="whitelisting-add-button" |
+ type="submit" |
+ data-action="add-domain-exception" |
+ class="i18n_options_whitelist_add" disabled> |
+ </button> |
+ <div id="whitelisting-validation"></div> |
+ </form> |
+ <ul id="whitelisting-table" class="table list"> |
+ <template> |
+ <label class="display"></label> |
+ <button data-action="remove-filter" class="delete control" |
+ title="options_control_remove_title"> |
+ </button> |
+ </template> |
+ </ul> |
+ </div> |
+ |
+ <!-- Advanced tab content --> |
+ <div id="content-advanced" role="tabpanel" |
+ aria-labelledby="tab-advanced"> |
+ <div> |
+ <h1 class="i18n_options_tab_advanced"></h1> |
+ <p class="i18n_options_advanced_description"></p> |
<section> |
- <h2 class="i18n_options_acceptableAds_header"></h2> |
- <p class="i18n_options_acceptableAds_description"></p> |
- <form id="acceptable-ads"> |
- <div> |
- <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="ads"> |
- <label class="i18n_options_acceptableAds_ads_label"></label> |
- <p id="enable-aa-description" class="i18n_options_acceptableAds_ads_description_1"></p> |
- <p class="i18n_options_acceptableAds_ads_description_2"></p> |
- </div> |
- <div> |
- <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="privacy"> |
- <label class="i18n_options_acceptableAds_privacy_label"></label> |
- <p class="i18n_options_acceptableAds_privacy_description"></p> |
- <p id="dnt" class="i18n_options_acceptableAds_dnt_notification"></p> |
- </div> |
- <div> |
- <input data-action="switch-acceptable-ads" type="radio" name="acceptable-ads" value="none"> |
- <label class="i18n_options_acceptableAds_none_label"></label> |
- </div> |
- </form> |
- </section> |
- <section> |
- <h2 class="i18n_options_language_header"></h2> |
- <p class="i18n_options_language_description"></p> |
- <div id="blocking-languages"> |
- <ul id="blocking-languages-table" class="table list"> |
- <template> |
- <label class="display"></label> |
- <button data-single="hidden" data-action="remove-subscription" class="delete control" title="options_control_remove_title"></button> |
- <button data-single="visible" data-action="open-dialog" data-dialog="language-change" class="i18n_options_language_change"></button> |
- </template> |
- </ul> |
- <div class="controls"> |
- <button data-action="open-dialog" data-dialog="language-add"> |
- <span class="i18n_options_language_add"></span> |
- </button> |
- </div> |
- </div> |
- <p class="i18n_options_language_tip"></p> |
- </section> |
- <section> |
- <h2 class="i18n_options_more_filters_header"></h2> |
- <p class="i18n_options_more_filters_description"></p> |
- <ul id="custom-list-table" class="table list"> |
- <template> |
- <label class="display"></label> |
- <button data-action="remove-subscription" class="delete control" title="options_control_remove_title"></button> |
- </template> |
+ <h2 class="i18n_options_customize_header"></h2> |
+ <ul id="customize" class="table"> |
+ <li data-pref="shouldShowBlockElementMenu"> |
+ <label> |
+ <button role="checkbox" data-action="toggle-pref"></button> |
+ <span class="i18n_options_customize_blockElement"></span> |
+ <span class="i18n_options_readMore" |
+ data-tooltip="options_customize_blockElement_tooltip"></span> |
+ </label> |
+ </li> |
+ <li data-pref="show_devtools_panel"> |
+ <label> |
+ <button role="checkbox" data-action="toggle-pref"></button> |
+ <span class="i18n_options_customize_showDevToolsPanel"></span> |
+ <span class="i18n_options_readMore" |
+ data-tooltip="options_customize_showDevToolsPanel_tooltip"></span> |
+ </label> |
+ </li> |
+ <li data-pref="notifications_ignoredcategories"> |
+ <label> |
+ <button role="checkbox" data-action="toggle-pref"></button> |
+ <span class="i18n_options_customize_showNotifications"></span> |
+ <span class="i18n_options_readMore" |
+ data-tooltip="options_customize_showNotifications_tooltip"></span> |
+ </label> |
+ </li> |
</ul> |
- <p class="i18n_options_more_filters_note"></p> |
</section> |
</div> |
- <!-- Whitelist tab content --> |
- <div id="content-whitelist" role="tabpanel" aria-labelledby="tab-whitelist"> |
- <h1 class="i18n_options_tab_whitelist"></h1> |
- <p class="i18n_options_whitelist_description"></p> |
- <form> |
- <input id="whitelisting-textbox" type="text"> |
- <button id="whitelisting-add-button" |
- type="submit" |
- data-action="add-domain-exception" |
- class="i18n_options_whitelist_add" disabled> |
- </button> |
- <div id="whitelisting-validation"></div> |
- </form> |
- <ul id="whitelisting-table" class="table list"> |
+ <section> |
+ <h1 class="i18n_options_filterList_title"></h1> |
+ <p id="filter-lists-description" class="i18n_options_filterList_description"></p> |
+ |
+ <div id="all-filter-lists-table-header"> |
+ <h2 class="i18n_options_filterList_column_status"></h2> |
+ <h2 class="i18n_options_filterList_column_name"></h2> |
+ <h2 class="i18n_options_filterList_column_update"></h2> |
+ </div> |
+ <ul class="table cols" id="all-filter-lists-table"> |
<template> |
- <label class="display"></label> |
- <button data-action="remove-filter" class="delete control" |
- title="options_control_remove_title"> |
+ <button data-action="remove-subscription" class="control delete"></button> |
+ <button data-action="toggle-disable-subscription" role="checkbox" class="control"> |
</button> |
+ <div class="state"> |
+ <span class="i18n_options_filterList_state_active" id="state-active"></span> |
+ <span class="i18n_options_filterList_state_disabled" id="state-disabled"></span> |
+ </div> |
+ <div> |
+ <label class="display"></label> |
+ </div> |
+ <span class="last-update"></span> |
+ <span class="message"></span> |
+ <a data-action="open-context-menu" class="arrow"></a> |
+ <div role="menubar" class="context-menu-wrapper"> |
+ <div class="context-menu"> |
+ <ul class="content" role="menu"> |
+ <li role="menuitem"> |
+ <a class="i18n_options_filterList_updateNow update-subscription" data-action="update-subscription"></a> |
+ </li> |
+ <li role="menuitem"> |
+ <a class="i18n_options_filterList_website website" target="_blank"></a> |
+ </li> |
+ <li role="menuitem"> |
+ <a class="i18n_options_filterList_source source" target="_blank"></a> |
+ </li> |
+ <li role="menuitem"> |
+ <a class="i18n_options_filterList_delete delete" data-action="remove-subscription"></a> |
+ </li> |
+ </ul> |
+ </div> |
+ </div> |
</template> |
</ul> |
- </div> |
+ <div class="controls"> |
+ <button data-action="open-dialog" data-dialog="custom"> |
+ <span class="icon icon-add"></span> |
+ <span class="i18n_options_filterList_add"></span> |
+ </button> |
+ <button data-action="update-all-subscriptions"> |
+ <span class="icon icon-update"></span> |
+ <span class="i18n_options_filterList_update"></span> |
+ </button> |
+ </div> |
+ </section> |
- <!-- Advanced tab content --> |
- <div id="content-advanced" role="tabpanel" |
- aria-labelledby="tab-advanced"> |
- <div> |
- <h1 class="i18n_options_tab_advanced"></h1> |
- <p class="i18n_options_advanced_description"></p> |
- <section> |
- <h2 class="i18n_options_customize_header"></h2> |
- <ul id="customize" class="table"> |
- <li data-pref="shouldShowBlockElementMenu"> |
- <label> |
- <button role="checkbox" data-action="toggle-pref"></button> |
- <span class="i18n_options_customize_blockElement"></span> |
- <span class="i18n_options_readMore" |
- data-tooltip="options_customize_blockElement_tooltip"></span> |
- </label> |
- </li> |
- <li data-pref="show_devtools_panel"> |
- <label> |
- <button role="checkbox" data-action="toggle-pref"></button> |
- <span class="i18n_options_customize_showDevToolsPanel"></span> |
- <span class="i18n_options_readMore" |
- data-tooltip="options_customize_showDevToolsPanel_tooltip"></span> |
- </label> |
- </li> |
- <li data-pref="notifications_ignoredcategories"> |
- <label> |
- <button role="checkbox" data-action="toggle-pref"></button> |
- <span class="i18n_options_customize_showNotifications"></span> |
- <span class="i18n_options_readMore" |
- data-tooltip="options_customize_showNotifications_tooltip"></span> |
- </label> |
- </li> |
- </ul> |
- </section> |
- </div> |
- |
- <section> |
- <h1 class="i18n_options_filterList_title"></h1> |
- <p id="filter-lists-description" class="i18n_options_filterList_description"></p> |
- |
- <div id="all-filter-lists-table-header"> |
- <h2 class="i18n_options_filterList_column_status"></h2> |
- <h2 class="i18n_options_filterList_column_name"></h2> |
- <h2 class="i18n_options_filterList_column_update"></h2> |
+ <section> |
+ <h1 class="i18n_options_customFilters_title"></h1> |
+ <p class="i18n_options_customFilters_description"></p> |
+ <h2 class="i18n_options_customFilters_widget_title"></h2> |
+ <div id="custom-filters"> |
+ <div id="empty-custom-filters"> |
+ <p class="i18n_options_customFilters_tip"></p> |
+ <button class="i18n_options_customFilters_start" data-action="edit-custom-filters"> |
+ </button> |
+ <p> |
+ <a class="i18n_options_customFilters_learn" id="link-filters" target="_blank"></a> |
+ </p> |
</div> |
- <ul class="table cols" id="all-filter-lists-table"> |
- <template> |
- <button data-action="remove-subscription" class="control delete"></button> |
- <button data-action="toggle-disable-subscription" role="checkbox" class="control"> |
- </button> |
- <div class="state"> |
- <span class="i18n_options_filterList_state_active" id="state-active"></span> |
- <span class="i18n_options_filterList_state_disabled" id="state-disabled"></span> |
- </div> |
- <div> |
- <label class="display"></label> |
- </div> |
- <span class="last-update"></span> |
- <span class="message"></span> |
- <a data-action="open-context-menu" class="arrow"></a> |
- <div role="menubar" class="context-menu-wrapper"> |
- <div class="context-menu"> |
- <ul class="content" role="menu"> |
- <li role="menuitem"> |
- <a class="i18n_options_filterList_updateNow update-subscription" data-action="update-subscription"></a> |
- </li> |
- <li role="menuitem"> |
- <a class="i18n_options_filterList_website website" target="_blank"></a> |
- </li> |
- <li role="menuitem"> |
- <a class="i18n_options_filterList_source source" target="_blank"></a> |
- </li> |
- <li role="menuitem"> |
- <a class="i18n_options_filterList_delete delete" data-action="remove-subscription"></a> |
- </li> |
- </ul> |
- </div> |
- </div> |
- </template> |
- </ul> |
- <div class="controls"> |
- <button data-action="open-dialog" data-dialog="custom"> |
- <span class="icon icon-add"></span> |
- <span class="i18n_options_filterList_add"></span> |
+ <textarea id="custom-filters-raw" rows="15"></textarea> |
+ <button id="custom-filters-edit" class="i18n_options_customFilter_edit" data-action="edit-custom-filters"> |
+ </button> |
+ <div id="custom-filters-raw-controls"> |
+ <button class="i18n_options_customFilter_save" data-action="save-custom-filters"> |
</button> |
- <button data-action="update-all-subscriptions"> |
- <span class="icon icon-update"></span> |
- <span class="i18n_options_filterList_update"></span> |
+ <button class="i18n_options_customFilter_cancel" data-action="cancel-custom-filters"> |
</button> |
</div> |
- </section> |
+ </div> |
+ </section> |
+ </div> |
- <section> |
- <h1 class="i18n_options_customFilters_title"></h1> |
- <p class="i18n_options_customFilters_description"></p> |
- <h2 class="i18n_options_customFilters_widget_title"></h2> |
- <div id="custom-filters"> |
- <div id="empty-custom-filters"> |
- <p class="i18n_options_customFilters_tip"></p> |
- <button class="i18n_options_customFilters_start" data-action="edit-custom-filters"> |
- </button> |
- <p> |
- <a class="i18n_options_customFilters_learn" id="link-filters" target="_blank"></a> |
- </p> |
- </div> |
- <textarea id="custom-filters-raw" rows="15"></textarea> |
- <button id="custom-filters-edit" class="i18n_options_customFilter_edit" data-action="edit-custom-filters"> |
- </button> |
- <div id="custom-filters-raw-controls"> |
- <button class="i18n_options_customFilter_save" data-action="save-custom-filters"> |
- </button> |
- <button class="i18n_options_customFilter_cancel" data-action="cancel-custom-filters"> |
- </button> |
- </div> |
- </div> |
- </section> |
- </div> |
- |
- <!-- Help tab content --> |
- <div id="content-help" role="tabpanel" aria-labelledby="tab-help"> |
- <h1 class="i18n_options_tab_help"></h1> |
- <p class="i18n_options_help_description"></p> |
- <section> |
- <h2 class="i18n_options_support_title"></h2> |
- <ul> |
- <li id="report-issue" class="i18n_options_report_issue"></li> |
- <li id="report-ad" class="i18n_options_report_ad"></li> |
- <li id="report-bug" class="i18n_options_report_bug"></li> |
- <li id="report-forum" class="i18n_options_report_forum"></li> |
+ <!-- Help tab content --> |
+ <div id="content-help" role="tabpanel" aria-labelledby="tab-help"> |
+ <h1 class="i18n_options_tab_help"></h1> |
+ <p class="i18n_options_help_description"></p> |
+ <section> |
+ <h2 class="i18n_options_support_title"></h2> |
+ <ul> |
+ <li id="report-issue" class="i18n_options_report_issue"></li> |
+ <li id="report-ad" class="i18n_options_report_ad"></li> |
+ <li id="report-bug" class="i18n_options_report_bug"></li> |
+ <li id="report-forum" class="i18n_options_report_forum"></li> |
+ </ul> |
+ </section> |
+ <section> |
+ <h2 class="i18n_options_social_title"></h2> |
+ <p class="i18n_options_social_description"></p> |
+ <div id="social"> |
+ <ul id="social-general"> |
+ <li><a id="twitter">Twitter</a></li> |
+ <li><a id="facebook">Facebook</a></li> |
+ <li><a id="google-plus">Google Plus</a></li> |
</ul> |
- </section> |
- <section> |
- <h2 class="i18n_options_social_title"></h2> |
- <p class="i18n_options_social_description"></p> |
- <div id="social"> |
- <ul id="social-general"> |
- <li><a id="twitter">Twitter</a></li> |
- <li><a id="facebook">Facebook</a></li> |
- <li><a id="google-plus">Google Plus</a></li> |
- </ul> |
- <ul id="social-chinese"> |
- <li><a id="weibo">Weibo</a></li> |
- </ul> |
- <p> |
- <strong> |
- <span class="i18n_options_email"></span> |
- <a href="mailto:support@adblockplus.org">support@adblockplus.org</a> |
- </strong> |
- </p> |
- </div> |
- </section> |
- </div> |
+ <ul id="social-chinese"> |
+ <li><a id="weibo">Weibo</a></li> |
+ </ul> |
+ <p> |
+ <strong> |
+ <span class="i18n_options_email"></span> |
+ <a href="mailto:support@adblockplus.org">support@adblockplus.org</a> |
+ </strong> |
+ </p> |
+ </div> |
+ </section> |
</div> |
- </div> |
+ </main> |
<!-- Dialog --> |
<div id="dialog" role="dialog" aria-hidden="true"> |
<header> |
<span id="dialog-title"> |
+ <span id="dialog-title-about" class="i18n_options_dialog_about_title"></span> |
<span id="dialog-title-custom" class="i18n_options_dialog_custom_title"></span> |
<span id="dialog-title-language-add" class="i18n_options_dialog_language_title"></span> |
<span id="dialog-title-language-change" class="i18n_options_dialog_language_title"></span> |
@@ -343,6 +333,14 @@ |
<button id="dialog-close" class="i18n_options_close focus-first" data-action="close-dialog"></button> |
</header> |
<div id="dialog-body" class="content"> |
+ <!-- About Adblock Plus --> |
+ <div id="dialog-content-about" class="dialog-content"> |
+ <p id="abp-version"></p> |
+ <p class="i18n_options_dialog_about_copyright"></p> |
+ <p> |
+ <button class="i18n_options_close primary" data-action="close-dialog"></button> |
+ </p> |
+ </div> |
<!-- Add language subscription --> |
<div id="dialog-content-language-add" class="dialog-content"> |
<ul id="all-lang-table-add" class="table list"> |