From 6c7b99af586297620654d0e93249cf6acda3f5f1 Mon Sep 17 00:00:00 2001
From: antelle <dmitryvit@gmail.com>
Date: Sat, 19 Dec 2020 16:30:03 +0100
Subject: [PATCH] fix #1655: separated custom icons to make the download and
 selection buttons more visible

---
 app/scripts/views/icon-select-view.js |  5 ++++-
 app/styles/common/_icon-select.scss   |  3 ++-
 app/templates/icon-select.hbs         | 10 +++++++---
 release-notes.md                      |  1 +
 4 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/app/scripts/views/icon-select-view.js b/app/scripts/views/icon-select-view.js
index 34e35938..0434285c 100644
--- a/app/scripts/views/icon-select-view.js
+++ b/app/scripts/views/icon-select-view.js
@@ -21,11 +21,14 @@ class IconSelectView extends View {
     };
 
     render() {
+        const customIcons = this.model.file.getCustomIcons();
+        const hasCustomIcons = Object.keys(customIcons).length > 0;
         super.render({
             sel: this.model.iconId,
             icons: IconMap,
             canDownloadFavicon: !!this.model.url,
-            customIcons: this.model.file.getCustomIcons()
+            customIcons,
+            hasCustomIcons
         });
     }
 
diff --git a/app/styles/common/_icon-select.scss b/app/styles/common/_icon-select.scss
index 8b70564f..7aba402a 100644
--- a/app/styles/common/_icon-select.scss
+++ b/app/styles/common/_icon-select.scss
@@ -7,7 +7,8 @@
         flex-wrap: wrap;
         user-select: none;
         padding-bottom: $base-padding-h;
-        &--custom {
+        &--custom,
+        &--actions {
             padding-top: $base-padding-h;
             border-top: 1px solid var(--light-border-color);
         }
diff --git a/app/templates/icon-select.hbs b/app/templates/icon-select.hbs
index 745b1dd1..9ba4342e 100644
--- a/app/templates/icon-select.hbs
+++ b/app/templates/icon-select.hbs
@@ -4,11 +4,11 @@
         <i class="fa fa-{{icon}} icon-select__icon {{#ifeq ix ../sel}}icon-select__icon--active{{/ifeq}}" data-val="{{ix}}"></i>
         {{/each}}
     </div>
-    <div class="icon-select__items icon-select__items--custom">
+    <div class="icon-select__items icon-select__items--actions">
         <input type="file" class="icon-select__file-input hide-by-pos" accept="image/*" />
         {{#if canDownloadFavicon}}
-        <span class="icon-select__icon icon-select__icon-btn icon-select__icon-download"
-              data-val="special" data-special="download" title="{{res 'iconFavTitle'}}">
+            <span class="icon-select__icon icon-select__icon-btn icon-select__icon-download"
+                  data-val="special" data-special="download" title="{{res 'iconFavTitle'}}">
             <i class="fa fa-cloud-download-alt"></i>
         </span>
         {{/if}}
@@ -16,6 +16,9 @@
               data-val="special" data-special="select" title="{{res 'iconSelCustom'}}">
             <i class="fa fa-ellipsis-h"></i>
         </span>
+    </div>
+    {{#if hasCustomIcons}}
+    <div class="icon-select__items icon-select__items--custom">
         {{#each customIcons as |icon ci|}}
         <span class="icon-select__icon icon-select__icon-btn icon-select__icon-custom {{#ifeq ci ../sel}}icon-select__icon--active{{/ifeq}}"
               data-val="{{ci}}">
@@ -23,4 +26,5 @@
         </span>
         {{/each}}
     </div>
+    {{/if}}
 </div>
diff --git a/release-notes.md b/release-notes.md
index cf657dce..146110f1 100644
--- a/release-notes.md
+++ b/release-notes.md
@@ -3,6 +3,7 @@ Release notes
 ##### v1.17.0 (TBD)
 `+` automatically switching between dark and light theme  
 `+` clear searchbox button  
+`+` favicon download improvements  
 
 ##### v1.16.5 (2020-12-18)
 `-` using custom OneDrive without a secret