infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

Update the drive UI to show that Upload and New are linked to a folder

Browse Source
pull/1/head
yflory 8 years ago
parent 1077b3b267
commit 8738b42861
4 changed files with 36 additions and 41 deletions
Show Stats Download Patch File Download Diff File

20
www/drive/file.css
Unescape Escape View File

@ -132,7 +132,7 @@ span.fa-folder-open {
width: calc(100% - 30px);
}
#tree li > span.element-row {
width: calc(100% + 5px);
min-width: calc(100% + 5px);
display: inline-block;
cursor: pointer;
margin-left: -5px;
@ -223,6 +223,11 @@ span.fa-folder-open {
display: none;
}
/* CONTENT */
#rightCol {
display: flex;
flex-flow: column;
flex: 1;
}
#content {
box-sizing: border-box;
background: #fff;
@ -450,9 +455,6 @@ span.fa-folder-open {
#driveToolbar {
background: #ddd;
color: #555;
height: 30px;
display: flex;
flex-flow: row;
border-top: 1px solid #ccc;
border-bottom: ;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
@ -516,21 +518,25 @@ span.fa-folder-open {
width: 250px;
margin: 0;
padding: 0;
display: inline-block;
}
#driveToolbar .rightside {
margin: 0;
padding: 0;
flex: 1;
display: inline-block;
float: right;
}
#driveToolbar .path {
display: inline-block;
height: 100%;
width: 100%;
height: 30px;
line-height: 30px;
cursor: default;
width: auto;
overflow: hidden;
white-space: nowrap;
direction: rtl;
max-width: 100%;
text-align: left;
}
#driveToolbar .path .element {
padding: 5px;

24
www/drive/file.less
Unescape Escape View File

@ -171,7 +171,7 @@ span {
width: ~"calc(100% - 30px)";
}
& > span.element-row {
width: ~"calc(100% + 5px)";
min-width: ~"calc(100% + 5px)";
display: inline-block;
cursor: pointer;
margin-left: -5px;
@ -272,7 +272,11 @@ span {
}
/* CONTENT */
#rightCol {
display: flex;
flex-flow: column;
flex: 1;
}
#content {
box-sizing: border-box;
background: @content-bg;
@ -519,9 +523,9 @@ span {
#driveToolbar {
background: @toolbar-bg;
color: @toolbar-fg;
height: 30px;
display: flex;
flex-flow: row;
//height: 30px;
//display: flex;
//flex-flow: row;
border-top: 1px solid @toolbar-border-col;
border-bottom: ;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
@ -586,21 +590,25 @@ span {
width: 250px;
margin: 0;
padding: 0;
display: inline-block;
}
.rightside {
margin: 0;
padding: 0;
flex: 1;
display: inline-block;
float: right;
}
.path {
display: inline-block;
height: 100%;
width: 100%;
height: 30px;
line-height: 30px;
cursor: default;
width: auto;
overflow: hidden;
white-space: nowrap;
direction: rtl;
max-width: 100%;
text-align: left;
.element {
padding: 5px;
border: 1px solid @toolbar-bg;

5
www/drive/inner.html
Unescape Escape View File

@ -10,11 +10,12 @@
</head>
<body>
<div id="toolbar" class="toolbar-container"></div>
<div id="driveToolbar"></div>
<div class="app-container" tabindex="0">
<div id="tree">
</div>
<div id="content" tabindex="2">
<div id="rightCol">
<div id="driveToolbar"></div>
<div id="content" tabindex="2"></div>
</div>
<div id="treeContextMenu" class="contextMenu dropdown clearfix">
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display:block;position:static;margin-bottom:5px;">

28
www/drive/main.js
Unescape Escape View File

@ -649,12 +649,7 @@ define([
};
var updatePathSize = function () {
var $context = $iframe.find('#contextButtonsContainer');
var l = 50;
if ($context.length) {
l += $context.width() || 0;
}
$driveToolbar.find('.path').css('max-width', 'calc(100vw - '+$tree.width()+'px - '+l+'px)');
$driveToolbar.find('.path').css('max-width', 'calc(100vw - '+$tree.width()+'px - 50px)');
};
var getSelectedPaths = function ($element) {
@ -1261,7 +1256,7 @@ define([
var createTitle = function (path, noStyle) {
if (!path || path.length === 0) { return; }
var isTrash = filesOp.isPathIn(path, [TRASH]);
var $title = $('<span>', {'class': 'path unselectable'});
var $title = $driveToolbar.find('.path');
if (APP.mobile()) {
return $title;
}
@ -1638,10 +1633,8 @@ define([
var $toolbar = $driveToolbar;
$toolbar.html('');
var $leftside = $('<div>', {'class': 'leftside'}).appendTo($toolbar);
if (!APP.mobile()) {
$leftside.width($tree.width());
}
$('<div>', {'class': 'rightside'}).appendTo($toolbar);
$('<div>', {'class': 'path unselectable'}).appendTo($toolbar);
return $toolbar;
};
@ -1866,7 +1859,7 @@ define([
}
var $list = $('<ul>').appendTo($dirContent);
createTitle(path).appendTo($toolbar.find('.rightside'));
createTitle(path).appendTo($toolbar.find('.path'));
updatePathSize();
if (APP.mobile()) {
@ -2556,19 +2549,6 @@ define([
}
});
$iframe.find('#tree').mousedown(function () {
if (APP.mobile()) { return; }
if (APP.resizeTree) { return; }
APP.resizeTree = window.setInterval(function () {
$driveToolbar.find('.leftside').width($tree.width());
updatePathSize();
}, 100);
});
$appContainer.mouseup(function () {
window.clearInterval(APP.resizeTree);
APP.resizeTree = undefined;
});
history.onEnterHistory = function (obj) {
var files = obj.drive;
filesOp = FO.init(files, config);

Write Preview
Loading…
Cancel
Save