self-hosted/dufs
self-hosted/dufs
1
0
Fork 0
mirror of https://github.com/sigoden/dufs synced 2024-07-20 09:44:47 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: reactive webpage (#51)

Browse source
This commit is contained in:
Joe Koop 2022-06-19 09:04:59 -05:00 committed by GitHub
parent db71f75236
commit b1b0fdd4db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
assets/index.css
View file

@ -4,10 +4,6 @@ html {
color: #24292e;
}
body {
width: 700px;
}
.hidden {
display: none;
}
@ -151,10 +147,10 @@ body {
height: 100%;
fill: rgba(3,47,98,0.5);
padding-right: 0.5em;
vertical-align: text-top;
}
.path {
display: flex;
list-style: none;
}
@ -165,6 +161,8 @@ body {
overflow: hidden;
display: block;
text-decoration: none;
max-width: calc(100vw - 375px);
min-width: 400px;
}
.path a:hover {
@ -202,7 +200,7 @@ body {
svg,
.path svg {
fill: #d0e6ff;
fill: #fff;
}
.searchbar {

6
assets/index.html
View file

@ -35,7 +35,7 @@
<table class="uploaders-table hidden">
<thead>
<tr>
<th class="cell-name">Name</th>
<th class="cell-name" colspan="2">Name</th>
<th class="cell-status">Speed - Progress - Time Left</th>
</tr>
</thead>
@ -43,8 +43,8 @@
<table class="paths-table hidden">
<thead>
<tr>
<th class="cell-name">Name</th>
<th class="cell-mtime">Date modify</th>
<th class="cell-name" colspan="2">Name</th>
<th class="cell-mtime">Last modified</th>
<th class="cell-size">Size</th>
<th class="cell-actions">Actions</th>
</tr>

8
assets/index.js
View file

@ -68,7 +68,7 @@ class Uploader {
$uploadersTable.insertAdjacentHTML("beforeend", `
<tr id="upload${idx}" class="uploader">
<td class="path cell-name">
<div>${getSvg("File")}</div>
${getSvg("File")}
<a href="${url}">${name}</a>
</td>
<td class="cell-status upload-status" id="uploadStatus${idx}"></td>
@ -188,8 +188,10 @@ function addPath(file, index) {
$pathsTableBody.insertAdjacentHTML("beforeend", `
<tr id="addPath${index}">
<td class="path cell-icon">
${getSvg(file.path_type)}
</td>
<td class="path cell-name">
<div>${getSvg(file.path_type)}</div>
<a href="${url}" title="${file.name}">${file.name}</a>
</td>
<td class="cell-mtime">${formatMtime(file.mtime)}</td>
@ -295,7 +297,7 @@ function formatMtime(mtime) {
const day = padZero(date.getDate(), 2);
const hours = padZero(date.getHours(), 2);
const minutes = padZero(date.getMinutes(), 2);
return `${year}/${month}/${day} ${hours}:${minutes}`;
return `${year}-${month}-${day} ${hours}:${minutes}`;
}
function padZero(value, size) {