From 5303389420eea3149fc371012fe01e8e488818cd Mon Sep 17 00:00:00 2001
From: Julia Radzhabova <julia.radzhabova@onlyoffice.com>
Date: Thu, 11 Jun 2020 19:36:37 +0300
Subject: [PATCH] Change recent files

---
 .../main/app/view/FileMenuPanels.js           |  10 ++++-----
 apps/documenteditor/main/index.html           |   1 +
 apps/documenteditor/main/index.html.deploy    |   1 +
 apps/documenteditor/main/index_loader.html    |   1 +
 .../main/index_loader.html.deploy             |   1 +
 .../main/resources/img/file-recent.png        | Bin 895 -> 0 bytes
 .../main/resources/img/file-recent@2x.png     | Bin 1762 -> 0 bytes
 .../main/resources/img/recent-file.svg        |  10 +++++++++
 .../main/resources/less/filemenu.less         |  19 ++++++++----------
 .../main/app/view/FileMenuPanels.js           |  10 ++++-----
 apps/presentationeditor/main/index.html       |   1 +
 .../presentationeditor/main/index.html.deploy |   1 +
 .../presentationeditor/main/index_loader.html |   1 +
 .../main/index_loader.html.deploy             |   1 +
 .../main/resources/img/file-recent.png        | Bin 374 -> 0 bytes
 .../main/resources/img/file-recent@2x.png     | Bin 1040 -> 0 bytes
 .../main/resources/img/recent-file.svg        |   7 +++++++
 .../main/resources/less/leftmenu.less         |  16 +++++++--------
 .../main/app/view/FileMenuPanels.js           |  10 ++++-----
 apps/spreadsheeteditor/main/index.html        |   1 +
 apps/spreadsheeteditor/main/index.html.deploy |   1 +
 apps/spreadsheeteditor/main/index_loader.html |   1 +
 .../main/index_loader.html.deploy             |   1 +
 .../main/resources/img/file-recent.png        | Bin 377 -> 0 bytes
 .../main/resources/img/file-recent@2x.png     | Bin 521 -> 0 bytes
 .../main/resources/img/recent-file.svg        |  11 ++++++++++
 .../main/resources/less/leftmenu.less         |  16 +++++++--------
 build/documenteditor.json                     |   6 ++++++
 build/presentationeditor.json                 |   6 ++++++
 build/spreadsheeteditor.json                  |   6 ++++++
 30 files changed, 97 insertions(+), 42 deletions(-)
 delete mode 100644 apps/documenteditor/main/resources/img/file-recent.png
 delete mode 100644 apps/documenteditor/main/resources/img/file-recent@2x.png
 create mode 100644 apps/documenteditor/main/resources/img/recent-file.svg
 delete mode 100644 apps/presentationeditor/main/resources/img/file-recent.png
 delete mode 100644 apps/presentationeditor/main/resources/img/file-recent@2x.png
 create mode 100644 apps/presentationeditor/main/resources/img/recent-file.svg
 delete mode 100644 apps/spreadsheeteditor/main/resources/img/file-recent.png
 delete mode 100644 apps/spreadsheeteditor/main/resources/img/file-recent@2x.png
 create mode 100644 apps/spreadsheeteditor/main/resources/img/recent-file.svg

