add message when no files exist in the folder

toast
Kit Kasune 3 years ago
parent a1152cd013
commit 155ffc7c41
  1. 4
      main.js
  2. 2
      scripts/contextmenu/newfolder.js
  3. 10
      scripts/fileview/load/render.js
  4. 38
      styles/files.css

@ -8,8 +8,8 @@ async function createWindow () {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
minHeight: 400,
minWidth: 600,
minHeight: 600,
minWidth: 750,
webPreferences: {
preload: path.join(__dirname, 'scripts/startup/preload.js'),
nodeIntegration: true,

@ -60,7 +60,7 @@ module.exports = () => {
"Folder created", [`Folder "${input.value}" created successfully`, `<em>${window.kade.cpath}\\${input.value}</em>`], undefined, false, 5,
() => {
refresh(`${window.kade.cpath}\\${input.value}`);
require('electron').clipboard.writeText(`${window.kade.cpath}\\${input.value}`);
require('electron').clipboard.writeText(`${window.kade.cpath}`);
newToast("Copied!", "<em>The folder's path has been copied to your clipboard.</em>", "#19df46");
}
);

@ -6,10 +6,10 @@ module.exports = (dir, options) => {
const refresh = require("../refresh");
let cdir = dir || window.kade.cdir;
const exp = document.getElementById('files');
let num = 0;
for (let i = 0; i < cdir.length; i++) {
let file = cdir[i];
const exp = document.getElementById('files');
let cfc = document.createElement("div");
cfc.className = 'file';
if (options.animate) {cfc.classList.add('rise');}
@ -74,4 +74,12 @@ module.exports = (dir, options) => {
window.scrollTo(0, window.kade.scrollY);
window.kade.scrollY = 0;
}
if (!cdir.length) {
let nts = document.createElement('p');
nts.id = 'nothing-to-show';
nts.innerHTML = "There's nothing to show here!<br>But you can look at this really pretty box :)<br><br><em>The folder is empty, or I don't have the permissions to show you your files.</em>";
nts.className = 'nosel';
exp.appendChild(nts);
}
};

@ -98,4 +98,42 @@
padding: 0 0;
width: 27%;
height: 100%;
}
#nothing-to-show {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
text-align: center;
color: #afafaf;
font-family: 'Montserrat', sans-serif;
font-size: 24px;
padding: 15px;
--angle: 0deg;
border: 4px solid;
border-image: linear-gradient(var(--angle), rgb(92, 18, 72) 20%, rgb(60, 62, 131) 60%, rgb(92, 18, 72) 100%) 1;
animation: 10s rotate linear infinite, moving-stripes 10s linear infinite;
background-image: repeating-linear-gradient(-45deg, #a172a64f, #afafaf19 30px);
background-size: 200%;
}
@media only screen and (max-width: 900px) {
#nothing-to-show {font-size: 16px;}
}
@keyframes rotate {
to {
--angle: 360deg;
}
}
@keyframes moving-stripes {
100% {background-position: 100% 100%;}
}
@property --angle {
syntax: '<angle>';
initial-value: 0deg;
inherits: false;
}
Loading…
Cancel
Save