From 7e136c5b8e82643c7183392265e3767bd6f1b1a4 Mon Sep 17 00:00:00 2001
From: Marius BALTEANU <marius.balteanu@zitec.com>
Date: Thu, 23 May 2019 06:32:54 +0000
Subject: [PATCH 2/2] Use the regular "icon icon-*" classes for collapsible
 fields

---
 app/views/queries/_query_form.html.erb | 4 ++--
 app/views/versions/index.html.erb      | 4 ++--
 public/javascripts/application.js      | 1 +
 public/stylesheets/application.css     | 8 ++++----
 4 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/app/views/queries/_query_form.html.erb b/app/views/queries/_query_form.html.erb
index 9ca432b..c8be6b7 100644
--- a/app/views/queries/_query_form.html.erb
+++ b/app/views/queries/_query_form.html.erb
@@ -5,14 +5,14 @@
 <div id="query_form_with_buttons" class="hide-when-print">
 <div id="query_form_content">
   <fieldset id="filters" class="collapsible <%= @query.new_record? ? "" : "collapsed" %>">
-    <legend onclick="toggleFieldset(this);"><%= l(:label_filter_plural) %></legend>
+    <legend onclick="toggleFieldset(this);" class="icon icon-<%= @query.new_record? ? "expended" : "collapsed" %>"><%= l(:label_filter_plural) %></legend>
     <div style="<%= @query.new_record? ? "" : "display: none;" %>">
       <%= render :partial => 'queries/filters', :locals => {:query => @query} %>
     </div>
   </fieldset>
 
   <fieldset id="options" class="collapsible collapsed">
-    <legend onclick="toggleFieldset(this);"><%= l(:label_options) %></legend>
+    <legend onclick="toggleFieldset(this);" class="icon icon-collapsed"><%= l(:label_options) %></legend>
     <div style="display: none;">
       <table>
         <tr>
diff --git a/app/views/versions/index.html.erb b/app/views/versions/index.html.erb
index 429bc5b..ba396c2 100644
--- a/app/views/versions/index.html.erb
+++ b/app/views/versions/index.html.erb
@@ -88,8 +88,8 @@
 <% if @completed_versions.present? %>
 <p>
   <%= link_to_function l(:label_completed_versions),
-                       '$("#toggle-completed-versions").toggleClass("collapsed"); $("#completed-versions").toggle()',
-                       :id => 'toggle-completed-versions', :class => 'collapsible collapsed' %>
+                       '$("#toggle-completed-versions").toggleClass("icon-collapsed icon-expended"); $("#completed-versions").toggle()',
+                       :id => 'toggle-completed-versions', :class => 'icon icon-collapsed collapsible' %>
   <ul id = "completed-versions" style = "display:none;">
     <% @completed_versions.each do |version| %>
       <li><%= link_to_version version %></li>
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index cb4d42a..bfcfb74 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -72,6 +72,7 @@ function toggleAllRowGroups(el) {
 function toggleFieldset(el) {
   var fieldset = $(el).parents('fieldset').first();
   fieldset.toggleClass('collapsed');
+  fieldset.children('legend').toggleClass('icon-expended icon-collapsed');
   fieldset.children('div').toggle();
 }
 
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index faa3887..b29e952 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -132,8 +132,7 @@ a.user.locked, a.user.locked:link, a.user.locked:visited {color: #999;}
 #admin-menu a {line-height:1.7em;}
 #admin-menu a.selected {padding-left: 20px !important; background-position: 2px 40%;}
 
-a.collapsible {padding-left: 12px; background: url(../images/arrow_down.png) no-repeat 0px 50%;}
-a.collapsible.collapsed {background-image: url(../images/arrow_right.png);}
+a.collapsible {padding-left: 12px; }
 
 a#toggle-completed-versions {color:#999;}
 
@@ -518,8 +517,7 @@ div.issue.overdue .due-date .value { color: #c22; }
 #trackers_description dd {margin: 0; padding: 0 0 1em 0;}
 
 fieldset.collapsible {border-width: 1px 0 0 0;}
-fieldset.collapsible>legend { padding-left: 18px; background: url(../images/arrow_down.png) no-repeat 4px 40%; cursor:pointer; }
-fieldset.collapsible.collapsed>legend { background-image: url(../images/arrow_right.png); }
+fieldset.collapsible>legend { cursor:pointer; padding-left: 18px; background-position: 4px;}
 
 fieldset#date-range p { margin: 2px 0 2px 0; }
 fieldset#filters table { border-collapse: collapse; }
@@ -1498,6 +1496,8 @@ td.gantt_selected_column .gantt_hdr,.gantt_selected_column_container {
 .icon-shared { background-image: url(../images/link.png); }
 .icon-actions { background-image: url(../images/3_bullets.png); }
 .icon-sort-handle { background-image: url(../images/reorder.png); }
+.icon-expended { background-image: url(../images/arrow_down.png); }
+.icon-collapsed { background-image: url(../images/arrow_right.png); }
 
 .icon-file { background-image: url(../images/files/default.png); }
 .icon-file.text-plain { background-image: url(../images/files/text.png); }
-- 
2.1.4