diff --git a/apps/documenteditor/main/app/view/FileMenuPanels.js b/apps/documenteditor/main/app/view/FileMenuPanels.js
index 6c952ac80f..56a8f3bd80 100644
--- a/apps/documenteditor/main/app/view/FileMenuPanels.js
+++ b/apps/documenteditor/main/app/view/FileMenuPanels.js
@@ -668,11 +668,11 @@ define([
                 store: new Common.UI.DataViewStore(this.recent),
                 itemTemplate: _.template([
                     '<div class="recent-wrap">',
-                        '<div class="recent-icon"',
-                            '<% if ((typeof image !== "undefined") && !_.isEmpty(image)) { %> ',
-                            ' style="background-image: url(<%= image %>);background-position: center;"',
-                            '<% } %>',
-                        '></div>',
+                        '<div class="recent-icon">',
+                            '<svg>',
+                                '<use xlink:href="#svg-file-recent"></use>',
+                            '</svg>',
+                        '</div>',
                         '<div class="file-name"><% if (typeof title !== "undefined") {%><%= Common.Utils.String.htmlEncode(title || "") %><% } %></div>',
                         '<div class="file-info"><% if (typeof folder !== "undefined") {%><%= Common.Utils.String.htmlEncode(folder || "") %><% } %></div>',
                     '</div>'
diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html
index 3430971bec..527d03ec45 100644
--- a/apps/documenteditor/main/index.html
+++ b/apps/documenteditor/main/index.html
@@ -270,6 +270,7 @@
     <img class="inline-svg" src="../../common/main/resources/img/doc-formats/rtf.svg">
     <img class="inline-svg" src="../../common/main/resources/img/doc-formats/html.svg">
     <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
+    <img class="inline-svg" src="resources/img/recent-file.svg">
     <script>
         var svgpoints = document.querySelectorAll('img.inline-svg');
         SVGInjector(svgpoints);
diff --git a/apps/documenteditor/main/index.html.deploy b/apps/documenteditor/main/index.html.deploy
index 212a08ed6c..6ac8c4f84a 100644
--- a/apps/documenteditor/main/index.html.deploy
+++ b/apps/documenteditor/main/index.html.deploy
@@ -294,6 +294,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <script data-main="app" src="../../../vendor/requirejs/require.js"></script>
 
diff --git a/apps/documenteditor/main/index_loader.html b/apps/documenteditor/main/index_loader.html
index 85341cc767..8f6506ec02 100644
--- a/apps/documenteditor/main/index_loader.html
+++ b/apps/documenteditor/main/index_loader.html
@@ -271,6 +271,7 @@
 <img class="inline-svg" src="../../common/main/resources/img/doc-formats/rtf.svg">
 <img class="inline-svg" src="../../common/main/resources/img/doc-formats/html.svg">
 <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
+<img class="inline-svg" src="resources/img/recent-file.svg">
 <script>
     var svgpoints = document.querySelectorAll('img.inline-svg');
     SVGInjector(svgpoints);
diff --git a/apps/documenteditor/main/index_loader.html.deploy b/apps/documenteditor/main/index_loader.html.deploy
index d723ba6929..3b8fe9b5a5 100644
--- a/apps/documenteditor/main/index_loader.html.deploy
+++ b/apps/documenteditor/main/index_loader.html.deploy
@@ -316,6 +316,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <div id="viewport"></div>
     <script data-main="app" src="../../../vendor/requirejs/require.js"></script>
diff --git a/apps/documenteditor/main/resources/img/file-recent.png b/apps/documenteditor/main/resources/img/file-recent.png
deleted file mode 100644
index eba0c2bd358b973a8d30b915baf9b2633d194f6c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 895
zcmV-_1AzRAP)<h;3K|Lk000e1NJLTq002k;001lq0{{R3@m3Bw0004KP)t-s0000=
zbj?h5(N22TPkY)>ecVxg-b-kwN@u1@W~EAJrb}q2N@u28eaTvV$y$BMQGVZ1e&11k
z-%)<wRCK#kb-YJ!#YSzwL}|K1Xt+UUv_WOFNMxc&WT8l8p-5z+NMxe_|Nl{b-}3bO
zT7Ajl=k)6C_jQoaXot*~tJ=TH=c2RS+2HX~f8Rl6vdGcujH1`J!sJL~p{u&#{{H{b
z+3uRO?0uf+`~3c;yzW$Wyzle;w#o9<;P;!g?atfw<Ldh4>-vnU>WQc6ho<R<rRjm9
z=;iGCcA4gKmgRSv=Go);+T{4H!tmni`mn_Cma*)Wu<OIp^u*Kj=Ir{<-1fN2^6c^Z
z^7Z}m_WkSd`*4-zZj|J1ljLfU<YkTHUy0&gh~dW7^hIpHvBmMT$ML_<^HX!Uftk})
zcfa-b{rLL+TZZ9Uh2dC(;8ud*RDj@9fZyEZ`P}9B{QUm>{r=wO`N`My+!!=20000X
zbW%=J05CB#HaR;xIXFK;M7zAby}Y~X>-6*S@bB*I@bU8V^n>gx&j0`crAb6VRCodH
z)MMM;KoAAs)V75)vmqW6wQbvaQQ_}*f_gWpeOBM@Yi)hUEG0vhO|jl&fih(IoOciz
zvu>)DN11YO{p`<xDr={eLX8cxJ_D+(nO+JtHqQMFsIq!SDb(0BuN0E3npp@98j{WP
zOQ2hcw6YLV4+fGIB~X?WD#<?q{f8pHpAGe7@MX|J=Wtf~i`YkF08Z<mI)~DG%#o4=
z>}#QucuI5?!1V+g=^&r0Y45Nnqb<D->Yz7C#{uk#FG;6^Jhs!BG?Tfw+*VrX0B}&I
z1stKBcs{O!RK%{#Byu@WD&(dfdh!rkX^6wvLU*L;pmdX5t}EM4CRWo!v<-K!0DJN1
z@iX-GP)(*13J}Q5Y)2WOK6Z3)G(L~+3+&fJifvUDz~|88stM|%bp|84iC4G~8=y9O
zjsT*FWr8Mp0CrIaEu10))Z}^!L{7l238F(l>jqs0aKZ%Dm{Xw6j;)N)G2kUpJOr+p
zAmy-~gMk^^4ctzz_;xZv?F<mm|F+lfxn4g0|JeRR|Dj(4Eh%;uTatyv&LZnK%xhXm
VbO^7yp7#I%002ovPDHLkV1lwo=$QZj

diff --git a/apps/documenteditor/main/resources/img/file-recent@2x.png b/apps/documenteditor/main/resources/img/file-recent@2x.png
deleted file mode 100644
index 2cd5361c20418bac3fe375fcd38239f63815abac..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1762
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

diff --git a/apps/documenteditor/main/resources/img/recent-file.svg b/apps/documenteditor/main/resources/img/recent-file.svg
new file mode 100644
index 0000000000..11a1850b9d
--- /dev/null
+++ b/apps/documenteditor/main/resources/img/recent-file.svg
@@ -0,0 +1,10 @@
+<svg fill="none" height="15" viewBox="0 0 15 15" width="15" xmlns="http://www.w3.org/2000/svg">
+<symbol id="svg-file-recent">
+<path d="m0 0h15v15h-15z" fill="#fff"/>
+<rect fill="#446995" height="15" rx="1" width="15"/>
+<g fill="#fff"><path d="m3 4h9v1h-9z"/>
+<path d="m3 7h9v1h-9z"/>
+<path d="m3 10h9v1h-9z"/>
+</g>
+</symbol>
+</svg>
\ No newline at end of file
diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less
index 8cf1d774f5..f3ffcc992a 100644
--- a/apps/documenteditor/main/resources/less/filemenu.less
+++ b/apps/documenteditor/main/resources/less/filemenu.less
@@ -215,8 +215,7 @@
   }
 
   .recent-wrap {
-    height: 65px;
-    padding: 10px;
+    padding: 5px 10px;
     cursor: pointer;
     font-size: 12px;
 
@@ -227,11 +226,13 @@
 
     .recent-icon {
       float: left;
-      width: 35px;
-      height: 45px;
-      margin-right: 10px;
-      .background-ximage-v2('file-recent.png', 72px, @commonimage: false);
-      background-position: 0 0;
+      width: 25px;
+      height: 25px;
+      margin-top: 2px;
+      svg {
+        width: 100%;
+        height: 100%;
+      }
     }
 
     > div:not(:first-child) {
@@ -241,10 +242,6 @@
       text-overflow: ellipsis;
     }
 
-    .file-name {
-      margin: 5px 0;
-    }
-
     .file-info {
       color: #999;
     }
diff --git a/apps/presentationeditor/main/app/view/FileMenuPanels.js b/apps/presentationeditor/main/app/view/FileMenuPanels.js
index e3fbbb4e6a..fb70e61b02 100644
--- a/apps/presentationeditor/main/app/view/FileMenuPanels.js
+++ b/apps/presentationeditor/main/app/view/FileMenuPanels.js
@@ -575,11 +575,11 @@ define([
                 store: new Common.UI.DataViewStore(this.recent),
                 itemTemplate: _.template([
                     '<div class="recent-wrap">',
-                        '<div class="recent-icon"',
-                        '<% if ((typeof image !== "undefined") && !_.isEmpty(image)) { %> ',
-                        ' style="background-image: url(<%= image %>);background-position: center;"',
-                        '<% } %>',
-                        '></div>',
+                        '<div class="recent-icon">',
+                            '<svg>',
+                                '<use xlink:href="#svg-file-recent"></use>',
+                            '</svg>',
+                        '</div>',
                         '<div class="file-name"><% if (typeof title !== "undefined") {%><%= Common.Utils.String.htmlEncode(title || "") %><% } %></div>',
                         '<div class="file-info"><% if (typeof folder !== "undefined") {%><%= Common.Utils.String.htmlEncode(folder || "") %><% } %></div>',
                     '</div>'
diff --git a/apps/presentationeditor/main/index.html b/apps/presentationeditor/main/index.html
index 6b431247ef..ba53817f6e 100644
--- a/apps/presentationeditor/main/index.html
+++ b/apps/presentationeditor/main/index.html
@@ -295,6 +295,7 @@
     <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
     <img class="inline-svg" src="../../common/main/resources/img/toolbar/shapetypes.svg">
     <img class="inline-svg" src="../../common/main/resources/img/toolbar/charttypes.svg">
+    <img class="inline-svg" src="resources/img/recent-file.svg">
     <script>
         var svgpoints = document.querySelectorAll('img.inline-svg');
         SVGInjector(svgpoints);
diff --git a/apps/presentationeditor/main/index.html.deploy b/apps/presentationeditor/main/index.html.deploy
index 4670cd9642..a7c7e8e26b 100644
--- a/apps/presentationeditor/main/index.html.deploy
+++ b/apps/presentationeditor/main/index.html.deploy
@@ -339,6 +339,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <script data-main="app" src="../../../vendor/requirejs/require.js"></script>
 
diff --git a/apps/presentationeditor/main/index_loader.html b/apps/presentationeditor/main/index_loader.html
index d789d56807..ea20a977b2 100644
--- a/apps/presentationeditor/main/index_loader.html
+++ b/apps/presentationeditor/main/index_loader.html
@@ -259,6 +259,7 @@
 <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
 <img class="inline-svg" src="../../common/main/resources/img/toolbar/shapetypes.svg">
 <img class="inline-svg" src="../../common/main/resources/img/toolbar/charttypes.svg">
+<img class="inline-svg" src="resources/img/recent-file.svg">
 <script>
     var svgpoints = document.querySelectorAll('img.inline-svg');
     SVGInjector(svgpoints);
diff --git a/apps/presentationeditor/main/index_loader.html.deploy b/apps/presentationeditor/main/index_loader.html.deploy
index 7417a7cd3a..c06af9dca4 100644
--- a/apps/presentationeditor/main/index_loader.html.deploy
+++ b/apps/presentationeditor/main/index_loader.html.deploy
@@ -313,6 +313,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <div id="viewport"></div>
 
diff --git a/apps/presentationeditor/main/resources/img/file-recent.png b/apps/presentationeditor/main/resources/img/file-recent.png
deleted file mode 100644
index 72d41a44448d4908892dfa473b35cb89161a3792..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 374
zcmeAS@N?(olHy`uVBq!ia0vp^YCx>d!3-pKyzvMDQl$YtA+A7rYpC+JFy$R#Dsb{{
zhBgG9P1HD_sIe(T8HhFpD*+LZ@&Et-dpU+cHc-u*m2GcUwg0$x;qQ;H_i_v#Ryh9q
z@$Kj18$X}i{PEz*&&St)+`n`#QRC;6TR?M8$E*MQ{p(V)W{SefOrXVrB|(0{3>KEw
z_D(Ll_w0TB<;&+!A3tn3==KCCIp5R8F{Fa=?WJI*!ww=27q7S&@GLv@uRKDS-}L==
z$%DJAMHxfRzcpqw{q$K!tdvVfY-=|Vd#OmfeV&!t)#+Iu*POCCFU8Hf+gN+6prb&F
z;ju^W=IBHia3rRQXB}l?HI{r6!Jk&uuWBH@{)Sf5TBD|jlBsSp?ihA%Fu1!yM`e9^
zoRo0?(wIpWsXy(XFh>?#s=s)7Uw3F>=;wR8C8so`l<&N8)dlEO22WQ%mvv4FO#pAI
Brau4x

diff --git a/apps/presentationeditor/main/resources/img/file-recent@2x.png b/apps/presentationeditor/main/resources/img/file-recent@2x.png
deleted file mode 100644
index 6e378de8290d6f6a668480a8ed6a83e00294cb9b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1040
zcmeAS@N?(olHy`uVBq!ia0vp^K0qAD!3-q#g)?<BFfe8W_=LCuxp1&AQWef7kFhRD
zX@8U|5N!!n-W-Aj-AdQ`|NsBp4DF4<N_R7L{{Q>?_s7@ICpUjNv*X+KW8d$d|M~3B
z@AohNe);gQ()r)-U)NH#c804w>5P24uJ`Tw{+Dyh?qzB}>5O{TpY&`(%Ja$T&nIWR
zn4bG`Zt3IZz?btYUM;A4v$E~Ys*d}a+IO>b-)@-jcH_kN+h)GsKI_B2B_9tg|9Ei4
zy&S{Or?%e9HTrtx(6_5czFj-|?b@+>dB*qhO}^i~@Z-_7`$d+&p5OcR;{LCf4}QIR
z^q|=K&&St)KE3_(<^6*ao4?;aKPa{R_w)O|AK(7{`T_LOzdyg9=ITDIayb^Ob~r|D
zSA@#LYPW|qZvX%OeN^NA|KGpIjsAvfnni$Ns#X%@7tGDY$-&OX%EHXV$iTzP$1f-(
zEFvl?Ei1?Fvt`eoz5Dj>-nDbbBi>h&4=^w=8G5=nhEy=Vz1do|*g>T2Axrzw)g`f3
z?JA}D*Y5(s-*4v5^OhMk%SJrk-C)ku@@Ffr>a~MCGO9^aE|vP8owDp@)t>NfozRKQ
zfg+QH7BfW#nw~nEv`cIMUEa#u8ifW~oazeY#k*DHmUXBpY$#ZMBxzPmd4R;?t%jxs
zwlZSxCP?^fsZkNjn=WzYooix`o8dwRvAk(sM-J%*bxK@4b@<TQpu{)MH*#l(h*bam
z_xMiHYzv8f|5=Pr9VuDt;<GraY)$F+SC7Iwyf1D_?6qC4*ULDe?CeGV1Ns4_%Cgxq
zyZj})E=IXGM8{scwDD!3)2@gsOdpI~L;Vjwlb`ri!jfx_jN`@LlsCVP4<+eWzMmaE
zd27m>Pb?1;Qbcal7<(M_6V|)-hsVcu+6uKK^W{GzBA+Cbacy%++F+RQ%J;C_qYa)c
zW`gZ!6*gRx(%D$@CR)$O<JdBe?UEv8v-^D)ZQ!nXBgJ+5{Bf~>8z<RqUY|ALYF3pi
z<12`G%$03h*Ky>*%e`N(byprp`tavk)a#RW2a*du))Y@Q{m1t~;_ZhMtNXq@{dJH{
z<WPqBH#zI#Z$BEXe<V-7{J$wQqIDwAU#>O3Oji4EKD5gJGyf5-HHVHE85Bxx{<COC
zzHV~k%d=ve(`=1jBz)2Tv+$wPwGR`V|3^m2iQl=m?_Z;12=m|Cz3Vi!c5Sq&p3(RG
zyV7Ud<02`hhm?HR%%0YJ#^|-u))^}~0=LL-)oqsCSm1hE%y|97Xt|B2Ub9CBR~~Mx
R=3xb8VNX{-mvv4FO#ogh?_>Y~

diff --git a/apps/presentationeditor/main/resources/img/recent-file.svg b/apps/presentationeditor/main/resources/img/recent-file.svg
new file mode 100644
index 0000000000..88d9975b86
--- /dev/null
+++ b/apps/presentationeditor/main/resources/img/recent-file.svg
@@ -0,0 +1,7 @@
+<svg fill="none" height="15" viewBox="0 0 15 15" width="15" xmlns="http://www.w3.org/2000/svg">
+<symbol id="svg-file-recent">
+<path d="m0 0h15v15h-15z" fill="#fff"/>
+<rect fill="#a95153" height="15" rx="1" width="15"/>
+<path d="m2.5 3.5h10v8h-10z" stroke="#fff"/>
+</symbol>
+</svg>
\ No newline at end of file
diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less
index 82edc91903..8b771da05c 100644
--- a/apps/presentationeditor/main/resources/less/leftmenu.less
+++ b/apps/presentationeditor/main/resources/less/leftmenu.less
@@ -283,8 +283,7 @@
             }
 
             .recent-wrap {
-                height: 65px;
-                padding: 10px;
+                padding: 5px 10px;
                 cursor: pointer;
                 font-size: 12px;
 
@@ -295,11 +294,13 @@
 
                 .recent-icon {
                     float: left;
-                    width: 35px;
-                    height: 45px;
-                    margin-right: 10px;
-                    .background-ximage-v2('file-recent.png', 38px, @commonimage: false);
-                    background-position: 0 0;
+                    width: 25px;
+                    height: 25px;
+                    margin-top: 2px;
+                    svg {
+                        width: 100%;
+                        height: 100%;
+                    }
                 }
 
                 .file-name {
@@ -307,7 +308,6 @@
                     overflow: hidden;
                     white-space: nowrap;
                     text-overflow: ellipsis;
-                    margin: 5px 0;
                 }
 
                 .file-info {
diff --git a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js
index a232f60b7d..b80f29e8f4 100644
--- a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js
+++ b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js
@@ -1392,11 +1392,11 @@ define([
                 store: new Common.UI.DataViewStore(this.recent),
                 itemTemplate: _.template([
                     '<div class="recent-wrap">',
-                        '<div class="recent-icon"',
-                        '<% if ((typeof image !== "undefined") && !_.isEmpty(image)) { %> ',
-                        ' style="background-image: url(<%= image %>);background-position: center;"',
-                        '<% } %>',
-                        '></div>',
+                        '<div class="recent-icon">',
+                            '<svg>',
+                                '<use xlink:href="#svg-file-recent"></use>',
+                            '</svg>',
+                        '</div>',
                         '<div class="file-name"><% if (typeof title !== "undefined") {%><%= Common.Utils.String.htmlEncode(title || "") %><% } %></div>',
                         '<div class="file-info"><% if (typeof folder !== "undefined") {%><%= Common.Utils.String.htmlEncode(folder || "") %><% } %></div>',
                     '</div>'
diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html
index df089ec3ab..b63b001a9a 100644
--- a/apps/spreadsheeteditor/main/index.html
+++ b/apps/spreadsheeteditor/main/index.html
@@ -309,6 +309,7 @@
     <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
     <img class="inline-svg" src="../../common/main/resources/img/toolbar/shapetypes.svg">
     <img class="inline-svg" src="../../common/main/resources/img/toolbar/charttypes.svg">
+    <img class="inline-svg" src="resources/img/recent-file.svg">
     <script>
         var svgpoints = document.querySelectorAll('img.inline-svg');
         SVGInjector(svgpoints);
diff --git a/apps/spreadsheeteditor/main/index.html.deploy b/apps/spreadsheeteditor/main/index.html.deploy
index 66ddd9c6bb..5b8efe847f 100644
--- a/apps/spreadsheeteditor/main/index.html.deploy
+++ b/apps/spreadsheeteditor/main/index.html.deploy
@@ -352,6 +352,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <script data-main="app" src="../../../vendor/requirejs/require.js"></script>
 </body>
diff --git a/apps/spreadsheeteditor/main/index_loader.html b/apps/spreadsheeteditor/main/index_loader.html
index 98d4369eb8..7c90b3f1b6 100644
--- a/apps/spreadsheeteditor/main/index_loader.html
+++ b/apps/spreadsheeteditor/main/index_loader.html
@@ -262,6 +262,7 @@
 <img class="inline-svg" src="../../common/main/resources/img/doc-formats/blank.svg">
 <img class="inline-svg" src="../../common/main/resources/img/toolbar/shapetypes.svg">
 <img class="inline-svg" src="../../common/main/resources/img/toolbar/charttypes.svg">
+<img class="inline-svg" src="resources/img/recent-file.svg">
 <script>
     var svgpoints = document.querySelectorAll('img.inline-svg');
     SVGInjector(svgpoints);
diff --git a/apps/spreadsheeteditor/main/index_loader.html.deploy b/apps/spreadsheeteditor/main/index_loader.html.deploy
index 551ecbf113..0f844cf6fb 100644
--- a/apps/spreadsheeteditor/main/index_loader.html.deploy
+++ b/apps/spreadsheeteditor/main/index_loader.html.deploy
@@ -313,6 +313,7 @@
     <inline src="resources/img/doc-formats/blank.svg" />
     <inline src="resources/img/toolbar/shapetypes.svg" />
     <inline src="resources/img/toolbar/charttypes.svg" />
+    <inline src="resources/img/recent-file.svg" />
 
     <div id="viewport"></div>
 
diff --git a/apps/spreadsheeteditor/main/resources/img/file-recent.png b/apps/spreadsheeteditor/main/resources/img/file-recent.png
deleted file mode 100644
index 8e7189b0681118d3f1556431a6a7b4e32398c7a0..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 377
zcmeAS@N?(olHy`uVBq!ia0vp^YCx>d!3-pKyzvMDQuzTsA+A8WxZAS0+p4733QqQ{
zbc3L#xsJ{AoC-TEfT*Aygn*2%-#^aXnzrlo%*QXUz5o1j&4EUsI8gnR^<gjH-9LY8
z=ba~K4_;WZWLF7LZ}U9I)&))tvmLJ8KfL*9ul%aSc|a=#OM?7@87wTV?VVh9@7eqM
z%a_leK7QD6(CrCOa)qahV@O5Z+so}-hYbXnFO<Ar_*usD`~Ujn{v}hGj-)SeP!w(8
zv6*1F<5!i~KK0iZ)j!wnls)cxMpn)B%-iKaoTg-LeXdN;uzqiWnbK>clxYR|yC0t0
zAdt9|LoLN!SBbf|y<mIG6+f<?bkU><66cw=J#aKxG<_!10vESq5y>7&rc?44ur3QI
z&NPX1yDP`IT;}rn+n;kz7%cjp$WZ_A{ItrgtLm)%*UMMPys6Rn0CY2hr>mdKI;Vst
E04@Zm#Q*>R

diff --git a/apps/spreadsheeteditor/main/resources/img/file-recent@2x.png b/apps/spreadsheeteditor/main/resources/img/file-recent@2x.png
deleted file mode 100644
index cb015996037cb686a4c15459d1320c86e669451a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 521
zcmeAS@N?(olHy`uVBq!ia0vp^K0qAD!3-q#g)?;msiFX%5LX~wG0~=HrCa4B8z3s`
zvMlO^qQXu~AcAm#3Lxm~_m6j;oIQA9$>yWI1??77)`vZQd2PwA5}@q+&oAe0O*?sY
z{h9-frG3^f-`&4<|8VVe`<khCWqsCN%Uw%*t#+NB8SVag2hdi5k|4ie26me*d-m+!
zwR6Ybefw|Ty?<->?bi$pjAouLjv*C{Z?CnMIT;GHBs%SNO-sJs@awmI(%#_hIj^kU
zH@<&z+<n`n-t@Qb+n>c9TK2ZReADMi*TfPEZ-*XP5qj{^wACF)eZvJ8hp~1`uTv5$
zk9F;t#TI?+_FGHSGKrm?my?dOyPv+jHhUxc?~5}M+a%L&IJvZaySJxf$)(Ah4M%Nd
z8uZV-u}(O;c!}r)(epFe4_sh$SbQK#@xTeCo`o|fE~?3%b8lWc!>+i_t-q&pC{K-e
z#gMo}D4V(AfCuZb05>gzHlv{CkD{*YkKN#Gv5GkGbk~w2Kc+n86VN?YzLx#L*N7cy
zPbOVSda1U7Q9-I_;`aF5xOUbFCwO!ZNu1Po4@~HJa($crafy@fqfA<F{Pk#i=Jcjc
zWqreTdp)3AK@R?AzhULMS#}4G75AFT_s7jXTgJz}?x`%V)UQTh=rVY^`njxgN@xNA
Dm_heS

diff --git a/apps/spreadsheeteditor/main/resources/img/recent-file.svg b/apps/spreadsheeteditor/main/resources/img/recent-file.svg
new file mode 100644
index 0000000000..2454629a36
--- /dev/null
+++ b/apps/spreadsheeteditor/main/resources/img/recent-file.svg
@@ -0,0 +1,11 @@
+<svg fill="none" height="15" viewBox="0 0 15 15" width="15" xmlns="http://www.w3.org/2000/svg">
+<symbol id="svg-file-recent">
+    <path d="m0 0h15v15h-15z" fill="#fff"/>
+    <rect fill="#42865e" height="15" rx="1" width="15"/>
+    <path d="m2.5 3.5h10v8h-10z" stroke="#fff"/>
+    <g fill="#fff">
+        <path d="m2 7h10v1h-10z"/>
+        <path d="m7 4h1v7h-1z"/>
+    </g>
+</symbol>
+</svg>
\ No newline at end of file
diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less
index 4ca403a1de..b023ab056e 100644
--- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less
+++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less
@@ -336,8 +336,7 @@
             }
 
             .recent-wrap {
-                height: 65px;
-                padding: 10px;
+                padding: 5px 10px;
                 cursor: pointer;
                 font-size: 12px;
 
@@ -348,11 +347,13 @@
 
                 .recent-icon {
                     float: left;
-                    width: 35px;
-                    height: 45px;
-                    margin-right: 10px;
-                    .background-ximage-v2('file-recent.png', 38px, @commonimage: false);
-                    background-position: 0 0;
+                    width: 25px;
+                    height: 25px;
+                    margin-top: 2px;
+                    svg {
+                        width: 100%;
+                        height: 100%;
+                    }
                 }
 
                 .file-name {
@@ -360,7 +361,6 @@
                     overflow: hidden;
                     white-space: nowrap;
                     text-overflow: ellipsis;
-                    margin: 5px 0;
                 }
 
                 .file-info {
diff --git a/build/documenteditor.json b/build/documenteditor.json
index 4793a5c2ba..13c6c8be66 100644
--- a/build/documenteditor.json
+++ b/build/documenteditor.json
@@ -190,6 +190,12 @@
                     "cwd": "../apps/common/main/resources/img",
                     "src": "**/*.svg",
                     "dest": "../deploy/web-apps/apps/documenteditor/main/resources/img"
+                },
+                {
+                    "expand": true,
+                    "cwd": "../apps/documenteditor/main/resources/img",
+                    "src": "**/*.svg",
+                    "dest": "../deploy/web-apps/apps/documenteditor/main/resources/img"
                 }
             ],
             "clean": [
diff --git a/build/presentationeditor.json b/build/presentationeditor.json
index f5263ba0e4..29bf6d14cf 100644
--- a/build/presentationeditor.json
+++ b/build/presentationeditor.json
@@ -184,6 +184,12 @@
                     "cwd": "../apps/common/main/resources/img",
                     "src": "**/*.svg",
                     "dest": "../deploy/web-apps/apps/presentationeditor/main/resources/img"
+                },
+                {
+                    "expand": true,
+                    "cwd": "../apps/presentationeditor/main/resources/img",
+                    "src": "**/*.svg",
+                    "dest": "../deploy/web-apps/apps/presentationeditor/main/resources/img"
                 }
             ],
             "clean": [
diff --git a/build/spreadsheeteditor.json b/build/spreadsheeteditor.json
index 62a6924b00..8c95362b89 100644
--- a/build/spreadsheeteditor.json
+++ b/build/spreadsheeteditor.json
@@ -198,6 +198,12 @@
                     "cwd": "../apps/common/main/resources/img",
                     "src": "**/*.svg",
                     "dest": "../deploy/web-apps/apps/spreadsheeteditor/main/resources/img"
+                },
+                {
+                    "expand": true,
+                    "cwd": "../apps/spreadsheeteditor/main/resources/img",
+                    "src": "**/*.svg",
+                    "dest": "../deploy/web-apps/apps/spreadsheeteditor/main/resources/img"
                 }
             ],
             "clean": [