Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: options.html

Issue 6088024630755328: issue 1526 - Implement new options page design for Chrome/Opera/Safari (Closed)
Patch Set: Comment about solution being temprorary is added to subscriptions.xml Created June 13, 2015, 12:59 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « locale/en-US/options.json ('k') | options.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: options.html
===================================================================
new file mode 100644
--- /dev/null
+++ b/options.html
@@ -0,0 +1,313 @@
+<!DOCTYPE html>
+<!--
+ - This file is part of Adblock Plus <https://adblockplus.org/>,
+ - Copyright (C) 2006-2015 Eyeo GmbH
+ -
+ - Adblock Plus is free software: you can redistribute it and/or modify
+ - it under the terms of the GNU General Public License version 3 as
+ - published by the Free Software Foundation.
+ -
+ - Adblock Plus is distributed in the hope that it will be useful,
+ - but WITHOUT ANY WARRANTY; without even the implied warranty of
+ - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ - GNU General Public License for more details.
+ -
+ - You should have received a copy of the GNU General Public License
+ - along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>.
+ -->
+
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title class="i18n_options_page_title"></title>
+ <link rel="stylesheet" href="skin/options.css">
+ <style id="search-style"></style>
+ <script src="ext/common.js"></script>
+ <script src="ext/content.js"></script>
+ <script src="i18n.js"></script>
+ <script src="options.js"></script>
+ </head>
+ <body data-tab="general">
+ <!-- Navigation sidebar -->
+ <div id="nav-sidebar">
+ <div id="fixed-sidebar" class="fixed">
+ <div id="page-title">
+ <p class="i18n_options_page_header_1"></p>
+ <h1 class="i18n_options_page_header_2"></h1>
+ </div>
+ <ul id="main-navigation-tabs" class="tabs vertical">
+ <li id="tab-general" data-show="general" class="active">
+ <span class="i18n_options_tab_general"></span>
+ <span class="icon"></span>
+ </li>
+ <li id="tab-advanced" data-show="advanced">
+ <span class="i18n_options_tab_advanced"></span>
+ <span class="icon"></span>
+ </li>
+ <li id="tab-help" data-show="help">
+ <span class="i18n_options_tab_help"></span>
+ <span class="icon"></span>
+ </li>
+ </ul>
+ <p class="nav-link">
+ <span class="i18n_options_version"></span> <span id="abp-version"></span>
+ </p>
+ <ul class="tabs vertical bottom">
+ <li id="tab-share">
+ <span class="i18n_options_tab_share"></span><span class="icon"></span>
+ </li>
+ <li id="tab-donate">
+ <span class="i18n_options_tab_donate"></span><span class="icon"></span>
+ </li>
+ </ul>
+ </div>
+ </div>
+ <div id="tab-content">
+ <div id="content-wrapper">
+ <div id="dialog-background"></div>
+
+ <!-- General tab content -->
+ <div id="content-general">
+ <div>
+ <h1 class="i18n_options_blocking_title"></h1>
+ <div class="flex-container">
+ <div id="blocking-languages">
+ <p class="option-name">
+ <span class="i18n_options_language_title"></span>
+ <a class="i18n_options_readMore tooltip" target="_blank"></a>
+ </p>
+ <ul id="blocking-languages-table" class="table list">
+ <template>
+ <input type="checkbox" class="control" />
+ <span class="display"></span>
+ </template>
+ </ul>
+ <div class="controls">
+ <button id="add-website-language">
+ <span class="icon icon-add"></span>
+ <span class="i18n_options_language_add"></span>
+ </button>
+ </div>
+ </div>
+ <div id="further-blocking">
+ <p class="option-name">
+ <strong class="i18n_options_furtherBlocking_title"></strong>
+ <a class="i18n_options_readMore tooltip" target="_blank"></a>
+ </p>
+ <div id="custom-wrapper">
+ <ul id="recommend-list-table" class="table list">
+ <template>
+ <input type="checkbox" class=control />
+ <span class="display"></span>
+ <span class="popular"></span>
+ </template>
+ </ul>
+ <ul id="custom-list-table" class="table list">
+ <template>
+ <input type="checkbox" class="control" />
+ <span class="display"></span>
+ </template>
+ </ul>
+ </div>
+ <div class="controls">
+ <button id="add-blocking-list">
+ <span class="icon icon-add"></span>
+ <span class="i18n_options_furtherBlocking_add"><span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div>
+ <h1 class="i18n_options_exceptions_title"></h1>
+ <div class="flex-container">
+ <div id="acceptable-ads">
+ <p class="option-name">
+ <strong class="i18n_options_acceptableAds_title"></strong>
+ <a class="i18n_options_readMore tooltip" target="_blank"></a>
+ </p>
+ <ul id="acceptableads-table" class="table list">
+ <template>
+ <input type="checkbox" class="control" />
+ <span class="display"></span>
+ </template>
+ </ul>
+ </div>
+ <div id="whitelisting">
+ <p class="option-name">
+ <strong class="i18n_options_whitelisted_title"></strong>
+ <a class="i18n_options_readMore tooltip" target="_blank"></a>
+ </p>
+ <ul id="whitelisting-table" class="table list">
+ <template>
+ <button class="delete control"></button>
+ <span class="display"></span>
+ </template>
+ </ul>
+ <div class="controls">
+ <div>
+ <span id="whitelisting-add-icon" class="icon icon-add"></span>
+ <input type="text" id="whitelisting-textbox" />
+ <span id="whitelisting-enter-icon" class="icon icon-enter"></span>
+ </div>
+ <div>
+ <button id="whitelisting-add-button" class="button-add">
+ +<span class="i18n_options_button_add"></span>
+ </button>
+ <span></span>
+ <button id="whitelisting-cancel-button" class="i18n_options_button_cancel cancel-button"></button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- Advanced tab content -->
+ <div id="content-advanced">
+ <div>
+ <h1><span class="i18n_options_tweaks_title"></span><a class="i18n_options_readMore tooltip" href="#"></a></h1>
+ <ul class="table" style="width: auto;">
+ <li>
+ <input type="checkbox" id="easylist"/><span id="block-element-explanation" class="i18n_options_tweaks_blockElement"></span></li>
+ </ul>
+ </div>
+ <div>
+ <h1><span class="i18n_options_blockingList_title"></span><a class="i18n_options_readMore tooltip" href="#" target="_blank"></a></h1>
+ <ul id="blocking-list-tabs" class="tabs horizontal">
+ <li class="i18n_options_tab_overview active" data-show="blocking-list-overview"></li><li class="i18n_options_tab_ownList" data-show="blocking-list-own"></li>
+ </ul>
+ <div id="blocking-list">
+ <div id="blocking-list-overview">
+ <ul class="table cols" style="width: auto;">
+ <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>
+ <li><input type="checkbox" id="easylist"/><span>Easylist</span><span>Adblocking english sites</span><span>15 March 14 - 10:31</span></li>
+ <li><input type="checkbox" id="easylist+de"/><span>Easylist Germany + Easylist</span><span>Adblocking english + german sites</span><span>15 March 14 - 10:31</span></li>
+ <li><input type="checkbox" id="annoyance-fb"/><span>Facebook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li>
+ <li><input type="checkbox" id="annoyance-youtube"/><span>Facebook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li>
+ <li><input type="checkbox" id="own-list"/><span>Own blocking list</span><span>Your own blocking list</span><span><a href="#">edit your blocking list</a></span></li>
+ </ul>
+ <div class="controls">
+ <button>
+ <span class="icon icon-add"></span><span class="i18n_options_blockingList_add"></span>
+ </button>
+ <button>
+ <span class="icon icon-update"></span><span class="i18n_options_blockingList_update"></span>
+ </button>
+ </div>
+ </div>
+ <div id="blocking-list-own">
+ <p class="i18n_options_blockingRules"></p>
+ <ul class="table list">
+ <li><span>zap2it.com##.zc-station-position</span></li>
+ <li><span>downturk.net##.zippo</span></li>
+ <li><span>yahoo.com##.y708-promo-middle</span></li>
+ <li><span>reflector.com##.yahooboss</span></li>
+ <li><span>yardbarker.com##.yard_leader</span></li>
+ <li><span>espn.co.uk##.will_hill</span></li>
+ <li><span>listverse.com##.wiki</span></li>
+ <li><span>planet5d.com##.wp-image-1573</span></li>
+ <li><span>buzzinn.net##.wpn_finner</span></li>
+ <li><span>talkers.com##.wpss_slideshow</span></li>
+ </ul>
+ <div class="controls" style="margin: 0px;">
+ <input type="text" placeholder="add your blocking rule here"/>
+ <div class="input-control">
+ <span class="input-separator"></span>
+ <span class="i18n_options_button_add input-button-text"></span>
+ <span class="icon icon-enter-blue"></span>
+ </div>
+ </div>
+ <div class="controls">
+ <button>
+ <span class="icon icon-edit"></span>
+ <span class="i18n_options_blockingRules_edit"></span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- Help tab content -->
+ <div id="content-help">
+ <h1 class="i18n_options_faq_title"></h1>
+ <p class="i18n_options_faq_description"></p>
+ <p>
+ <a class="i18n_options_faq_title" href="#" target="_blank"></a>
+ </p>
+ <h1 class="i18n_options_forum_title"></h1>
+ <p class="i18n_options_forum_description"></p>
+ <p>
+ <a class="i18n_options_forum_link" href="#" target="_blank"></a>
+ </p>
+ <h1 class="i18n_options_media_title"></h1>
+ <p class="i18n_options_media_description"></p>
+ <p>
+ <a href="#" target="_blank">Twitter</a>
+ <a href="#" target="_blank">Facebook</a>
+ <a href="#" target="_blank">Google+</a>
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <!-- Dialog -->
+ <div id="dialog">
+ <header>
+ <span id="dialog-title">
+ <span id="dialog-title-customlist" class="i18n_options_dialog_customlist_title"></span>
+ <span id="dialog-title-language" class="i18n_options_dialog_language_title"></span>
+ </span>
+ <button id="dialog-close" class="i18n_options_close"></button>
+ </header>
+ <div id="dialog-body" class="content">
+ <!-- Add other website language: Dialog -->
+ <div id="dialog-content-language" class="dialog-content">
+ <div class="dialog-content-block">
+ <h3 class="i18n_options_dialog_language_added"></h3>
+ <ul id="blocking-languages-dialog-table" class="table list">
+ <template>
+ <span class="display"></span>
+ </template>
+ </ul>
+ </div>
+ <div id="other-language" class="dialog-content-block">
+ <h3 class="i18n_options_dialog_language_other"></h3>
+ <div>
+ <input type="search" id="find-language" />
+ </div>
+ <ul id="all-lang-table" class="table list">
+ <template>
+ <button class="button-add control">
+ +<span></span>
+ </button>
+ <span class="display"></span>
+ </template>
+ </ul>
+ </div>
+ </div>
+ <!-- Add other blocking list: Dialog -->
+ <div id="dialog-content-customlist" class="dialog-content">
+ <div class="dialog-content-block">
+ <h3 class="i18n_options_dialog_customlist_subscription_title"></h3>
+ <div>
+ <input id="blockingList-textbox" type="text" placeholder="www.example.com/blockinglist.txt" />
+ </div>
+ <div id="import-blockingList-button" class="button-wrapper">
+ <span class="icon icon-arrow"></span>
+ <span class="i18n_options_dialog_customlist_import"></span>
+ </div>
+ </div>
+ <div class="dialog-content-block">
+ <h3 class="i18n_options_dialog_edit_own_list"></h3>
+ <div id="edit-ownBlockingList-button" class="button-wrapper">
+ <span class="icon icon-arrow"></span>
+ <span class="i18n_options_dialog_create_own_list"></span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </body>
+</html>
« no previous file with comments | « locale/en-US/options.json ('k') | options.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld