diff --git a/src/_h5ai/client/css/inc/info.less b/src/_h5ai/client/css/inc/info.less
index c76f27ea..1791614c 100644
--- a/src/_h5ai/client/css/inc/info.less
+++ b/src/_h5ai/client/css/inc/info.less
@@ -6,25 +6,50 @@
flex: 0 0 auto;
order: 99;
- padding: 16px 16px 16px 8px;
+ padding: 16px;
border-left: 1px solid @col-border;
white-space: nowrap;
overflow-x: hidden;
- // font-weight: lighter;
- width: 250px;
+ width: 240px;
- .label, .time, .size {
+ .icon {
+ .rounded();
+ width: 240px;
+ height: 180px;
+ overflow: hidden;
+ margin: 0 auto;
+
+ img {
+ .rounded();
+ width: 240px;
+ max-height: 180px;
+ overflow: hidden;
+ }
+ }
+
+ .block {
+ border-top: 1px solid @col-border;
+ border-bottom: 1px solid @col-border;
+ margin: 0 0 24px 0;
+ padding: 24px 0;
+ }
+
+ .label {
+ font-size: 16px;
+ margin-bottom: 16px;
+ }
+
+ .time, .size {
line-height: 20px;
+ height: 20px;
}
.qrcode {
background: #fff;
border-radius: 2px;
margin: 0 auto;
- padding: 8px;
- width: 150px;
- // border: @border-widget;
- box-shadow: inset 0 0 4px 0 rgba(0, 0, 0, 0.4);
+ width: 200px;
+ border: 1px solid @col-border;
canvas {
display: block;
diff --git a/src/_h5ai/client/css/inc/view.less b/src/_h5ai/client/css/inc/view.less
index 77c9147a..dca1e7e5 100644
--- a/src/_h5ai/client/css/inc/view.less
+++ b/src/_h5ai/client/css/inc/view.less
@@ -110,7 +110,7 @@
top: 0;
width: 22px;
height: 22px;
- background-color: @col-back-selected;
+ background: @col-back-selected;
cursor: pointer;
border-radius: 0 0 2px 0;
opacity: 0.6;
diff --git a/src/_h5ai/client/js/inc/ext/info.js b/src/_h5ai/client/js/inc/ext/info.js
index 54fe8d36..d8bcfc9d 100644
--- a/src/_h5ai/client/js/inc/ext/info.js
+++ b/src/_h5ai/client/js/inc/ext/info.js
@@ -5,9 +5,12 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
}, allsettings.info);
var template =
'
' +
- '
' +
- '
' +
- '
' +
+ '
' +
+ '
' +
+ '
' +
+ '
' +
+ '
' +
+ '
' +
'
' +
'
';
var settingsTemplate =
@@ -19,7 +22,7 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
'';
var sepTemplate = '';
var storekey = 'ext/info';
- var $label, $time, $size, $qrcode;
+ var $img, $label, $time, $size, $qrcode;
var currentFolder;
//
@@ -38,6 +41,12 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
function update(item) {
+ var src = resource.icon('folder');
+ if (!item.isCurrentFolder() && item.$view) {
+ src = item.$view.find('.icon.landscape img').attr('src');
+ }
+
+ $img.attr('src', src);
$label.text(item.label);
if (_.isNumber(item.time)) {
$time.text(format.formatDate(item.time));
@@ -45,7 +54,7 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
$time.text('.');
}
if (_.isNumber(item.size)) {
- $size.text(format.formatSize(item.size));
+ $size.text(format.formatSize(item.size) + ' (' + item.size + ' B)');
} else {
$size.text('.');
}
@@ -55,12 +64,12 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
$size.append(' - ' + stats.folders + ' - ' + stats.files);
}
-
$qrcode.empty().qrcode({
render: modernizr.canvas ? 'canvas' : 'div',
- size: 150,
- color: '#333',
+ size: 200,
+ fill: '#555',
background: null,
+ quiet: 2,
radius: 0.3,
text: window.location.protocol + '//' + window.location.host + item.absHref
});
@@ -68,10 +77,6 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
function onMouseenter(item) {
- if (item.isCurrentParentFolder()) {
- return;
- }
-
update(item);
}
@@ -93,6 +98,7 @@ modulejs.define('ext/info', ['_', '$', 'modernizr', 'core/settings', 'core/resou
}
var $info = $(template).appendTo('#main-row');
+ $img = $info.find('.icon img');
$label = $info.find('.label');
$time = $info.find('.time');
$size = $info.find('.size');
diff --git a/src/_h5ai/conf/options.json b/src/_h5ai/conf/options.json
index a9e5c167..3a0e82aa 100644
--- a/src/_h5ai/conf/options.json
+++ b/src/_h5ai/conf/options.json
@@ -300,7 +300,7 @@ Options
"mov": ["vid-avi", "vid-flv", "vid-mkv", "vid-mov", "vid-mp4", "vid-mpg", "vid-webm"],
"doc": ["x-pdf", "x-ps"],
"delay": 1,
- "size": 100,
+ "size": 240,
"exif": true
},