fix: tag selector beautifed

interface.py

@@ -387,6 +387,8 @@ def build_library_query_condition(form):
                         break
             if count > 0:
                 condition.and_sub_condition(sub_cond)
+            else:
+                condition.and_equal("id", None)
 
         tags = form['tags'].split(",")
         for tag in tags:

static/css/custom.css

@@ -9,8 +9,14 @@
    cursor:pointer;
    transition: 400ms;
 }
+.tag-unclicked{
+   opacity: 0.6;
+}
 .tag-clicked{
+   box-shadow: 2px 4px 10px #777777;
    transform: scale(1.2);
+   opacity: 1;
+   margin: 5px;
 }
 .floating-button {
    width: 50px;

templates/index.html

@@ -156,7 +156,7 @@
                                             <label class="col-sm-2 col-form-label">Tags</label>
                                             <div class="col-sm-10" style="padding-top:5px;">
                                                 {% for tag in tags_color_lookup.keys() %}
-                                                    <span id="filter-tag" class="filter-tag tag-click badge badge-{{ tags_color_lookup[tag] }}">{{ tag }}</span>
+                                                    <span id="filter-tag" class="filter-tag tag-unclicked tag-click badge badge-{{ tags_color_lookup[tag] }}">{{ tag }}</span>
                                                 {% endfor %}
                                             </div>
                                         </div>
@@ -582,7 +582,7 @@
                     filter_radio = false;
                 }else{
                     filter_btn_radio.removeClass("btn-secondary").addClass("btn-primary");
-                    filter_types.push('radio')
+                    filter_types.push('radio');
                     filter_radio = true;
                 }
             }
@@ -596,7 +596,9 @@
             _tag = tag;
             if (!tag.hasClass('tag-clicked')) {
                 tag.addClass('tag-clicked');
+                tag.removeClass('tag-unclicked');
             } else {
+                tag.addClass('tag-umclicked');
                 tag.removeClass('tag-clicked');
             }
             updateResults();