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

[Common] button's refactoring

Browse source
This commit is contained in:
Maxim Kadushkin 2017-03-09 11:41:47 +03:00
parent 13aff47a21
commit 4cd69190ff
9 changed files with 39 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
apps/common/main/lib/component/Button.js
View file

@ -139,7 +139,7 @@ define([
'<% if (menu == null) { %>',
'<button type="button" class="btn <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<% if (iconCls != "") { %>',
'<i class="btn-icon <%= iconCls %>">&nbsp;</i>',
'<i class="icon <%= iconCls %>">&nbsp;</i>',
'<% } %>',
'<span class="caption"><%= caption %></span>',
'</button>',
@ -147,7 +147,7 @@ define([
'<div class="btn-group" id="<%= id %>" style="<%= style %>">',
'<button type="button" class="btn dropdown-toggle <%= cls %>" data-toggle="dropdown">',
'<% if (iconCls != "") { %>',
'<i class="btn-icon <%= iconCls %>">&nbsp;</i>',
'<i class="icon <%= iconCls %>">&nbsp;</i>',
'<% } %>',
'<span class="caption"><%= caption %></span>',
'<span class="caret img-commonctrl"></span>',
@ -157,7 +157,7 @@ define([
'<div class="btn-group split" id="<%= id %>" style="<%= style %>">',
'<button type="button" class="btn <%= cls %>">',
'<% if (iconCls != "") { %>',
'<i class="btn-icon <%= iconCls %>">&nbsp;</i>',
'<i class="icon <%= iconCls %>">&nbsp;</i>',
'<% } %>',
'<span class="caption"><%= caption %></span>',
'</button>',
@ -447,7 +447,7 @@ define([
},
setIconCls: function(cls) {
var btnIconEl = $(this.el).find('span.btn-icon'),
var btnIconEl = $(this.el).find('.icon'),
oldCls = this.iconCls;
this.iconCls = cls;

8
apps/common/main/resources/less/asc-mixins.less
View file

@ -104,9 +104,9 @@
}
.button-otherstates-icon2(@icon-class, @icon-size) {
button.@{icon-class}.active > .btn-icon,
button.@{icon-class}:active > .btn-icon {background-position-x: -1*@icon-size; --bgX: -(1*@icon-size);}
button.@{icon-class}.disabled > .btn-icon {background-position-x: -2*@icon-size; --bgX: -(2*@icon-size);}
button.@{icon-class}.active > .icon,
button.@{icon-class}:active > .icon {background-position-x: -1*@icon-size; --bgX: -(1*@icon-size);}
button.@{icon-class}.disabled > .icon {background-position-x: -2*@icon-size; --bgX: -(2*@icon-size);}
}
.menu-icon-normal(@icon-class, @index, @icon-size) {
@ -139,7 +139,7 @@
@common-controls-width: 100px;
.img-commonctrl,
.theme-colorpalette .color-transparent, .palette-color-ext .color-transparent, .dropdown-menu li .checked:before, .input-error:before,
.btn-toolbar .btn-icon.img-commonctrl {
.btn-toolbar .icon.img-commonctrl {
background-image: data-uri(%("%s",'@{common-image-path}/@{common-controls}'));
background-repeat: no-repeat;

12
apps/common/main/resources/less/buttons.less
View file

@ -103,7 +103,7 @@
padding: 0 5px 0 2px;
}
.btn-icon {
.icon {
padding: 0;
margin: 0;
display: inline-block;
@ -122,7 +122,7 @@
// Large size
// ------------------------
&.large {
.btn-icon {
.icon {
width: 30px !important;
height: 30px;
line-height: 20px;
@ -163,7 +163,7 @@
color: #fff;
}
span.btn-icon {
.icon {
display: inline-block;
position: relative;
width: 20px;
@ -292,7 +292,7 @@
.box-shadow(none);
background-color: transparent;
.btn-icon {
.icon {
position: relative;
min-width: inherit;
height: inherit;
@ -375,7 +375,7 @@
border: 1px solid @input-border;
.border-radius(@border-radius-small);
.btn-icon {
.icon {
width: 28px;
padding: 0;
margin: 0;
@ -411,7 +411,7 @@
border: 1px solid @input-border;
.border-radius(@border-radius-small);
.btn-icon {
.icon {
display: inline-block;
.btn.btnsize(52px);
padding: 0;

6
apps/documenteditor/main/app/controller/Statusbar.js
View file

@ -178,7 +178,7 @@ define([
this.showNewChangesTip = !(value && parseInt(value) == 1) && !this.statusbar.mode.isLightVersion;
if (this.statusbar.mode.isReviewOnly) {
var iconEl = $('.btn-icon', this.statusbar.btnReview.cmpEl);
var iconEl = $('.icon', this.statusbar.btnReview.cmpEl);
(this.api.asc_HaveRevisionsChanges()) ? iconEl.removeClass(this.statusbar.btnReviewCls).addClass('btn-ic-changes') : iconEl.removeClass('btn-ic-changes').addClass(this.statusbar.btnReviewCls);
this.statusbar.mnuTrackChanges.setDisabled(true);
this.changeReviewStatus(true);
@ -195,7 +195,7 @@ define([
if (!doc_review)
this.changeReviewStatus(false);
else {
var iconEl = $('.btn-icon', this.statusbar.btnReview.cmpEl);
var iconEl = $('.icon', this.statusbar.btnReview.cmpEl);
(this.api.asc_HaveRevisionsChanges()) ? iconEl.removeClass(this.statusbar.btnReviewCls).addClass('btn-ic-changes') : iconEl.removeClass('btn-ic-changes').addClass(this.statusbar.btnReviewCls);
if (value!==null && parseInt(value) == 1) {
this.changeReviewStatus(!this.statusbar.mode.isLightVersion);
@ -302,7 +302,7 @@ define([
this.setStatusCaption('');
if (this.statusbar.mode.canReview) {
var iconEl = $('.btn-icon', this.statusbar.btnReview.cmpEl);
var iconEl = $('.icon', this.statusbar.btnReview.cmpEl);
(this.api.asc_HaveRevisionsChanges()) ? iconEl.removeClass(this.statusbar.btnReviewCls).addClass('btn-ic-changes') : iconEl.removeClass('btn-ic-changes').addClass(this.statusbar.btnReviewCls);
}
},

12
apps/documenteditor/main/app/template/LeftMenu.template
View file

@ -1,13 +1,13 @@
<div id="view-left-menu" class="tool-menu left">
<div class="tool-menu-btns">
<button id="left-btn-search" class="btn btn-category" content-target=""><span class="btn-icon img-toolbarmenu btn-menu-search">&nbsp;</span></button>
<button id="left-btn-search" class="btn btn-category" content-target=""><i class="icon img-toolbarmenu btn-menu-search">&nbsp;</i></button>
<!-- /** coauthoring begin **/ -->
<button id="left-btn-comments" class="btn btn-category" content-target="left-panel-comments"><span class="btn-icon img-toolbarmenu btn-menu-comments">&nbsp;</span></button>
<button id="left-btn-chat" class="btn btn-category" content-target="left-panel-chat"><span class="btn-icon img-toolbarmenu btn-menu-chat">&nbsp;</span></button>
<button id="left-btn-comments" class="btn btn-category" content-target="left-panel-comments"><i class="icon img-toolbarmenu btn-menu-comments">&nbsp;</i></button>
<button id="left-btn-chat" class="btn btn-category" content-target="left-panel-chat"><i class="icon img-toolbarmenu btn-menu-chat">&nbsp;</i></button>
<!-- /** coauthoring end **/ -->
<button id="left-btn-plugins" class="btn btn-category" content-target=""><span class="btn-icon img-toolbarmenu btn-menu-plugin">&nbsp;</span></button>
<button id="left-btn-support" class="btn btn-category" content-target=""><span class="btn-icon img-toolbarmenu btn-menu-support">&nbsp;</span></button>
<button id="left-btn-about" class="btn btn-category" content-target=""><span class="btn-icon img-toolbarmenu btn-menu-about">&nbsp;</span></button>
<button id="left-btn-plugins" class="btn btn-category" content-target=""><i class="icon img-toolbarmenu btn-menu-plugin">&nbsp;</i></button>
<button id="left-btn-support" class="btn btn-category" content-target=""><i class="icon img-toolbarmenu btn-menu-support">&nbsp;</i></button>
<button id="left-btn-about" class="btn btn-category" content-target=""><i class="icon img-toolbarmenu btn-menu-about">&nbsp;</i></button>
</div>
<div class="left-panel" style="">
<!-- /** coauthoring begin **/ -->

16
apps/documenteditor/main/app/template/RightMenu.template
View file

@ -19,13 +19,13 @@
</div>
<div class="tool-menu-btns">
<div class="ct-btn-category arrow-left" />
<button id="id-right-menu-text" class="btn btn-category arrow-left" content-target="id-paragraph-settings"><span class="btn-icon img-toolbarmenu btn-menu-text">&nbsp;</span></button>
<button id="id-right-menu-table" class="btn btn-category arrow-left" content-target="id-table-settings"><span class="btn-icon img-toolbarmenu btn-menu-table">&nbsp;</span></button>
<button id="id-right-menu-image" class="btn btn-category arrow-left" content-target="id-image-settings"><span class="btn-icon img-toolbarmenu btn-menu-image">&nbsp;</span></button>
<button id="id-right-menu-header" class="btn btn-category arrow-left" content-target="id-header-settings"><span class="btn-icon img-toolbarmenu btn-menu-header">&nbsp;</span></button>
<button id="id-right-menu-shape" class="btn btn-category arrow-left" content-target="id-shape-settings"><span class="btn-icon img-toolbarmenu btn-menu-shape">&nbsp;</span></button>
<button id="id-right-menu-chart" class="btn btn-category arrow-left" content-target="id-chart-settings"><span class="btn-icon img-toolbarmenu btn-menu-chart">&nbsp;</span></button>
<button id="id-right-menu-textart" class="btn btn-category arrow-left" content-target="id-textart-settings"><span class="btn-icon img-toolbarmenu btn-menu-textart">&nbsp;</span></button>
<button id="id-right-menu-mail-merge" class="btn btn-category arrow-left hidden" content-target="id-mail-merge-settings"><span class="btn-icon img-toolbarmenu btn-menu-mail-merge">&nbsp;</span></button>
<button id="id-right-menu-text" class="btn btn-category arrow-left" content-target="id-paragraph-settings"><i class="icon img-toolbarmenu btn-menu-text">&nbsp;</i></button>
<button id="id-right-menu-table" class="btn btn-category arrow-left" content-target="id-table-settings"><i class="icon img-toolbarmenu btn-menu-table">&nbsp;</i></button>
<button id="id-right-menu-image" class="btn btn-category arrow-left" content-target="id-image-settings"><i class="icon img-toolbarmenu btn-menu-image">&nbsp;</i></button>
<button id="id-right-menu-header" class="btn btn-category arrow-left" content-target="id-header-settings"><i class="icon img-toolbarmenu btn-menu-header">&nbsp;</i></button>
<button id="id-right-menu-shape" class="btn btn-category arrow-left" content-target="id-shape-settings"><i class="icon img-toolbarmenu btn-menu-shape">&nbsp;</i></button>
<button id="id-right-menu-chart" class="btn btn-category arrow-left" content-target="id-chart-settings"><i class="icon img-toolbarmenu btn-menu-chart">&nbsp;</i></button>
<button id="id-right-menu-textart" class="btn btn-category arrow-left" content-target="id-textart-settings"><i class="icon img-toolbarmenu btn-menu-textart">&nbsp;</i></button>
<button id="id-right-menu-mail-merge" class="btn btn-category arrow-left hidden" content-target="id-mail-merge-settings"><i class="icon img-toolbarmenu btn-menu-mail-merge">&nbsp;</i></button>
</div>
</div>

12
apps/documenteditor/main/app/template/StatusBar.template
View file

@ -34,19 +34,19 @@
<div class="caret up img-commonctrl" />
</div>
</div>
<button id="btn-doc-lang" type="button" class="btn small btn-toolbar el-edit"><span class="btn-icon btn-ic-doclang">&nbsp;</span></button>
<button id="btn-doc-spell" type="button" class="btn small btn-toolbar el-edit"><span class="btn-icon btn-ic-docspell">&nbsp;</span></button>
<button id="btn-doc-lang" type="button" class="btn small btn-toolbar el-edit"><span class="icon btn-ic-doclang">&nbsp;</span></button>
<button id="btn-doc-spell" type="button" class="btn small btn-toolbar el-edit"><span class="icon btn-ic-docspell">&nbsp;</span></button>
<div class="separator short el-edit"></div>
<div id="btn-doc-review" class="el-edit el-review" style="display: inline-block;"></div>
<div class="separator short el-edit el-review"></div>
<button id="btn-zoom-topage" type="button" class="btn small btn-toolbar"><span class="btn-icon btn-ic-zoomtopage">&nbsp;</span></button>
<button id="btn-zoom-towidth" type="button" class="btn small btn-toolbar"><span class="btn-icon btn-ic-zoomtowidth">&nbsp;</span></button>
<button id="btn-zoom-down" type="button" class="btn small btn-toolbar"><span class="btn-icon btn-ic-zoomdown">&nbsp;</span></button>
<button id="btn-zoom-topage" type="button" class="btn small btn-toolbar"><span class="icon btn-ic-zoomtopage">&nbsp;</span></button>
<button id="btn-zoom-towidth" type="button" class="btn small btn-toolbar"><span class="icon btn-ic-zoomtowidth">&nbsp;</span></button>
<button id="btn-zoom-down" type="button" class="btn small btn-toolbar"><span class="icon btn-ic-zoomdown">&nbsp;</span></button>
<div class="cnt-zoom">
<div class="dropdown-toggle" data-toggle="dropdown">
<label id="label-zoom" class="status-label">Zoom 100%</label>
</div>
</div>
<button id="btn-zoom-up" type="button" class="btn small btn-toolbar" style="margin-right:40px;"><span class="btn-icon btn-ic-zoomup">&nbsp;</span></button>
<button id="btn-zoom-up" type="button" class="btn small btn-toolbar" style="margin-right:40px;"><span class="icon btn-ic-zoomup">&nbsp;</span></button>
</div>
</div>

2
apps/documenteditor/main/resources/less/rightmenu.less
View file

@ -167,7 +167,7 @@
background-position: -250px 0;
}
.btn-toolbar .btn-icon.btn-borders-small {
.btn-toolbar .icon.btn-borders-small {
.background-ximage('@{app-image-path}/right-panels/SmallBorders.png', '@{app-image-path}/right-panels/SmallBorders@2x.png', 84px);
}

2
apps/documenteditor/main/resources/less/toolbar.less
View file

@ -216,7 +216,7 @@
}
&.masked {
button.disabled .btn-icon:not(.no-mask) {
button.disabled .icon:not(.no-mask) {
background-position-x: 0px !important;
}
.toolbar-group:not(.no-mask) {