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

Merge pull request #1210 from ONLYOFFICE/feature/gradient-fill-direction

Browse source 
Feature/gradient fill direction
This commit is contained in:
Julia Radzhabova 2021-09-28 17:56:47 +03:00 committed by GitHub
parent bdae240b6e 501043f04c
commit dca3fb4386
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 53 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1371,7 +1371,9 @@ define([
restoreHeight: 174,
allowScrollbar: false,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background: '
+'<% if(type!=2) {%>linear-gradient(<%= type + 90 %>deg,#000, #fff)'
+' <%} else {%> radial-gradient( #000 , #fff 70%) <%}%>;"></div>')
});
});
this.btnDirection.render($('#shape-button-direction'));

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

@ -39,7 +39,7 @@
}
.item-gradient {
.background-ximage-all('right-panels/gradients.png', 150px);
//.background-ximage-all('right-panels/gradients.png', 150px);
width:50px;
height:50px;
@ -49,40 +49,44 @@
margin-right: 62px !important;
}
.item-gradient-separator {
margin-right: 62px !important;
}
.gradient-left-top {
background-position: 0 0;
background: linear-gradient(to bottom right, #000, #fff);
}
.gradient-top {
background-position: -50px 0;
background: linear-gradient(to bottom, #000, #fff);
}
.gradient-right-top {
background-position: -100px 0;
background: linear-gradient(to bottom left, #000, #fff);
}
.gradient-left {
background-position: 0 -50px;
background: linear-gradient(to right, #000, #fff);
}
.gradient-right {
background-position: -100px -50px;
background: linear-gradient(to left, #000, #fff);
}
.gradient-left-bottom {
background-position: 0 -100px;
background: linear-gradient(to top right, #000, #fff);
}
.gradient-bottom {
background-position: -50px -100px;
background: linear-gradient(to top, #000, #fff);
}
.gradient-right-bottom {
background-position: -100px -100px;
background: linear-gradient(to top left, #000, #fff);
}
.gradient-radial-center {
background-position: -100px -150px;
background: radial-gradient( #000 , #fff 70%);
}
#signature-requested-sign,

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

@ -1284,7 +1284,9 @@ define([
parentMenu: btn.menu,
restoreHeight: 174,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background: '
+'<% if(type!=2) {%>linear-gradient(<%= type + 90 %>deg,#000, #fff)'
+' <%} else {%> radial-gradient( #000 , #fff 70%) <%}%>;"></div>')
});
});
this.btnDirection.render($('#shape-button-direction'));

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

@ -791,7 +791,9 @@ define([
parentMenu: btn.menu,
restoreHeight: 174,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background: '
+'<% if(type!=2) {%>linear-gradient(<%= type + 90 %>deg,#000, #fff)'
+' <%} else {%> radial-gradient( #000 , #fff 70%) <%}%>;"></div>')
});
});
this.btnDirection.render($('#slide-button-direction'));

23
apps/presentationeditor/main/resources/less/rightmenu.less
View file

@ -33,7 +33,6 @@
}
.item-gradient {
.background-ximage-all('right-panels/gradients.png', 150px);
width:50px;
height:50px;
}
@ -42,40 +41,44 @@
margin-right: 62px !important;
}
.item-gradient-separator {
margin-right: 62px !important;
}
.gradient-left-top {
background-position: 0 0;
background: linear-gradient(to bottom right, #000, #fff);
}
.gradient-top {
background-position: -50px 0;
background: linear-gradient(to bottom, #000, #fff);
}
.gradient-right-top {
background-position: -100px 0;
background: linear-gradient(to bottom left, #000, #fff);
}
.gradient-left {
background-position: 0 -50px;
background: linear-gradient(to right, #000, #fff);
}
.gradient-right {
background-position: -100px -50px;
background: linear-gradient(to left, #000, #fff);
}
.gradient-left-bottom {
background-position: 0 -100px;
background: linear-gradient(to top right, #000, #fff);
}
.gradient-bottom {
background-position: -50px -100px;
background: linear-gradient(to top, #000, #fff);
}
.gradient-right-bottom {
background-position: -100px -100px;
background: linear-gradient(to top left, #000, #fff);
}
.gradient-radial-center {
background-position: -100px -150px;
background: radial-gradient( #000 , #fff 70%);
}
#signature-requested-sign,

4
apps/spreadsheeteditor/main/app/view/ShapeSettings.js
View file

@ -1310,7 +1310,9 @@ define([
parentMenu: btn.menu,
restoreHeight: 174,
store: new Common.UI.DataViewStore(me._viewDataLinear),
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background-position: -<%= offsetx %>px -<%= offsety %>px;"></div>')
itemTemplate: _.template('<div id="<%= id %>" class="item-gradient" style="background: '
+'<% if(type!=2) {%>linear-gradient(<%= type + 90 %>deg,#000, #fff)'
+' <%} else {%> radial-gradient( #000 , #fff 70%) <%}%>;"></div>')
});
});
this.btnDirection.render($('#shape-button-direction'));

24
apps/spreadsheeteditor/main/resources/less/rightmenu.less
View file

@ -27,7 +27,7 @@
}
.item-gradient {
.background-ximage-all('right-panels/gradients.png', 150px);
//.background-ximage-all('right-panels/gradients.png', 150px);
width:50px;
height:50px;
}
@ -36,40 +36,44 @@
margin-right: 62px !important;
}
.item-gradient-separator {
margin-right: 62px !important;
}
.gradient-left-top {
background-position: 0 0;
background: linear-gradient(to bottom right, #000, #fff);
}
.gradient-top {
background-position: -50px 0;
background: linear-gradient(to bottom, #000, #fff);
}
.gradient-right-top {
background-position: -100px 0;
background: linear-gradient(to bottom left, #000, #fff);
}
.gradient-left {
background-position: 0 -50px;
background: linear-gradient(to right, #000, #fff);
}
.gradient-right {
background-position: -100px -50px;
background: linear-gradient(to left, #000, #fff);
}
.gradient-left-bottom {
background-position: 0 -100px;
background: linear-gradient(to top right, #000, #fff);
}
.gradient-bottom {
background-position: -50px -100px;
background: linear-gradient(to top, #000, #fff);
}
.gradient-right-bottom {
background-position: -100px -100px;
background: linear-gradient(to top left, #000, #fff);
}
.gradient-radial-center {
background-position: -100px -150px;
background: radial-gradient( #000 , #fff 70%);
}
.item-wrap {