nodejs: redesign

This commit is contained in:
Alexandr Fedorov
2021-03-16 00:06:26 +03:00
parent 89e6ac8571
commit 3c1eab070d
17 changed files with 573 additions and 346 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 682 B

View File

@ -0,0 +1,8 @@
<svg width="30" height="40" viewBox="0 0 30 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 3C0 1.34315 1.34315 0 3 0H21.674C22.4697 0 23.2327 0.316071 23.7953 0.87868L29.1213 6.20465C29.6839 6.76726 30 7.53032 30 8.32597V37C30 38.6569 28.6569 40 27 40H3C1.34315 40 0 38.6569 0 37V3Z" fill="#3779A6"/>
<path d="M22.9167 0L30.0001 7.08333H25.9167C24.2599 7.08333 22.9167 5.74019 22.9167 4.08333V0Z" fill="#1D5880"/>
<path d="M6.17627 14.7059H23.8233V15.8823H6.17627V14.7059Z" fill="white"/>
<path d="M6.17627 18.5294H23.8233V19.7059H6.17627V18.5294Z" fill="white"/>
<path d="M6.17627 22.3529H23.8233V23.5294H6.17627V22.3529Z" fill="white"/>
<path d="M6.17627 26.1765H23.8233V27.3529H6.17627V26.1765Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 738 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 728 B

View File

@ -0,0 +1,8 @@
<svg width="30" height="40" viewBox="0 0 30 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 3C0 1.34315 1.34315 0 3 0H22.9167L30 7.08333V37C30 38.6569 28.6569 40 27 40H3C1.34315 40 0 38.6569 0 37V3Z" fill="#F36700"/>
<path d="M22.9167 0L30.0001 7.08333H25.9168C24.2599 7.08333 22.9167 5.74019 22.9167 4.08333V0Z" fill="#AB531F"/>
<path d="M6.17627 16.1275H23.8233V17.3039H6.17627V16.1275Z" fill="white"/>
<path d="M6.17627 28.7745L6.17627 16.1275L7.35274 16.1275L7.35274 28.7745H6.17627Z" fill="white"/>
<path d="M23.8233 16.1275V28.7745H22.6469V16.1275L23.8233 16.1275Z" fill="white"/>
<path d="M6.17627 27.598H23.8233V28.7745H6.17627L6.17627 27.598Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 691 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,6 @@
<svg width="30" height="40" viewBox="0 0 30 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M30 7.44186L22 0H3C1.22739 0 0 0.822551 0 2.32558V37.2093C0 38.7123 1.22739 40 3 40H27C28.7726 40 30 38.7123 30 37.2093V7.44186Z" fill="#D0D5DA"/>
<path d="M24.1042 7.27273H29.9631L22 0V5.32334C22 6.4105 22.949 7.27273 24.1042 7.27273Z" fill="#646464"/>
<path d="M16.9562 22.3485H12.9746V17.803H10.9839L14.9654 14.1667L18.947 17.803H16.9562V22.3485Z" fill="#646464"/>
<path d="M20.9378 23.7121C20.9378 24.1666 20.4401 24.6212 19.9424 24.6212H9.98848C9.49078 24.6212 8.99309 24.1666 8.99309 23.7121V22.3485C8.99309 21.8939 9.49078 21.4394 9.98848 21.4394H10.9839V20.0757H9.49078C8.49539 20.0757 7.5 20.9848 7.5 21.8939V24.1666C7.5 25.0757 8.61982 25.9848 9.49078 25.9848H20.4401C21.3111 25.9848 22.4309 25.0757 22.4309 24.1666V21.8939C22.4309 20.9848 21.4355 20.0757 20.4401 20.0757H18.947V21.4394H19.9424C20.4401 21.4394 20.9378 21.8939 20.9378 22.3485V23.7121Z" fill="#646464"/>
</svg>

After

Width:  |  Height:  |  Size: 992 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 744 B

View File

@ -0,0 +1,12 @@
<svg width="30" height="40" viewBox="0 0 30 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 3C0 1.34315 1.34315 0 3 0H22.9167L30 7.08333V37C30 38.6569 28.6569 40 27 40H3C1.34315 40 0 38.6569 0 37V3Z" fill="#78A73B"/>
<path d="M22.9167 0L30.0001 7.08333H25.9168C24.2599 7.08333 22.9167 5.74019 22.9167 4.08333V0Z" fill="#5A7D2B"/>
<path d="M6.17644 15.2941H23.8235V16.4706H6.17644V15.2941Z" fill="white"/>
<path d="M6.17644 19.1177H23.8235V20.2941H6.17644V19.1177Z" fill="white"/>
<path d="M6.17644 22.9412H23.8235V24.1177H6.17644V22.9412Z" fill="white"/>
<path d="M6.17644 26.7647H23.8235V27.9412H6.17644V26.7647Z" fill="white"/>
<path d="M5.88232 27.9412L5.88232 15.2941L7.0588 15.2941L7.0588 27.9412H5.88232Z" fill="white"/>
<path d="M11.4706 27.9412L11.4706 15.2941L12.647 15.2941V27.9412H11.4706Z" fill="white"/>
<path d="M17.0588 27.9412L17.0588 15.2941L18.2353 15.2941V27.9412H17.0588Z" fill="white"/>
<path d="M22.647 27.9412V15.2941H23.8235V27.9412H22.647Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 1004 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,12 @@
<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.84616 1H10.8462L14.8462 5V15H2.84616V1Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.8462 5L10.8462 1H2.84616V15H14.8462V5ZM10.8462 0L15.8462 5V16H1.84616V0H10.8462Z" fill="#BFBFBF"/>
<rect x="3.84616" y="10" width="10" height="4" fill="#3779A6"/>
<path d="M3.84616 4H4.84616V5H3.84616V4Z" fill="#BFBFBF"/>
<path d="M3.84616 6H4.84616V7H3.84616V6Z" fill="#BFBFBF"/>
<path d="M4.84616 8H3.84616V9H4.84616V8Z" fill="#BFBFBF"/>
<path d="M12.8462 8H5.84616V9H12.8462V8Z" fill="#BFBFBF"/>
<path d="M7.84616 6H5.84616V7H7.84616V6Z" fill="#BFBFBF"/>
<path d="M12.8462 4H5.84616V5H12.8462V4Z" fill="#BFBFBF"/>
<path opacity="0.3" d="M9.84616 1H10.8462V4H14.8462L15.8462 5H9.84616V1Z" fill="#333333"/>
</svg>

After

Width:  |  Height:  |  Size: 832 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,12 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2 1H10L14 5V15H2V1Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14 5L10 1H2V15H14V5ZM10 0L15 5V16H1V0H10Z" fill="#BFBFBF"/>
<rect x="3" y="10" width="10" height="4" fill="#F36700"/>
<path d="M3 4H4V5H3V4Z" fill="#BFBFBF"/>
<path d="M3 6H4V7H3V6Z" fill="#BFBFBF"/>
<path d="M4 8H3V9H4V8Z" fill="#BFBFBF"/>
<path d="M12 8H5V9H12V8Z" fill="#BFBFBF"/>
<path d="M7 6H5V7H7V6Z" fill="#BFBFBF"/>
<path d="M12 4H5V5H12V4Z" fill="#BFBFBF"/>
<path opacity="0.3" d="M9 1H10V4H14L15 5H9V1Z" fill="#333333"/>
</svg>

