Add favicons

This commit is contained in:
nazrin 2024-12-29 17:13:48 +00:00
parent e192ff058b
commit 3014762ae3
2 changed files with 25 additions and 5 deletions

View file

@ -143,15 +143,23 @@ header #new-file .btn-svg svg {
margin-left:auto; margin-left:auto;
margin-right:5px; margin-right:5px;
} }
.file-type[data-type="JS"]{ .file[data-type="JS"] .file-name{
color: #ffde24 color: #ffde24
} }
.file-type[data-type="CSS"]{ .file[data-type="CSS"] .file-name{
color: #15a0dc color: #15a0dc
} }
.file.filtered{ .file.filtered{
display: none; display: none;
} }
.file .file-link-favicons{
display: flex;
}
.file .file-link-favicon{
max-width: 1em;
max-height: 1em;
margin-left: 4px;
}
#search-bar-container{ #search-bar-container{
margin: 8px; margin: 8px;

View file

@ -5,7 +5,9 @@ function createFileEntry(fileObject, element){
file.innerHTML = ` file.innerHTML = `
<label class="check" title="Enable or disable file"><input type="checkbox" ${info.enabled?"checked='true'":""}><span></span></label> <label class="check" title="Enable or disable file"><input type="checkbox" ${info.enabled?"checked='true'":""}><span></span></label>
<span class="file-name">${info.name}</span> <span class="file-name">${info.name}</span>
<span class="file-type" data-type="${info.type}">${info.type}</span> <div class="file-link-favicons">
<img class="file-link-favicon" src="https://sylvie.moe/favicon.ico">
</div>
<div class="file-icons"> <div class="file-icons">
<span class="file-icon file-edit" title="Edit file"> <span class="file-icon file-edit" title="Edit file">
<svg viewBox="0 0 48 48"> <svg viewBox="0 0 48 48">
@ -25,13 +27,23 @@ function createFileEntry(fileObject, element){
file.dataset.type = info.type; file.dataset.type = info.type;
file.dataset.enabled = info.enabled; file.dataset.enabled = info.enabled;
file.dataset.name = info.name; file.dataset.name = info.name;
file.dataset.links = info.links ? file.dataset.links = info.links.map(url => { let domains = (info.links ?? []).map(url => {
try{ try{
return (new URL(url)).hostname; return (new URL(url)).hostname;
}catch(exc){ }catch(exc){
return ""; return "";
} }
}).join(" ") : ""; });
file.dataset.links = domains.join(" ");
let favicons = file.querySelector(".file-link-favicons");
favicons.innerHTML = "";
for(domain of domains){
let favicon = document.createElement("img");
favicon.className = "file-link-favicon";
favicon.src = `https://icons.duckduckgo.com/ip3/${domain}.ico`;
favicons.appendChild(favicon);
}
} }
setDataset(); setDataset();