wip

generator/generate.html

                         </div>
                     </div>
                     <div class="form-group">
-                        <label for="card-title-size" class="col-sm-2 control-label">Title</label>
+                        <label for="card-title-size" class="col-sm-2 control-label">Title size</label>
                         <div class="col-sm-10">
                             <select class="form-control" id="card-title-size" data-property="title_size">
                                 <option value="" selected>default font</option>
                             </select>
                         </div>
                     </div>
+                    <div class="form-group">
+                        <label for="card-title-icon-text" class="col-sm-2 control-label">Icon text</label>
+                        <div class="col-sm-10">
+                            <input type="text" id="card-title-icon-text" class="form-control" placeholder="Icon text" data-property="title_icon_text">
+                        </div>
+                    </div>
                     <div class="form-group">
                         <label for="card-count" class="col-sm-2 control-label">Count</label>
                         <div class="col-sm-10">

generator/js/card.ts

         count: number;
         title: string;
         title_size: string;
+        title_icon_text: string;
         color: string;
         color_front: string;
         color_back: string;
             this.count = 1;
             this.title = "New card";
             this.title_size = null;
+            this.title_icon_text = null;
             this.color = null;
             this.color_front = null;
             this.color_back = null;
             result.count = json.count || 1;
             result.title = json.title || "";
             result.title_size = json.title_size || null;
+            result.title_icon_text = json.title_icon_text || null;
             result.color = json.color || null;
             result.color_front = json.color_front || null;
             result.color_back = json.color_back || null;
                 count: this.count,
                 title: this.title,
                 title_size: this.title_size,
+                title_icon_text: this.title_icon_text,
                 color: this.color,
                 color_front: this.color_front,
                 color_back: this.color_back,
         public getTitleSize(options: Options): string {
             return this.title_size || options.default_title_size || "13";
         }
+        public getTitleIconText(options: Options): string {
+            return this.title_icon_text || "";
+        }
         public getColorFront(options: Options): string {
             return this.color_front || this.color || options.default_color || "black";
         }
 
         private  _title(card: Card, options: Options, ind: string, ind0: string): string {
             var title = card.getTitle(options);
-            var title_size = card.getTitleSize(options)
+            var title_size = card.getTitleSize(options);
+            var title_icon_text = card.getTitleIconText(options);
             var icon = card.getIconFront(options);
             var result = "";
             result += ind + '<card-title size="' + title_size + '">\n';
             result += ind + ind0 + '<h1>' + title + '</h1>\n';
-            result += ind + ind0 + '<h2>' + "" + '</h2>\n';
+            result += ind + ind0 + '<h2>' + title_icon_text + '</h2>\n';
             result += this._icon(icon, ind + ind0, ind0);
             result += ind + '</card-title>\n';
             return result;

generator/js/ui.ts

 
         $("#card-title").change(on_change_card_title);
         $("#card-title-size").change(on_change_card_property);
+        $("#card-title-icon-text").change(on_change_card_property);
         $("#card-icon").change(on_change_card_property);
         $("#card-count").change(on_change_card_property);
         $("#card-icon-back").change(on_change_card_property);