#133 - show number of icons

src/main/resources/languages/base_de.properties

@@ -187,6 +187,7 @@ category.new.label.name=Name
 category.new.label.icon=Icon
 category.new.icon.remove=Entfernen
 category.new.icon.placeholder=Hier klicken um ein Icon auszuwählen
+category.new.icons=Icons
 categories.usages=Verweise
 categories.actions=Aktionen
 

src/main/resources/languages/base_en.properties

@@ -187,6 +187,7 @@ category.new.label.name=Name
 category.new.label.icon=Icon
 category.new.icon.remove=Remove
 category.new.icon.placeholder=Click here to select an icon
+category.new.icons=Icons
 categories.usages=Usages
 categories.actions=Actions
 

src/main/resources/static/css/categories.css

@@ -90,6 +90,10 @@
     font-size: 2rem;
 }
 
+#numberOfCategories {
+    font-size: 1.1rem;
+}
+
 /*style spectrum color picker*/
 
 /*hide spectrum color picker arrow*/

src/main/resources/templates/categories/categoriesFunctions.ftl

@@ -31,15 +31,18 @@
 <#macro modalIconSelect>
     <div id="modalIconSelect" class="modal modal-fixed-footer background-color">
         <div class="modal-content">
-            <h4>${locale.getString("category.new.label.icon")}</h4>
-
-            <div class="row">
+            <div class="row no-margin-bottom">
                 <div class="input-field col s12 m12 l8 offset-l2">
                     <i class="material-icons prefix">search</i>
                     <input id="searchIcons" type="text">
                     <label for="searchIcons">${locale.getString("search")}</label>
                 </div>
             </div>
+            <div class="row">
+                <div class="col s12 center-align" id="numberOfCategories">${fontawesomeIcons?size}/${fontawesomeIcons?size} ${locale.getString("category.new.icons")}</div>
+            </div>
+
+            <hr>
 
             <div class="row">
                 <#list fontawesomeIcons as icon>