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

Merge pull request #1303 from ONLYOFFICE/fix/forms-zoom

Browse source 
[DE forms] Open form at 100% scale
This commit is contained in:
Julia Radzhabova 2021-11-11 12:00:58 +03:00 committed by GitHub
parent 975d5cd7ea 9fc6f39137
commit 33cb981ce6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 65 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/documenteditor/forms/app/controller/ApplicationController.js
View file

@ -1016,7 +1016,7 @@ define([
this.hidePreloader();
this.onLongActionEnd(Asc.c_oAscAsyncActionType['BlockInteraction'], LoadingDocument);
var zf = (this.appOptions.customization && this.appOptions.customization.zoom ? parseInt(this.appOptions.customization.zoom) : -2);
var zf = (this.appOptions.customization && this.appOptions.customization.zoom ? parseInt(this.appOptions.customization.zoom) : 100);
(zf == -1) ? this.api.zoomFitToPage() : ((zf == -2) ? this.api.zoomFitToWidth() : this.api.zoom(zf>0 ? zf : 100));
this.createDelayedElements();

40
apps/documenteditor/forms/index.html
View file

@ -21,6 +21,12 @@
--canvas-background: #555;
}
.content-theme-dark {
--skeleton-canvas-content-background: #3a3a3a;
--skeleton-canvas-page-border: #2a2a2a;
--skeleton-canvas-line: rgba(255,255,255,.05);
}
.theme-classic-light {
}
@ -88,17 +94,26 @@
background: rgba(255, 255, 255, 0.2);
}
.loadmask > .placeholder {
background: #fbfbfb;
.loadmask .placeholder-outer {
width: 100%;
height: 100%;
padding-top: 56px;
padding-right: 14px;
}
.loadmask > .placeholder > .line {
.loadmask .placeholder {
background: #fff;
background: var(--skeleton-canvas-content-background, #fff);
width: 796px;
margin: 59px auto;
height: 100%;
border: 1px solid #bbbec2;
border: var(--scaled-one-px-value, 1px) solid var(--skeleton-canvas-page-border, #bbbec2);
padding-top: 50px;
}
.loadmask .placeholder > .line {
height: 15px;
margin: 30px;
background: rgba(0,0,0,.05);
margin: 30px 80px;
background: var(--skeleton-canvas-line, rgba(0,0,0,.05));
overflow: hidden;
position: relative;
@ -137,7 +152,16 @@
<body class="embed-body">
<script src="../../common/main/lib/util/htmlutils.js"></script>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div>
<div id="loading-mask" class="loadmask">
<div class="brendpanel">
<div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div>
</div>
<div class="placeholder-outer">
<div class="placeholder">
<div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div>
</div>
</div>
</div>
<script>
var userAgent = navigator.userAgent.toLowerCase(),

39
apps/documenteditor/forms/index.html.deploy
View file

@ -12,6 +12,12 @@
<!-- splash -->
<style type="text/css">
.content-theme-dark {
--skeleton-canvas-content-background: #3a3a3a;
--skeleton-canvas-page-border: #2a2a2a;
--skeleton-canvas-line: rgba(255,255,255,.05);
}
.loadmask {
left: 0;
top: 0;
@ -69,17 +75,27 @@
background: rgba(255, 255, 255, 0.2);
}
.loadmask > .placeholder {
background: #fbfbfb;
.loadmask .placeholder-outer {
width: 100%;
height: 100%;
padding-top: 56px;
padding-right: 14px;
}
.loadmask > .placeholder > .line {
.loadmask .placeholder {
background: #fff;
background: var(--skeleton-canvas-content-background, var(--canvas-content-background, #fff));
width: 796px;
margin: 59px auto;
height: 100%;
border: 1px solid #bbbec2;
border: var(--scaled-one-px-value, 1px) solid var(--skeleton-canvas-page-border, var(--canvas-page-border, #bbbec2));
padding-top: 50px;
}
.loadmask .placeholder > .line {
height: 15px;
margin: 30px;
margin: 30px 80px;
background: rgba(0,0,0,.05);
background: var(--skeleton-canvas-line, rgba(0,0,0,.05));
overflow: hidden;
position: relative;
@ -118,7 +134,16 @@
<body class="embed-body">
<script src="../../../../../apps/common/main/lib/util/htmlutils.js?__inline=true"></script>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div>
<div id="loading-mask" class="loadmask">
<div class="brendpanel">
<div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div>
</div>
<div class="placeholder-outer">
<div class="placeholder">
<div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div>
</div>
</div>
</div>
<script>
var userAgent = navigator.userAgent.toLowerCase(),