Add favicons
This commit is contained in:
parent
e192ff058b
commit
3014762ae3
2 changed files with 25 additions and 5 deletions
|
|
@ -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;
|
||||||
|
|
|
||||||
18
js/index.js
18
js/index.js
|
|
@ -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();
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue