Issue 6432 - Hide remove button for additional filter lists

desktop-options.html

Index: desktop-options.html
===================================================================
--- a/desktop-options.html
+++ b/desktop-options.html
@@ -86,7 +86,8 @@
           <h2 class="i18n_options_privacy_header"></h2>
           <ul class="list" id="recommend-protection-list-table">
             <template>
-              <button data-action="toggle-remove-subscription" role="checkbox" class="control icon"></button>
+              <button data-preconfigured="hide" data-action="toggle-remove-subscription" role="checkbox" class="control icon"></button>

[Thomas Greiner, 2018/03/02 17:00:02]

As I mentioned, let's focus on fixing this regression and not make any further
changes at this point.

[saroyanm, 2018/03/02 17:36:32]

I'm not sure why this comment is located here.
The only non regression change I think is the introduction of the grey Icon and
small changes in the background page, but I assume you are referring to some
other change here ?

[Thomas Greiner, 2018/03/05 14:52:10]

What about reversing that and instead write `data-hide="preconfigured"`? That
way we could reuse the attribute for hiding elements using other conditions in
the future (e.g. `data-hide="weekend"` to hide elements only on weekends).

[saroyanm, 2018/03/06 15:09:52]

Done.

+              <button data-preconfigured="show" role="checkbox" class="control icon" disabled></button>

[Thomas Greiner, 2018/03/05 14:52:10]

This button is redundant because we could simply set the existing button to
disabled when we initialize this collection. The browser should then no longer
trigger any of its actions.

That way we'd no longer need to
- keep this button in sync with the other one
- introduce `data-preconfigured="show"`
- use `display: none !important` to hide one of the two buttons

I'd recommend also setting `cursor: default` on disabled elements for a more
consistent UX.

[saroyanm, 2018/03/06 15:09:52]

Done.

               <span data-display="title"></span>
               <span data-tooltip="options_protection_%value%_tooltip"></span>
             </template>
@@ -141,8 +142,8 @@
                     (<span data-display="originalTitle"></span>)
                   </span>
                 </span>
-                <button data-single="hidden" data-action="remove-subscription" class="icon 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 link"></button>
+                <button data-single="hidden" data-preconfigured="hide" data-action="remove-subscription" class="icon delete control" title="options_control_remove_title"></button>
+                <button data-single="visible" data-preconfigured="hide" data-action="open-dialog" data-dialog="language-change" class="i18n_options_language_change link"></button>
               </template>
             </ul>
             <button class="i18n_options_language_add list" data-action="open-dialog" data-dialog="language-add"></button>
@@ -158,7 +159,7 @@
             <ul id="more-list-table" class="table list">
               <template>
                 <span data-display="title"></span>
-                <button data-action="remove-subscription" class="i18n_options_control_remove_title link control" title="options_control_remove_title"></button>
+                <button data-preconfigured="hide" data-action="remove-subscription" class="i18n_options_control_remove_title link control" title="options_control_remove_title"></button>
               </template>
             </ul>
             <p class="i18n_options_more_filters_note"></p>
@@ -269,14 +270,14 @@
                         <a class="i18n_options_filterList_source icon source" target="_blank"></a>
                       </li>
                       <li role="menuitem">
-                        <button class="i18n_options_control_remove_title icon delete" data-action="remove-subscription"></button>
+                        <button class="i18n_options_control_remove_title icon delete" data-preconfigured="hide" data-action="remove-subscription"></button>
                       </li>
                     </ul>
                   </div>
                 </div>
               </div>
               <div class="col5">
-                <button data-action="remove-subscription" class="control icon delete"></button>
+                <button data-preconfigured="hide" data-action="remove-subscription" class="control icon delete"></button>
               </div>
             </template>
           </ul>