After

Width:  |  Height:  |  Size: 631 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,12 @@
<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.84592 1H10.8459L14.8459 5V15H2.84592V1Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.8459 5L10.8459 1H2.84592V15H14.8459V5ZM10.8459 0L15.8459 5V16H1.84592V0H10.8459Z" fill="#BFBFBF"/>
<rect x="3.84592" y="10" width="10" height="4" fill="#78A73B"/>
<path d="M3.84592 4H4.84592V5H3.84592V4Z" fill="#BFBFBF"/>
<path d="M3.84592 6H4.84592V7H3.84592V6Z" fill="#BFBFBF"/>
<path d="M4.84592 8H3.84592V9H4.84592V8Z" fill="#BFBFBF"/>
<path d="M12.8459 8H5.84592V9H12.8459V8Z" fill="#BFBFBF"/>
<path d="M7.84592 6H5.84592V7H7.84592V6Z" fill="#BFBFBF"/>
<path d="M12.8459 4H5.84592V5H12.8459V4Z" fill="#BFBFBF"/>
<path opacity="0.3" d="M9.84592 1H10.8459V4H14.8459L15.8459 5H9.84592V1Z" fill="#333333"/>
</svg>

After

Width:  |  Height:  |  Size: 832 B

View File

@ -1,15 +1,15 @@
<svg width="248" height="53" viewBox="0 0 248 53" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="153" height="28" viewBox="0 0 153 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.9111 46.0096L7.13565 37.771C5.62145 37.0517 5.62145 35.9401 7.13565 35.2863L13.3241 32.4093L24.8453 37.771C26.3595 38.4902 28.7954 38.4902 30.2437 37.771L41.7648 32.4093L47.9533 35.2863C49.4675 36.0055 49.4675 37.1171 47.9533 37.771L30.1779 46.0096C28.7954 46.6635 26.3595 46.6635 24.9111 46.0096Z" fill="#FF6F3D"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M13.3403 27.6567L0.801116 21.8897C-0.267039 21.3862 -0.267039 20.6081 0.801116 20.1504L5.16662 18.1365L13.2939 21.8897C14.362 22.3932 16.0804 22.3932 17.1021 21.8897L25.2294 18.1365L29.5949 20.1504C30.663 20.6539 30.663 21.432 29.5949 21.8897L17.0556 27.6567C16.0804 28.1144 14.362 28.1144 13.3403 27.6567Z" fill="#FF6F3D"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.9111 35.8748L7.13565 27.6361C5.62145 26.9169 5.62145 25.8053 7.13565 25.1514L13.1925 22.3398L24.9111 27.7669C26.4253 28.4861 28.8612 28.4861 30.3096 27.7669L42.0282 22.3398L48.085 25.1514C49.5992 25.8707 49.5992 26.9823 48.085 27.6361L30.3096 35.8748C28.7953 36.594 26.3595 36.594 24.9111 35.8748Z" fill="#95C038"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M13.3403 20.5623L0.801116 14.7953C-0.267039 14.2918 -0.267039 13.5137 0.801116 13.056L5.07373 11.0879L13.3403 14.8868C14.4085 15.3903 16.1268 15.3903 17.1485 14.8868L25.4151 11.0879L29.6877 13.056C30.7559 13.5595 30.7559 14.3376 29.6877 14.7953L17.1485 20.5623C16.0804 21.0658 14.362 21.0658 13.3403 20.5623Z" fill="#95C038"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.9111 26.0014L7.13565 17.7628C5.62145 17.0435 5.62145 15.9319 7.13565 15.2781L24.9111 7.03944C26.4253 6.32019 28.8612 6.32019 30.3096 7.03944L48.085 15.2781C49.5992 15.9973 49.5992 17.1089 48.085 17.7628L30.3096 26.0014C28.7953 26.6553 26.3595 26.6553 24.9111 26.0014Z" fill="#5DC0E8"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M13.3403 13.651L0.801116 7.88393C-0.267039 7.38045 -0.267039 6.60236 0.801116 6.14466L13.3403 0.377605C14.4085 -0.125868 16.1268 -0.125868 17.1485 0.377605L29.6877 6.14466C30.7559 6.64813 30.7559 7.42622 29.6877 7.88393L17.1485 13.651C16.0804 14.1087 14.362 14.1087 13.3403 13.651Z" fill="#5DC0E8"/>
<path d="M60.085 26.4189C60.085 23.0116 61.0651 20.44 63.0906 18.7685C65.0509 17.0327 67.4031 16.197 70.0821 16.197C72.7611 16.197 75.048 17.0327 77.0083 18.7685C78.9685 20.5043 79.9486 23.0116 79.9486 26.4832C79.9486 29.8906 78.9685 32.4621 77.0083 34.1336C75.048 35.8695 72.6958 36.7052 70.0821 36.7052C67.4031 36.7052 65.1162 35.8695 63.0906 34.1336C61.0651 32.3978 60.085 29.8263 60.085 26.4189ZM64.3975 26.4189C64.3975 28.7976 64.8548 30.4692 65.7043 31.5621C66.619 32.655 67.5992 33.3622 68.6446 33.6193C68.906 33.6836 69.102 33.7479 69.3634 33.7479C69.5594 33.7479 69.8208 33.8122 70.0168 33.8122C70.2781 33.8122 70.4742 33.8122 70.7355 33.7479C70.9969 33.7479 71.1929 33.6836 71.4543 33.6193C72.4997 33.3622 73.4798 32.655 74.3293 31.5621C75.1787 30.4692 75.6361 28.7334 75.6361 26.4832C75.6361 24.1688 75.1787 22.4973 74.3293 21.4044C73.4798 20.3115 72.4997 19.6043 71.4543 19.3471C71.1929 19.2828 70.9315 19.2186 70.7355 19.2186C70.4742 19.2186 70.2781 19.1543 70.0168 19.1543C69.7554 19.1543 69.5594 19.1543 69.3634 19.2186C69.1673 19.2186 68.906 19.2828 68.6446 19.3471C67.5992 19.6043 66.619 20.3115 65.7043 21.4044C64.8548 22.3687 64.3975 24.1045 64.3975 26.4189Z" fill="white"/> <path d="M38.1528 13.9433C38.1528 11.5581 38.8442 9.75803 40.2731 8.58797C41.6559 7.3729 43.3152 6.78787 45.2051 6.78787C47.0949 6.78787 48.7081 7.3729 50.0909 8.58797C51.4737 9.80304 52.1651 11.5581 52.1651 13.9883C52.1651 16.3734 51.4737 18.1735 50.0909 19.3436C48.7081 20.5586 47.0488 21.1437 45.2051 21.1437C43.3152 21.1437 41.702 20.5586 40.2731 19.3436C38.8442 18.1285 38.1528 16.3284 38.1528 13.9433ZM41.195 13.9433C41.195 15.6084 41.5176 16.7784 42.1168 17.5435C42.7621 18.3085 43.4535 18.8035 44.191 18.9835C44.3754 19.0285 44.5137 19.0735 44.698 19.0735C44.8363 19.0735 45.0207 19.1185 45.159 19.1185C45.3433 19.1185 45.4816 19.1185 45.666 19.0735C45.8504 19.0735 45.9886 19.0285 46.173 18.9835C46.9105 18.8035 47.6019 18.3085 48.2011 17.5435C48.8003 16.7784 49.123 15.5633 49.123 13.9883C49.123 12.3682 48.8003 11.1981 48.2011 10.4331C47.6019 9.66803 46.9105 9.173 46.173 8.99299C45.9886 8.94799 45.8043 8.90299 45.666 8.90299C45.4816 8.90299 45.3433 8.85798 45.159 8.85798C44.9746 8.85798 44.8363 8.85798 44.698 8.90299C44.5598 8.90299 44.3754 8.94799 44.191 8.99299C43.4535 9.173 42.7621 9.66803 42.1168 10.4331C41.5176 11.1081 41.195 12.3232 41.195 13.9433Z" fill="white"/>
<path d="M82.105 16.3898H87.4629L94.5198 28.9905L95.5652 31.755H95.6306L95.5652 28.1548V16.3898H99.6817V36.4481H94.3237L87.2669 23.3331L86.2215 21.0829H86.1561L86.2215 24.6188V36.4481H82.105V16.3898Z" fill="white"/> <path d="M53.6863 6.92288H57.4659L62.444 15.7434L63.1814 17.6785H63.2275L63.1814 15.1583V6.92288H66.0853V20.9636H62.3057L57.3276 11.7831L56.5901 10.2081H56.544L56.5901 12.6832V20.9636H53.6863V6.92288Z" fill="white"/>
<path d="M103.929 16.3898H108.045V33.0407H116.147V36.4481H103.929V16.3898Z" fill="white"/> <path d="M69.0813 6.92288H71.9852V18.5785H77.7007V20.9636H69.0813V6.92288Z" fill="white"/>
<path d="M113.599 16.3898H118.369L122.551 23.3974L123.204 24.8117H123.335L123.988 23.3974L128.235 16.3898H132.613L125.23 28.2833V36.4481H121.113V28.219L113.599 16.3898Z" fill="white"/> <path d="M75.9031 6.92288H79.2679L82.2178 11.8281L82.6787 12.8182H82.7709L83.2319 11.8281L86.2279 6.92288H89.3161L84.1076 15.2483V20.9636H81.2038V15.2033L75.9031 6.92288Z" fill="white"/>
<path d="M132.091 26.4189C132.091 23.0116 133.071 20.44 135.096 18.7685C137.057 17.0327 139.409 16.197 142.088 16.197C144.767 16.197 147.054 17.0327 149.014 18.7685C150.974 20.5043 151.954 23.0116 151.954 26.4832C151.954 29.8906 150.974 32.4621 149.014 34.1336C147.054 35.8695 144.702 36.7052 142.088 36.7052C139.409 36.7052 137.122 35.8695 135.096 34.1336C133.136 32.3978 132.091 29.8263 132.091 26.4189ZM136.403 26.4189C136.403 28.7976 136.861 30.4692 137.71 31.5621C138.625 32.655 139.54 33.3622 140.65 33.6193C140.912 33.6836 141.108 33.7479 141.369 33.7479C141.565 33.7479 141.827 33.8122 142.023 33.8122C142.284 33.8122 142.48 33.8122 142.741 33.7479C143.003 33.7479 143.199 33.6836 143.46 33.6193C144.506 33.3622 145.486 32.655 146.335 31.5621C147.185 30.4692 147.642 28.7334 147.642 26.4832C147.642 24.1688 147.185 22.4973 146.335 21.4044C145.486 20.3115 144.506 19.6043 143.46 19.3471C143.199 19.2828 142.937 19.2186 142.741 19.2186C142.48 19.2186 142.284 19.1543 142.023 19.1543C141.761 19.1543 141.565 19.1543 141.369 19.2186C141.173 19.2186 140.912 19.2828 140.65 19.3471C139.605 19.6043 138.625 20.3115 137.71 21.4044C136.861 22.3687 136.403 24.1045 136.403 26.4189Z" fill="white"/> <path d="M88.9473 13.9433C88.9473 11.5581 89.6387 9.75803 91.0675 8.58797C92.4503 7.3729 94.1097 6.78787 95.9995 6.78787C97.8893 6.78787 99.5026 7.3729 100.885 8.58797C102.268 9.80304 102.96 11.5581 102.96 13.9883C102.96 16.3734 102.268 18.1735 100.885 19.3436C99.5026 20.5586 97.8432 21.1437 95.9995 21.1437C94.1097 21.1437 92.4964 20.5586 91.0675 19.3436C89.6848 18.1285 88.9473 16.3284 88.9473 13.9433ZM91.9894 13.9433C91.9894 15.6084 92.3121 16.7784 92.9113 17.5435C93.5566 18.3085 94.2019 18.8035 94.9855 18.9835C95.1698 19.0285 95.3081 19.0735 95.4925 19.0735C95.6308 19.0735 95.8151 19.1185 95.9534 19.1185C96.1378 19.1185 96.2761 19.1185 96.4604 19.0735C96.6448 19.0735 96.7831 19.0285 96.9675 18.9835C97.7049 18.8035 98.3963 18.3085 98.9955 17.5435C99.5948 16.7784 99.9174 15.5633 99.9174 13.9883C99.9174 12.3682 99.5948 11.1981 98.9955 10.4331C98.3963 9.66803 97.7049 9.173 96.9675 8.99299C96.7831 8.94799 96.5987 8.90299 96.4604 8.90299C96.2761 8.90299 96.1378 8.85798 95.9534 8.85798C95.769 8.85798 95.6308 8.85798 95.4925 8.90299C95.3542 8.90299 95.1698 8.94799 94.9855 8.99299C94.248 9.173 93.5566 9.66803 92.9113 10.4331C92.3121 11.1081 91.9894 12.3232 91.9894 13.9433Z" fill="white"/>
<path d="M154.829 16.3898H166.198V19.7329H158.946V24.6188H165.872V28.0262H158.946V36.4481H154.829V16.3898Z" fill="white"/> <path d="M104.988 6.92288H113.008V9.26301H107.891V12.6832H112.777V15.0683H107.891V20.9636H104.988V6.92288Z" fill="white"/>
<path d="M169.27 16.3898H180.639V19.7329H173.386V24.6188H180.312V28.0262H173.386V36.4481H169.27V16.3898Z" fill="white"/> <path d="M115.174 6.92288H123.195V9.26301H118.078V12.6832H122.964V15.0683H118.078V20.9636H115.174V6.92288Z" fill="white"/>
<path d="M183.057 36.4481V16.3898H187.173V36.4481H183.057Z" fill="white"/> <path d="M124.9 20.9636V6.92288H127.804V20.9636H124.9Z" fill="white"/>
<path d="M205.311 16.8397V20.3113C204.592 20.0542 203.873 19.8613 203.089 19.7327C202.305 19.6041 201.39 19.5398 200.476 19.5398C198.319 19.5398 196.686 20.1827 195.51 21.5328C194.334 22.8186 193.746 24.4901 193.746 26.4831C193.746 28.4117 194.268 30.019 195.379 31.3048C196.49 32.5905 198.058 33.2977 200.084 33.2977C200.802 33.2977 201.521 33.2334 202.371 33.1692C203.22 33.0406 204.069 32.8477 204.984 32.462L205.246 35.8693C205.115 35.9336 204.919 35.9979 204.723 36.0622C204.462 36.1265 204.2 36.1907 203.873 36.255C203.351 36.3836 202.697 36.4479 201.913 36.5765C201.129 36.6408 200.345 36.7051 199.496 36.7051C199.365 36.7051 199.234 36.7051 199.169 36.7051C199.038 36.7051 198.908 36.7051 198.842 36.7051C196.49 36.5765 194.334 35.6764 192.373 34.1335C190.413 32.5263 189.433 30.019 189.433 26.6759C189.433 23.3972 190.413 20.8256 192.308 19.0255C194.203 17.2254 196.817 16.3254 200.018 16.3254C200.868 16.3254 201.652 16.3254 202.305 16.3897C203.024 16.454 203.677 16.5825 204.396 16.7111C204.527 16.7754 204.723 16.7754 204.854 16.8397C204.984 16.7754 205.115 16.8397 205.311 16.8397Z" fill="white"/> <path d="M140.599 7.2378V9.66793C140.092 9.48792 139.585 9.35291 139.032 9.26291C138.478 9.1729 137.833 9.1279 137.188 9.1279C135.667 9.1279 134.515 9.57792 133.685 10.523C132.855 11.423 132.44 12.5931 132.44 13.9882C132.44 15.3382 132.809 16.4633 133.593 17.3633C134.376 18.2634 135.482 18.7584 136.911 18.7584C137.418 18.7584 137.925 18.7134 138.525 18.6684C139.124 18.5784 139.723 18.4434 140.368 18.1734L140.553 20.5585C140.46 20.6035 140.322 20.6485 140.184 20.6935C140 20.7385 139.815 20.7835 139.585 20.8285C139.216 20.9185 138.755 20.9635 138.202 21.0535C137.649 21.0985 137.096 21.1436 136.497 21.1436C136.404 21.1436 136.312 21.1436 136.266 21.1436C136.174 21.1436 136.082 21.1436 136.036 21.1436C134.376 21.0535 132.855 20.4235 131.472 19.3435C130.09 18.2184 129.398 16.4633 129.398 14.1232C129.398 11.828 130.09 10.0279 131.426 8.76788C132.763 7.50781 134.607 6.87778 136.865 6.87778C137.464 6.87778 138.018 6.87778 138.478 6.92278C138.986 6.96778 139.446 7.05779 139.953 7.14779C140.046 7.19279 140.184 7.19279 140.276 7.2378C140.368 7.19279 140.46 7.2378 140.599 7.2378Z" fill="white"/>
<path d="M208.578 16.3899H220.797V19.5401H212.76V24.5546H220.013V27.6405H212.76V33.298H220.797V36.4481H208.578V16.3899Z" fill="white"/> <path d="M142.903 6.92294H151.523V9.12806H145.853V12.6383H150.97V14.7984H145.853V18.7586H151.523V20.9637H142.903V6.92294Z" fill="white"/>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 5.5 KiB

