diff --git a/loleaflet/css/toolbar.css b/loleaflet/css/toolbar.css
index 390dea08e..fb7475ce0 100644
--- a/loleaflet/css/toolbar.css
+++ b/loleaflet/css/toolbar.css
@@ -1065,6 +1065,7 @@ tr.useritem > td > img {
.menu-entry-icon {
width: 32px;
height: 32px;
+ vertical-align: middle;
background: transparent;
}
diff --git a/loleaflet/images/lc_charfontname.svg b/loleaflet/images/lc_charfontname.svg
new file mode 100644
index 000000000..78a1c82e9
--- /dev/null
+++ b/loleaflet/images/lc_charfontname.svg
@@ -0,0 +1 @@
+
diff --git a/loleaflet/images/lc_fontheight.svg b/loleaflet/images/lc_fontheight.svg
new file mode 100644
index 000000000..cccd0cd97
--- /dev/null
+++ b/loleaflet/images/lc_fontheight.svg
@@ -0,0 +1 @@
+
diff --git a/loleaflet/src/control/Control.JSDialogBuilder.js b/loleaflet/src/control/Control.JSDialogBuilder.js
index e3852b256..c094f8afb 100644
--- a/loleaflet/src/control/Control.JSDialogBuilder.js
+++ b/loleaflet/src/control/Control.JSDialogBuilder.js
@@ -141,9 +141,17 @@ L.Control.JSDialogBuilder = L.Control.extend({
return null;
},
- _explorableEntry: function(parentContainer, title, contentNode, builder) {
+ _explorableEntry: function(parentContainer, title, contentNode, builder, iconPath) {
var sectionTitle = L.DomUtil.create('div', 'ui-header level-' + builder._currentDepth + ' mobile-wizard ui-widget', parentContainer);
- sectionTitle.innerHTML = title;
+ if (iconPath) {
+ var div = L.DomUtil.create('div', '', sectionTitle);
+ var icon = L.DomUtil.create('img', 'menu-entry-icon', div);
+ icon.src = iconPath;
+ var titleSpan = L.DomUtil.create('span', 'menu-entry-with-icon', div);
+ titleSpan.innerHTML = title;
+ } else {
+ sectionTitle.innerHTML = title;
+ }
$(sectionTitle).css('justify-content', 'space-between');
@@ -399,7 +407,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
return false;
},
- _comboboxControl: function(parentContainer, data, builder) {
+ _comboboxControl: function(parentContainer, data, builder, iconPath) {
// TODO: event listener in the next level...
if (!data.entries || data.entries.length == 0)
@@ -418,7 +426,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var contentNode = {type: 'container', children: entries};
- builder._explorableEntry(parentContainer, title, contentNode, builder);
+ builder._explorableEntry(parentContainer, title, contentNode, builder, iconPath);
return false;
},
@@ -575,13 +583,15 @@ L.Control.JSDialogBuilder = L.Control.extend({
},
_fontNameControl: function(parentContainer, data, builder) {
+ var iconPath = 'images/lc_charfontname.svg';
data.entries = [ 'Liberation Sans' ];
- builder._comboboxControl(parentContainer, data, builder);
+ builder._comboboxControl(parentContainer, data, builder, iconPath);
},
_fontHeightControl: function(parentContainer, data, builder) {
+ var iconPath = 'images/lc_fontheight.svg';
data.entries = [ '8', '10', '11', '12', '14', '16', '24', '32', '48' ];
- builder._comboboxControl(parentContainer, data, builder);
+ builder._comboboxControl(parentContainer, data, builder, iconPath);
},
build: function(parent, data) {