Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Change icon for languages with spell check

Browse source
This commit is contained in:
Julia Radzhabova 2019-02-07 17:34:37 +03:00
parent 9b5ae84f58
commit d0d24eabab
9 changed files with 78 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
apps/common/main/lib/view/LanguageDialog.js
View file

@ -89,19 +89,19 @@ define([
editable: false,
template: _.template([
'<span class="input-group combobox <%= cls %> combo-langs" id="<%= id %>" style="<%= style %>">',
'<input type="text" class="form-control">',
'<span class="icon input-icon lang-flag"></span>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding-left: 26px !important;">',
'<i class="icon <% if (item.spellcheck) { %> lang-flag <% } %>" style="position: absolute;margin-left:-21px;"></i>',
'<%= scope.getDisplayValue(item) %>',
'</a>',
'</li>',
'<% }); %>',
'</ul>',
'<input type="text" class="form-control">',
'<span class="icon input-icon spellcheck-lang img-toolbarmenu"></span>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (item.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= scope.getDisplayValue(item) %>',
'</a>',
'</li>',
'<% }); %>',
'</ul>',
'</span>'
].join('')),
data: this.options.languages
@ -130,7 +130,7 @@ define([
},
onLangSelect: function(cmb, rec, e) {
cmb.$el.find('.input-icon').toggleClass('lang-flag', rec.spellcheck);
cmb.$el.find('.input-icon').toggleClass('spellcheck-lang', rec.spellcheck);
cmb._input.css('padding-left', rec.spellcheck ? 25 : 3);
},

52
apps/common/main/resources/less/language-dialog.less
View file

@ -1,3 +1,37 @@
// spell check indicator
.icon.spellcheck-lang {
width: 20px;
height: 20px;
position: absolute;
}
li {
.icon.spellcheck-lang {
margin: -3px 4px 0 -24px;
}
&.selected, a.checked {
.icon.spellcheck-lang {
background-position-x: -20px; --bgX: -20px;
}
}
}
.dropdown-menu.lang-menu {
> li {
a.checked {
&:before {
display: none;
}
background-color: @primary;
&, &:hover, &:focus {
color: @dropdown-link-active-color;
}
}
}
}
.combo-langs {
.dropdown-menu {
li .icon.lang-flag {
@ -7,8 +41,14 @@
.input-icon {
position: absolute;
left: 5px;
top: 5px;
&.spellcheck-lang { // spell check indicator
left: 2px;
top: 1px;
}
&.lang-flag { // language flags
left: 5px;
top: 5px;
}
}
}
@ -64,11 +104,3 @@
&.ja, &.ja-JP {background-position: 0 -192px;}
&.es-MX {background-position: -16px -192px;}
}
.dropdown-menu.lang-menu {
> li .icon {
display: inline-block;
vertical-align: text-bottom;
margin: 1px 5px 0 2px;
}
}

12
apps/documenteditor/main/app/view/DocumentHolder.js
View file

@ -3620,9 +3620,9 @@ define([
langid : lang.code,
spellcheck : lang.spellcheck,
template: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<%= caption %>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join(''))
}).on('click', function(item, e){
@ -3644,9 +3644,9 @@ define([
langid : lang.code,
spellcheck : lang.spellcheck,
template: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<%= caption %>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join(''))
}).on('click', function(item, e){

4
apps/documenteditor/main/app/view/Statusbar.js
View file

@ -234,8 +234,8 @@ define([
maxHeight: 300,
restoreHeight: 300,
itemTemplate: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join('')),

19
apps/documenteditor/main/resources/less/statusbar.less
View file

@ -78,14 +78,6 @@
color: #000;
margin-left: 6px;
.dropdown-toggle > .icon.lang-flag {
position: relative;
top: 3px;
margin-left: 3px;
margin-right: 2px;
display: inline-block;
}
.caret.up {
background-position: @arrow-up-small-offset-x @arrow-up-small-offset-y;
@ -98,17 +90,9 @@
cursor: pointer;
}
.dropdown-menu {
> li .icon {
display: inline-block;
vertical-align: text-bottom;
margin: 1px 5px 0 2px;
}
}
&.disabled {
cursor: default;
label, .icon.lang-flag {
label {
cursor: default;
opacity: 0.4;
}
@ -215,3 +199,4 @@
.button-normal-icon(btn-ic-zoomtowidth, 55, @toolbar-icon-size);
.button-normal-icon(btn-ic-zoomtopage, 56, @toolbar-icon-size);
.button-normal-icon(btn-ic-changes, 30, @toolbar-icon-size);
.button-normal-icon(spellcheck-lang, 69, @toolbar-icon-size);

12
apps/presentationeditor/main/app/view/DocumentHolder.js
View file

@ -3265,9 +3265,9 @@ define([
langid : lang.code,
spellcheck : lang.spellcheck,
template: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<%= caption %>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join(''))
}).on('click', function(item, e){
@ -3289,9 +3289,9 @@ define([
langid : lang.code,
spellcheck : lang.spellcheck,
template: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<%= caption %>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join(''))
}).on('click', function(item, e){

4
apps/presentationeditor/main/app/view/Statusbar.js
View file

@ -268,8 +268,8 @@ define([
maxHeight: 300,
restoreHeight: 300,
itemTemplate: _.template([
'<a id="<%= id %>" tabindex="-1" type="menuitem">',
'<i class="icon <% if (options.spellcheck) { %> lang-flag <% } %>"></i>',
'<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;">',
'<i class="icon <% if (options.spellcheck) { %> img-toolbarmenu spellcheck-lang <% } %>"></i>',
'<%= caption %>',
'</a>'
].join('')),

20
apps/presentationeditor/main/resources/less/statusbar.less
View file

@ -91,14 +91,6 @@
color: #000;
margin-left: 6px;
.dropdown-toggle > .icon.lang-flag {
position: relative;
top: 3px;
margin-left: 3px;
margin-right: 2px;
display: inline-block;
}
.caret.up {
background-position: @arrow-up-small-offset-x @arrow-up-small-offset-y;
@ -111,17 +103,9 @@
cursor: pointer;
}
.dropdown-menu {
> li .icon {
display: inline-block;
vertical-align: text-bottom;
margin: 1px 5px 0 2px;
}
}
&.disabled {
cursor: default;
label, .icon.lang-flag {
label {
cursor: default;
opacity: 0.4;
}
@ -215,3 +199,5 @@
}
}
}
.button-normal-icon(spellcheck-lang, 76, @toolbar-icon-size);

2
apps/spreadsheeteditor/main/app/view/FileMenuPanels.js
View file

@ -696,7 +696,7 @@ define([
data : regdata,
template: _.template([
'<span class="input-group combobox <%= cls %> combo-langs" id="<%= id %>" style="<%= style %>">',
'<input type="text" class="form-control">',
'<input type="text" class="form-control" style="padding-left: 25px !important;">',
'<span class="icon input-icon lang-flag"></span>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',