After

Width:  |  Height:  |  Size: 5.5 KiB

View File

@ -20,53 +20,101 @@ html {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
body { body {
background: #fff; background: #FFFFFF;
color: #333; color: #333333;
font-family: 'Open Sans', sans-serif; font-family: Open Sans;
font-size: 12px; font-size: 12px;
font-style: normal;
font-weight: normal; font-weight: normal;
height: 100%; height: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
text-decoration: none; text-decoration: none;
} }
form { form {
height: 100%; height: 100%;
} }
div { div {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
a, a:hover, a:visited {
a,
a:hover,
a:visited {
color: #333; color: #333;
} }
header { header {
height: 44px; background: #333333;
background: #3D4A6B; height: 72px;
height: 80px;
margin: 0 auto; margin: 0 auto;
min-width: 600px; min-width: 1152px;
width: auto; width: auto;
} }
header img { header img {
margin: 12px 0 0 16px; margin: 22px 0 22px 32px;
}
.center {
margin: 0 auto 0;
width: 1152px;
}
.main{
height: calc(100% - 136px);
min-height: 549px;
}
.table-main {
border-spacing: 0;
height: 100%;
min-height: 549px;
}
.section{
height: 100%;
padding: 0;
vertical-align: top;
} }
.main-panel { .main-panel {
margin: 80px auto 16px; box-sizing: border-box;
width: 600px; -moz-box-sizing: border-box;
height: 100%;
list-style: none;
padding: 48px 32px;
position: relative;
width: 896px;
} }
.portal-name { .portal-name {
font-size: 20px; color: #FF6F3D;
font-size: 24px;
font-weight: bold;
line-height: 133%;
letter-spacing: -0.02em;
} }
.portal-descr { .portal-descr {
display: inline-block; display: inline-block;
line-height: 20px; font-size: 16px;
margin-bottom: 20px; line-height: 160%;
width: 600px; margin-top: 16px;
} }
.header-list {
font-weight: bold;
font-size: 16px;
line-height: 133%;
letter-spacing: -0.02em;
}
label .checkbox { label .checkbox {
margin: 0 5px 3px 0; margin: 0 5px 3px 0;
vertical-align: middle; vertical-align: middle;
@ -79,76 +127,79 @@ label .checkbox {
.try-editor-list { .try-editor-list {
list-style: none; list-style: none;
margin: 0 0 16px; margin: 0;
padding: 0; padding: 0;
} }
.try-editor-list li { .try-editor-list li {
float: left; margin-bottom: 12px
margin: 0 15px;
width: 100px;
} }
.try-editor { .try-editor {
background-color: transparent; background-color: transparent;
background-position: center 0;
background-repeat: no-repeat; background-repeat: no-repeat;
display: block; display: block;
font-size: 14px; font-size: 14px;
font-weight: bold; line-height: 40px;
height: 45px; padding-left: 42px;
padding-top: 100px;
text-align: center;
text-decoration: none; text-decoration: none;
} }
.try-editor.word { .try-editor.word {
background-image: url("../images/file_docx.png"); background-image: url("../images/file_docx.svg");
} }
.try-editor.cell { .try-editor.cell {
background-image: url("../images/file_xlsx.png"); background-image: url("../images/file_xlsx.svg");
} }
.try-editor.slide { .try-editor.slide {
background-image: url("../images/file_pptx.png"); background-image: url("../images/file_pptx.svg");
} }
.create-sample { .create-sample {
display: inline-block; color: #666666;
margin-left: 75px; line-height: 24px;
} }
.button, .button:visited, .button:hover, .button:active {
display: inline-block; .button,
font-weight: normal; .button:visited,
text-align: center; .button:hover,
text-decoration: none; .button:active {
vertical-align: middle; background: #3D96C6;
cursor:pointer; border-color: #3D96C6;
border-radius: 6px; border-radius: 6px;
border-style: solid;
border-width: 1px;
-moz-border-radius: 6px; -moz-border-radius: 6px;
-webkit-border-radius: 6px; -webkit-border-radius: 6px;
touch-callout: none; color: #fff;
-o-touch-callout: none; cursor:pointer;
-moz-touch-callout: none; display: inline-block;
-webkit-touch-callout: none;
user-select: none;
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
font-size: 12px; font-size: 12px;
font-weight: normal;
line-height: 16px; line-height: 16px;
margin-right: 3px; margin-right: 3px;
padding: 4px 12px; padding: 4px 12px;
text-align: center;
color: #fff; text-decoration: none;
vertical-align: middle;
background: #3D96C6; user-select: none;
-o-touch-callout: none;
border-width: 1px; -moz-touch-callout: none;
border-style: solid; -webkit-touch-callout: none;
border-color: #3D96C6; -o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
} }
.button.disable { .button.disable {
cursor: default;
background: #BADDEF; background: #BADDEF;
border: 1px solid #BADDEF; border: 1px solid #BADDEF;
cursor: default;
} }
.button.gray { .button.gray {
background: #ebebeb; background: #ebebeb;
border: 1px solid #D0D0D0; border: 1px solid #D0D0D0;
@ -156,38 +207,44 @@ label .checkbox {
} }
.upload-panel { .upload-panel {
border-right: 1px solid #D1D1D1;
float: left; float: left;
margin-right: 25px; padding: 24px 0;
} }
.file-upload { .file-upload {
background: url("../images/file_upload.png") no-repeat center 0 transparent; background: url(../images/file_upload.svg) no-repeat 0 transparent;
cursor: pointer; cursor: pointer;
display: inline-block; display: block;
font-size: 14px; font-size: 14px;
font-weight: bold; line-height: 40px;
height: 45px;
margin: 0 40px 16px;
overflow: hidden; overflow: hidden;
padding-top: 100px; padding-left: 42px;
position: relative; position: relative;
text-align: center; width: 150px;
width: 100px;
} }
.file-upload input { .file-upload input {
cursor: pointer; cursor: pointer;
height: 40px;
margin: 0;
opacity: 0;
opacity: 0; opacity: 0;
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
transform: translate(555px, 60px) scale(8); transform: translate(0px, -21px) scale(2);
width: 192px;
} }
.create-panel { .create-panel {
float: left; float: left;
padding: 16px 0;
} }
.upload-panel, .upload-panel,
.create-panel { .create-panel {
padding: 10px 0; width: 100%;
border-bottom: 1px solid #D0D5DA;
} }
#mainProgress { #mainProgress {
@ -195,15 +252,19 @@ label .checkbox {
display: none; display: none;
margin: 15px; margin: 15px;
} }
#mainProgress #embeddedView { #mainProgress #embeddedView {
display: none; display: none;
} }
#mainProgress.embedded #embeddedView { #mainProgress.embedded #embeddedView {
display: block; display: block;
} }
#mainProgress.embedded #uploadSteps { #mainProgress.embedded #uploadSteps {
display: none; display: none;
} }
.error-message { .error-message {
background: url("../images/alert.png") no-repeat scroll 4px 10px #FFECE3; background: url("../images/alert.png") no-repeat scroll 4px 10px #FFECE3;
color: #666668 !important; color: #666668 !important;
@ -214,9 +275,11 @@ label .checkbox {
padding: 10px 10px 10px 30px; padding: 10px 10px 10px 30px;
vertical-align: middle; vertical-align: middle;
} }
#mainProgress .error-message a { #mainProgress .error-message a {
color: #666668; color: #666668;
} }
.step { .step {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: left center; background-position: left center;
@ -226,96 +289,136 @@ label .checkbox {
line-height: 30px; line-height: 30px;
padding-left: 25px; padding-left: 25px;
} }
.current { .current {
background-image: url("../images/loader16.gif"); background-image: url("../images/loader16.gif");
color: #333; color: #333;
} }
.done { .done {
background-image: url("../images/done.png"); background-image: url("../images/done.png");
color: #333; color: #333;
} }
.error { .error {
background-image: url("../images/alert.png"); background-image: url("../images/alert.png");
} }
.step-descr { .step-descr {
display: block; display: block;
margin-left: 45px; margin-left: 45px;
} }
#mainProgress .step-descr a { #mainProgress .step-descr a {
color: #979B9F; color: #979B9F;
} }
.progress-descr { .progress-descr {
color: #333; color: #333;
} }
#loadScripts { #loadScripts {
display: none; display: none;
} }
#iframeScripts { #iframeScripts {
position: absolute; position: absolute;
visibility: hidden; visibility: hidden;
} }
footer { footer {
text-align: right; background: #333333;
color: #AAAAAA;
height: 64px;
min-width: 1152px;
width: auto; width: auto;
margin-bottom: 15px;
margin-right: 15px;
} }
footer table {
border-spacing: 0;
}
footer table tr {
height: 64px;
}
footer table td {
padding-left: 32px;
}
footer a,
footer a:hover,
footer a:visited {
color: #FF6F3D;
font-size: 14px;
line-height: 120%;
}
footer a:hover {
text-decoration: none;
}
.copy {
padding-left: 510px;
}
.help-block {
margin: 48px 32px;
}
.help-block span { .help-block span {
font-size: 16px; font-size: 14px;
line-height: 26px; font-weight: 600;
line-height: 19px;
} }
.stored-list { .stored-list {
border-top: 1px solid #D1D1D1;
list-style: none; list-style: none;
margin: 0;
padding: 0; padding: 0;
position: relative;
height: 100%;
} }
.stored-list li { .stored-list li {
border-bottom: 1px solid #D1D1D1; border-bottom: 1px solid #D1D1D1;
line-height: 28px; line-height: 28px;
padding: 0 8px; padding: 0 8px;
} }
.stored-edit { .stored-edit {
background-color: transparent; background-color: transparent;
background-position: left center; background-position: left center;
background-repeat: no-repeat; background-repeat: no-repeat;
display: inline-block; display: inline-block;
height: 16px; height: 16px;
max-width: 200px; max-width: 250px;
margin-bottom: -6px;
overflow: hidden; overflow: hidden;
padding: 8px 0 1px 34px; padding: 8px 0 1px 26px;
text-decoration: none; text-decoration: none;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.stored-edit.word { .stored-edit.word {
background-image: url("../images/icon_docx.png"); background-image: url("../images/icon_docx.svg");
} }
.stored-edit.cell { .stored-edit.cell {
background-image: url("../images/icon_xlsx.png"); background-image: url("../images/icon_xlsx.svg");
} }
.stored-edit.slide { .stored-edit.slide {
background-image: url("../images/icon_pptx.png"); background-image: url("../images/icon_pptx.svg");
} }
.stored-edit span { .stored-edit span {
font-size: 12px; font-size: 12px;
line-height: 12px; line-height: 12px;
vertical-align: top;
} }
.stored-edit:hover span { .stored-edit:hover span {
text-decoration: underline; text-decoration: underline;
} }
.stored-download {
color: #787878;
float: right;
text-decoration: none;
}
.stored-download:hover {
color: #787878;
text-decoration: underline;
}
.blockTitle { .blockTitle {
background-color: #E2E2E2 !important; background-color: #E2E2E2 !important;
@ -328,6 +431,7 @@ footer {
font-weight: normal !important; font-weight: normal !important;
padding: 15px 25px !important; padding: 15px 25px !important;
} }
.dialog-close { .dialog-close {
background: url("../images/close.png") no-repeat scroll left top #E2E2E2; background: url("../images/close.png") no-repeat scroll left top #E2E2E2;
cursor: pointer; cursor: pointer;
@ -338,6 +442,7 @@ footer {
margin-top: 4px; margin-top: 4px;
width: 12px; width: 12px;
} }
.blockPage { .blockPage {
border: none !important; border: none !important;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
@ -355,100 +460,142 @@ footer {
visibility: hidden; visibility: hidden;
} }
.td100 {
width: 100%;
}
.block-lang {
padding-right: 10px;
padding-top: 9px;
}
/*Icon table*/
#tableRow {
vertical-align: top;
}
.tableRow { .tableRow {
background: transparent; background: transparent;
-moz-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
} }
.tableRow:hover { .tableRow:hover {
background-color: #ebebeb; background-color: #ebebeb;
} }
.tableHeader { .tableHeader {
padding-top: 10px;
}
.tableHeader tr{
background: transparent; background: transparent;
color: #333;
cursor: default; cursor: default;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
height: 40px; height: 40px;
-khtml-user-select: none; -khtml-user-select: none;
user-select: none; user-select: none;
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none; -webkit-user-select: none;
} }
.tableHeaderCell { .tableHeaderCell {
padding: 2px 1px 2px 5px; border-bottom: 1px solid #CCCCCC;
padding: 2px 4px;
text-align: center; text-align: center;
} }
.tableHeaderCellFileName { .tableHeaderCellFileName {
text-align: left; text-align: left;
width: 37%;
} }
.tableHeaderCellEditors{
width: 29%;
}
.tableHeaderCellViewers{
width: 11%;
}
.tableHeaderCellDownload{
width: 13%;
text-align: right;
padding-right: 20px;
}
.tableHeaderCellRemove{
text-align: left;
}
.contentCells { .contentCells {
padding: 4px 1px 4px 5px; border-bottom: 1px solid #e5e5e5;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-size: 16px; font-size: 16px;
border-bottom: 1px solid #e5e5e5; padding: 4px;
white-space: nowrap; white-space: nowrap;
-khtml-user-select: none; -khtml-user-select: none;
user-select: none; user-select: none;
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none; -webkit-user-select: none;
} }
.contentCells-shift { .contentCells-shift {
padding-right: 30px; padding-right: 44px;
} }
.contentCells-icon { .contentCells-icon {
width: 6%; width: 4%;
}
.contentCellsSmall {
padding: 5px 1px 5px 6px;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
border-bottom: 1px solid #e5e5e5;
white-space: nowrap;
text-align: center;
}
.primaryRow {
background-color: #e9e9e9;
}
.secondaryRow {
background-color: #F9F9F9;
} }
.select-user { .select-user {
margin-left: 15px; color: #444444;
font-family: Open Sans;
font-size: 12px!important;
font-weight: normal!important;
line-height: 16px!important;
} }
.user-block-table { .user-block-table {
height: 100%; height: 100%;
padding: 14px 0;
width: 100%; width: 100%;
} }
.user-block-table td { .user-block-table td {
background-color: #F4F4F4; background-color: #F4F4F4;
border-bottom: 1px solid white; padding-top: 10px;
padding: 12px 0;
} }
#user, #language {
width: 130px; .user-block-table td select {
border: 1px solid #D0D5DA;
box-sizing: border-box;
border-radius: 3px;
cursor: pointer;
} }
.icon-download {
margin-bottom: -5px; #user,
#language {
width: 100%;
margin-top: 5px;
} }
.icon-delete { .icon-delete {
cursor: pointer; cursor: pointer;
margin-bottom: -6px;
} }
.left-panel {
width: 256px;
background: #F5F5F5;
}
.scroll-table-body {
bottom: 0;
left: 0;
margin-top: 0px;
overflow-x: auto;
position: absolute;
right: 0;
top: 71px;
scrollbar-color: #D0D5DA transparent;
scrollbar-width: thin;
}
.scroll-table-body::-webkit-scrollbar {
width: 4px;
}
.scroll-table-body::-webkit-scrollbar-thumb {
background: #D0D5DA;
border-radius: 3px;
}

View File

@ -30,208 +30,200 @@
</head> </head>
<body> <body>
<header> <header>
<a href=""> <div class="center">
<img src ="images/logo.svg" alt="ONLYOFFICE" /> <a href="">
</a> <img src ="images/logo.svg" alt="ONLYOFFICE" />
</a>
</div>
</header> </header>
<div class="main-panel"> <div class="center main">
<span class="portal-name">ONLYOFFICE Document Editors Welcome!</span> <table class="table-main">
<br /> <tbody>
<br /> <tr>
<span class="portal-descr">Get started with a demo-sample of ONLYOFFICE Document Editors, the first html5-based editors. You may upload your own documents for testing using the "Upload file" button and selecting the necessary files on your PC.</span> <td class="left-panel section">
<table class="user-block-table" cellspacing="0" cellpadding="0"> <div class="help-block">
<tr> <span>Create new</span>
<td valign="middle" width="30%"> <div class="clearFix">
<span class="select-user">Username:</span> <div class="create-panel clearFix">
<select class="select-user" id="user"> <ul class="try-editor-list clearFix">
<option value="uid-1">John Smith</option> <li>
<option value="uid-2">Mark Pottato</option> <a class="try-editor word reload-page" target="_blank" href="editor?fileExt=docx<%= params %>" title="Create new document">Document</a>
<option value="uid-3">Hamish Mitchell</option> </li>
<option value="uid-0">anonymous</option> <li>
</select> <a class="try-editor cell reload-page" target="_blank" href="editor?fileExt=xlsx<%= params %>" title="Create new spreadsheet">Spreadsheet</a>
</td> </li>
<td valign="middle" width="70%">Select user name before opening the document; you can open the same document using different users in different Web browser sessions, so you can check out multi-user editing functions.</td> <li>
</tr> <a class="try-editor slide reload-page" target="_blank" href="editor?fileExt=pptx<%= params %>" title="Create new presentation">Presentation</a>
<tr> </li>
<td valign="middle" width="30%"> </ul>
<select class="select-user" id="language"> <label class="create-sample">
<option value="en">English</option> <input type="checkbox" id="createSample" class="checkbox" />With sample content
<option value="be">Belarusian</option> </label>
<option value="bg">Bulgarian</option> </div>
<option value="ca">Catalan</option>
<option value="zh">Chinese</option> <div class="upload-panel clearFix">
<option value="cs">Czech</option> <a class="file-upload">Upload file
<option value="da">Danish</option> <input type="file" id="fileupload" name="uploadedFile" data-url="upload?<%= params %>" />
<option value="nl">Dutch</option> </a>
<option value="fi">Finnish</option> </div>
<option value="fr">French</option>
<option value="de">German</option> <table class="user-block-table" cellspacing="0" cellpadding="0">
<option value="el">Greek</option> <tr>
<option value="hu">Hungarian</option> <td valign="middle" width="30%">
<option value="id">Indonesian</option> <span class="select-user">Username</span>
<option value="it">Italian</option> <select class="select-user" id="user">
<option value="ja">Japanese</option> <option value="uid-1">John Smith</option>
<option value="ko">Korean</option> <option value="uid-2">Mark Pottato</option>
<option value="lv">Latvian</option> <option value="uid-3">Hamish Mitchell</option>
<option value="lo">Lao</option> <option value="uid-0">anonymous</option>
<option value="nb">Norwegian</option> </select>
<option value="pl">Polish</option> </td>
<option value="pt">Portuguese</option> </tr>
<option value="ro">Romanian</option> <tr>
<option value="ru">Russian</option> <td valign="middle" width="30%">
<option value="sk">Slovak</option> <span class="select-user">Language</span>
<option value="sl">Slovenian</option> <select class="select-user" id="language">
<option value="sv">Swedish</option> <option value="en">English</option>
<option value="es">Spanish</option> <option value="be">Belarusian</option>
<option value="tr">Turkish</option> <option value="bg">Bulgarian</option>
<option value="uk">Ukrainian</option> <option value="ca">Catalan</option>
<option value="vi">Vietnamese</option> <option value="zh">Chinese</option>
</select> <option value="cs">Czech</option>
</td> <option value="da">Danish</option>
<td valign="middle" width="70%">Choose the language for ONLYOFFICE editors interface.</td> <option value="nl">Dutch</option>
</tr> <option value="fi">Finnish</option>
<option value="fr">French</option>
<option value="de">German</option>
<option value="el">Greek</option>
<option value="hu">Hungarian</option>
<option value="id">Indonesian</option>
<option value="it">Italian</option>
<option value="ja">Japanese</option>
<option value="ko">Korean</option>
<option value="lv">Latvian</option>
<option value="lo">Lao</option>
<option value="nb">Norwegian</option>
<option value="pl">Polish</option>
<option value="pt">Portuguese</option>
<option value="ro">Romanian</option>
<option value="ru">Russian</option>
<option value="sk">Slovak</option>
<option value="sl">Slovenian</option>
<option value="sv">Swedish</option>
<option value="es">Spanish</option>
<option value="tr">Turkish</option>
<option value="uk">Ukrainian</option>
<option value="vi">Vietnamese</option>
</select>
</td>
</tr>
</table>
</div>
</div>
</td>
<td class="section">
<div class="main-panel">
<% if (storedFiles.length <= 0)
{ %>
<span class="portal-name">ONLYOFFICE Document Editors Welcome!</span>
<span class="portal-descr">
Get started with a demo-sample of ONLYOFFICE Document Editors, the first html5-based editors.
<br /> You may upload your own documents for testing using the "<b>Upload file</b>" button and <b>selecting</b> the necessary files on your PC.
</span>
<%} else
{ %>
<div class="stored-list">
<span class="header-list">Your documents</span>
<table class="tableHeader" cellspacing="0" cellpadding="0" width="100%">
<thead>
<tr>
<td class="tableHeaderCell tableHeaderCellFileName">Filename</td>
<td class="tableHeaderCell tableHeaderCellEditors contentCells-shift">Editors</td>
<td class="tableHeaderCell tableHeaderCellViewers">Viewers</td>
<td class="tableHeaderCell tableHeaderCellDownload">Download</td>
<td class="tableHeaderCell tableHeaderCellRemove">Remove</td>
</tr>
</thead>
</table>
<div class="scroll-table-body">
<table cellspacing="0" cellpadding="0" width="100%">
<tbody>
<% for (var i = 0; i < storedFiles.length; i++) { %>
<tr class="tableRow" title="<%= storedFiles[i].name %> [<%= storedFiles[i].version %>]">
<td class="contentCells">
<a class="stored-edit <%= storedFiles[i].documentType %>" href="editor?fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<span title="<%= storedFiles[i].name %> [<%= storedFiles[i].version %>]"><%= storedFiles[i].name %></span>
</a>
</td>
<% if (storedFiles[i].canEdit) { %>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/desktop-24.png" alt="Open in editor for full size screens" title="Open in editor for full size screens" /></a>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=mobile&mode=edit&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/mobile-24.png" alt="Open in editor for mobile devices" title="Open in editor for mobile devices" /></a>
</td>
<td class="contentCells contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=review&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/review-24.png" alt="Open in editor for review" title="Open in editor for review" /></a>
<% } else if (storedFiles[i].documentType == "cell") { %>
<a href="editor?type=desktop&mode=filter&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/filter-24.png" alt="Open in editor without access to change the filter" title="Open in editor without access to change the filter" /></a>
<% } %>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&mode=comment&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/comment-24.png" alt="Open in editor for comment" title="Open in editor for comment" /></a>
</td>
<td class="contentCells contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=fillForms&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/fill-forms-24.png" alt="Open in editor for filling in forms" title="Open in editor for filling in forms" /></a>
<% } %>
</td>
<td class="contentCells contentCells-shift contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=blockcontent&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/block-content-24.png" alt="Open in editor without content control modification" title="Open in editor without content control modification" /></a>
<% } %>
</td>
<% } else { %>
<td class="contentCells contentCells-shift contentCells-icon" colspan="6"></td>
<% } %>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&mode=view&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/desktop-24.png" alt="Open in viewer for full size screens" title="Open in viewer for full size screens" /></a>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=mobile&mode=view&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/mobile-24.png" alt="Open in viewer for mobile devices" title="Open in viewer for mobile devices" /></a>
</td>
<td class="contentCells contentCells-icon contentCells-shift">
<a href="editor?type=embedded&mode=embedded&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/embeded-24.png" alt="Open in embedded mode" title="Open in embedded mode" /></a>
</td>
<td class="contentCells contentCells-icon contentCells-shift">
<a href="download?fileName=<%= encodeURIComponent(storedFiles[i].name) %>">
<img class="icon-download" src="images/download-24.png" alt="Download" title="Download" /></a>
</td>
<td class="contentCells contentCells-icon contentCells-shift">
<a class="delete-file" data="<%= encodeURIComponent(storedFiles[i].name) %>">
<img class="icon-delete" src="images/delete-24.png" alt="Delete" title="Delete" /></a>
</td>
</tr>
<% } %>
</tbody>
</table>
</div>
</div>
<% } %>
</div>
</td>
</tr>
</tbody>
</table> </table>
<br />
<br />
<div class="help-block">
<span>Upload your file or create new file</span>
<br />
<br />
<div class="clearFix">
<div class="upload-panel clearFix">
<a class="file-upload">Upload
<br />
File
<input type="file" id="fileupload" name="uploadedFile" data-url="upload?<%= params %>" />
</a>
</div>
<div class="create-panel clearFix">
<ul class="try-editor-list clearFix">
<li>
<a class="try-editor word reload-page" target="_blank" href="editor?fileExt=docx<%= params %>">Create
<br />
Document</a>
</li>
<li>
<a class="try-editor cell reload-page" target="_blank" href="editor?fileExt=xlsx<%= params %>">Create
<br />
Spreadsheet</a>
</li>
<li>
<a class="try-editor slide reload-page" target="_blank" href="editor?fileExt=pptx<%= params %>">Create
<br />
Presentation</a>
</li>
</ul>
<label class="create-sample">
<input type="checkbox" id="createSample" class="checkbox" />Create a file filled with sample content
</label>
</div>
</div>
</div>
<br />
<br />
<% if (storedFiles.length > 0)
{ %>
<br />
<div class="help-block">
<span>Your documents</span>
<br />
<br />
<div class="stored-list">
<table cellspacing="0" cellpadding="0" width="100%">
<thead>
<tr class="tableHeader">
<td class="tableHeaderCell tableHeaderCellFileName">Filename</td>
<td colspan="6" class="tableHeaderCell contentCells-shift">Editors</td>
<td colspan="3" class="tableHeaderCell">Viewers</td>
</tr>
</thead>
<tbody>
<% for (var i = 0; i < storedFiles.length; i++) { %>
<tr class="tableRow" title="<%= storedFiles[i].name %> [<%= storedFiles[i].version %>]">
<td class="contentCells">
<a class="stored-edit <%= storedFiles[i].documentType %>" href="editor?fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<span title="<%= storedFiles[i].name %> [<%= storedFiles[i].version %>]"><%= storedFiles[i].name %></span></a>
<a href="download?fileName=<%= encodeURIComponent(storedFiles[i].name) %>">
<img class="icon-download" src="images/download-24.png" alt="Download" title="Download" /></a>
<a class="delete-file" data="<%= encodeURIComponent(storedFiles[i].name) %>">
<img class="icon-delete" src="images/delete-24.png" alt="Delete" title="Delete" /></a>
</td>
<% if (storedFiles[i].canEdit) { %>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/desktop-24.png" alt="Open in editor for full size screens" title="Open in editor for full size screens" /></a>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=mobile&mode=edit&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/mobile-24.png" alt="Open in editor for mobile devices" title="Open in editor for mobile devices" /></a>
</td>
<td class="contentCells contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=review&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/review-24.png" alt="Open in editor for review" title="Open in editor for review" /></a>
<% } else if (storedFiles[i].documentType == "cell") { %>
<a href="editor?type=desktop&mode=filter&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/filter-24.png" alt="Open in editor without access to change the filter" title="Open in editor without access to change the filter" /></a>
<% } %>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&mode=comment&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/comment-24.png" alt="Open in editor for comment" title="Open in editor for comment" /></a>
</td>
<td class="contentCells contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=fillForms&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/fill-forms-24.png" alt="Open in editor for filling in forms" title="Open in editor for filling in forms" /></a>
<% } %>
</td>
<td class="contentCells contentCells-shift contentCells-icon">
<% if (storedFiles[i].documentType == "word") { %>
<a href="editor?type=desktop&mode=blockcontent&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/block-content-24.png" alt="Open in editor without content control modification" title="Open in editor without content control modification" /></a>
<% } %>
</td>
<% } else { %>
<td class="contentCells contentCells-shift contentCells-icon" colspan="5"></td>
<% } %>
<td class="contentCells contentCells-icon">
<a href="editor?type=desktop&mode=view&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/desktop-24.png" alt="Open in viewer for full size screens" title="Open in viewer for full size screens" /></a>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=mobile&mode=view&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/mobile-24.png" alt="Open in viewer for mobile devices" title="Open in viewer for mobile devices" /></a>
</td>
<td class="contentCells contentCells-icon">
<a href="editor?type=embedded&mode=embedded&fileName=<%= encodeURIComponent(storedFiles[i].name) + params %>" target="_blank">
<img src="images/embeded-24.png" alt="Open in embedded mode" title="Open in embedded mode" /></a>
</td>
</tr>
<% } %>
</tbody>
</table>
</div>
</div>
<% } %>
<br />
<br />
<br />
<div class="help-block">
<span>Want to learn the magic?</span>
<br />
Explore ONLYOFFICE Document Editors <a href="http://api.onlyoffice.com/editors/howitworks" target="_blank">API Documentation.</a>
</div>
<br />
<br />
<br />
<div class="help-block">
<span>Any questions?</span>
<br />
Please, <a href="mailto:sales@onlyoffice.com">submit your request here</a>.
</div>
</div> </div>
<div id="mainProgress"> <div id="mainProgress">
@ -265,7 +257,25 @@
<span id="loadScripts" data-docs="<%= preloaderUrl %>"></span> <span id="loadScripts" data-docs="<%= preloaderUrl %>"></span>
<footer>&copy; Ascensio Systems SIA 2020. All rights reserved.</footer> <footer>
<div class="center">
<table>
<tbody>
<tr>
<td>
<a href="http://api.onlyoffice.com/editors/howitworks" target="_blank">API Documentation</a>
</td>
<td>
<a href="mailto:sales@onlyoffice.com">Submit your request</a>
</td>
<td class="copy">
&copy; Ascensio Systems SIA 2020. All rights reserved.
</td>
</tr>
</tbody>
</table>
</div>
</footer>
<script type="text/javascript" src="javascripts/jquery-1.8.2.js"></script> <script type="text/javascript" src="javascripts/jquery-1.8.2.js"></script>
<script type="text/javascript" src="javascripts/jquery-ui.js"></script> <script type="text/javascript" src="javascripts/jquery-ui.js"></script>