[start page] added format's sprite

This commit is contained in:
Maxim Kadushkin
2018-04-17 14:29:39 +03:00
parent 1f79f5e9f5
commit dfaefa7b89
9 changed files with 63 additions and 35 deletions

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB

View File

@ -96,14 +96,14 @@
listitemtemplate: function(info) {
let id = !!info.uid ? (` id="${info.uid}"`) : '';
var _tpl = `<tr${id}>` +
'<td class="row-cell cicon">'+
`<span class="icon img-before-el ${info.type}" />` +
'</td>' +
'<td class="row-cell cname">' +
`<p class="name primary">${info.name}</p>` +
`<p class="descr minor">${info.descr}</p>` +
'</td>';
var _tpl = `<tr${id}>
<td class="row-cell cicon">
<span class="icon ${info.type=='folder'?'img-before-el':'img-format'} ${info.type}" />
</td>
<td class="row-cell cname">
<p class="name primary">${info.name}</p>
<p class="descr minor">${info.descr}</p>
</td>`;
if (info.type != 'folder')
_tpl += `<td class="row-cell cdate minor">${info.date}</td>`;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

View File

@ -249,6 +249,10 @@ button {
background: -webkit-image-set(data-uri('sprite.png') 1x, data-uri('sprite@2x.png') 2x) no-repeat;
}
.img-format::before {
background: -webkit-image-set(data-uri('formats.png') 1x, data-uri('formats@2x.png') 2x) no-repeat;
}
li.menu-item {
list-style: none;
/*padding: 0 27px;*/
@ -393,10 +397,10 @@ li.menu-item {
height: 23px;
padding: 0;
background-color: transparent;
background-position: -72px -141px;
background-position: -82px -48px;
&:hover {
background-position-x: -96px;
background-position-x: -106px;
}
}
@ -417,6 +421,10 @@ li.menu-item {
margin-top: 30px;
}
.format-from-index(@index) {
background-position: -24px*@index 0;
}
.table-files {
border-collapse: collapse;
table-layout: fixed;
@ -468,60 +476,73 @@ li.menu-item {
.icon {
&::before {
content: '';
background-position: 0 -48px;
float: left;
width: 24px;
height: 30px;
/*margin: 3px 0 0 -55px;*/
}
&.docx::before {
.format-from-index(0);
}
&.doc::before {
.format-from-index(1);
}
&.odt::before {
background-position-x: -24px;
.format-from-index(2);
}
&.rtf::before {
background-position-x: -48px;
.format-from-index(3);
}
&.txt::before {
background-position-y: -78px;
.format-from-index(4);
}
&.htm::before {
background-position: -24px -78px;
.format-from-index(5);
}
&.xlsx::before {
background-position: -48px -78px;
.format-from-index(6);
}
&.xls::before {
.format-from-index(7);
}
&.ods::before {
background-position-y: -108px;
.format-from-index(8);
}
&.csv::before {
background-position: -24px -108px;
.format-from-index(9);
}
&.pptx::before {
background-position: -48px -108px;
.format-from-index(10);
}
&.ppt::before {
.format-from-index(11);
}
&.odp::before {
background-position-y: -138px;
.format-from-index(12);
}
&.pps::before {
background-position: -24px -138px;
.format-from-index(13);
}
&.pdf::before {
background-position: -48px -138px;
.format-from-index(14);
}
&.djvu::before {
background-position-y: -168px;
.format-from-index(15);
}
&.xps::before {
background-position: -24px -168px;
.format-from-index(16);
}
&.folder::before {
background-position: -48px -168px;
background-position: -58px -48px;
}
}
@ -573,7 +594,7 @@ li.menu-item {
.text-emptylist::before {
content: '';
display: block;
background-position: -72px -48px;
background-position: 0 -48px;
width: 58px;
height: 78px;
margin: 50px auto 10px;;
@ -735,7 +756,7 @@ li.menu-item {
.ver-logo {
width: 142px;
height: 28px;
background-position-y: -198px;
background-position-y: -126px;
}
}

View File

@ -161,7 +161,7 @@ utils.defines.links = {
utils.parseFileFormat = function(format) {
switch (format) {
case utils.defines.FileFormat.FILE_DOCUMENT_DOC:
case utils.defines.FileFormat.FILE_DOCUMENT_DOC: return 'doc';
case utils.defines.FileFormat.FILE_DOCUMENT_DOCX: return 'docx';
case utils.defines.FileFormat.FILE_DOCUMENT_ODT: return 'odt';
case utils.defines.FileFormat.FILE_DOCUMENT_RTF: return 'rtf';
@ -169,12 +169,12 @@ utils.parseFileFormat = function(format) {
case utils.defines.FileFormat.FILE_DOCUMENT_HTML:
case utils.defines.FileFormat.FILE_DOCUMENT_MHT: return 'htm';
case utils.defines.FileFormat.FILE_SPREADSHEET_XLS:
case utils.defines.FileFormat.FILE_SPREADSHEET_XLS: return 'xls';
case utils.defines.FileFormat.FILE_SPREADSHEET_XLSX: return 'xlsx';
case utils.defines.FileFormat.FILE_SPREADSHEET_ODS: return 'ods';
case utils.defines.FileFormat.FILE_SPREADSHEET_CSV: return 'csv';
case utils.defines.FileFormat.FILE_PRESENTATION_PPT:
case utils.defines.FileFormat.FILE_PRESENTATION_PPT: return 'ppt';
case utils.defines.FileFormat.FILE_PRESENTATION_PPTX: return 'pptx';
case utils.defines.FileFormat.FILE_PRESENTATION_ODP: return 'odp';
case utils.defines.FileFormat.FILE_PRESENTATION_PPSX: return 'pps';

View File

@ -53,14 +53,14 @@ dialog {
.tool.close {
width:12px;
height:12px;
background-position: -120px -138px;
background-position: -108px 0;
border: 1px solid @color-gray-2;
cursor: pointer;
float: right;
margin-left: 10px;
&:hover {
background-position-x:-130px;
background-position-x:-118px;
}
}