mirror of
https://github.com/simon987/sist2.git
synced 2025-04-24 12:45:56 +00:00
Use svg for info icon
This commit is contained in:
parent
abae22f88f
commit
b2f1b31c54
@ -6,9 +6,10 @@
|
||||
width: 1rem;
|
||||
margin-right: 0.2rem;
|
||||
cursor: pointer;
|
||||
color: #757575;
|
||||
line-height: 1rem;
|
||||
height: 1.1rem;
|
||||
height: 1rem;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKICAgICB2aWV3Qm94PSIwIDAgNDI2LjY2NyA0MjYuNjY3IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0MjYuNjY3IDQyNi42Njc7IiBmaWxsPSIjZmZmIj4KPGc+CiAgICA8Zz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHJlY3QgeD0iMTkyIiB5PSIxOTIiIHdpZHRoPSI0Mi42NjciIGhlaWdodD0iMTI4Ii8+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMTMuMzMzLDBDOTUuNDY3LDAsMCw5NS40NjcsMCwyMTMuMzMzczk1LjQ2NywyMTMuMzMzLDIxMy4zMzMsMjEzLjMzM1M0MjYuNjY3LDMzMS4yLDQyNi42NjcsMjEzLjMzMwogICAgICAgICAgICAgICAgUzMzMS4yLDAsMjEzLjMzMywweiBNMjEzLjMzMywzODRjLTk0LjA4LDAtMTcwLjY2Ny03Ni41ODctMTcwLjY2Ny0xNzAuNjY3UzExOS4yNTMsNDIuNjY3LDIxMy4zMzMsNDIuNjY3CiAgICAgICAgICAgICAgICBTMzg0LDExOS4yNTMsMzg0LDIxMy4zMzNTMzA3LjQxMywzODQsMjEzLjMzMywzODR6Ii8+CiAgICAgICAgICAgIDxyZWN0IHg9IjE5MiIgeT0iMTA2LjY2NyIgd2lkdGg9IjQyLjY2NyIgaGVpZ2h0PSI0Mi42NjciLz4KICAgICAgICA8L2c+CiAgICA8L2c+CjwvZz4KPC9zdmc+Cg==);
|
||||
filter: brightness(65%);
|
||||
}
|
||||
|
||||
.info-icon:hover {
|
||||
|
@ -6,9 +6,10 @@
|
||||
width: 1rem;
|
||||
margin-right: 0.2rem;
|
||||
cursor: pointer;
|
||||
color: #757575;
|
||||
line-height: 1rem;
|
||||
height: 1rem;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKICAgICB2aWV3Qm94PSIwIDAgNDI2LjY2NyA0MjYuNjY3IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0MjYuNjY3IDQyNi42Njc7IiBmaWxsPSIjZmZmIj4KPGc+CiAgICA8Zz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHJlY3QgeD0iMTkyIiB5PSIxOTIiIHdpZHRoPSI0Mi42NjciIGhlaWdodD0iMTI4Ii8+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMTMuMzMzLDBDOTUuNDY3LDAsMCw5NS40NjcsMCwyMTMuMzMzczk1LjQ2NywyMTMuMzMzLDIxMy4zMzMsMjEzLjMzM1M0MjYuNjY3LDMzMS4yLDQyNi42NjcsMjEzLjMzMwogICAgICAgICAgICAgICAgUzMzMS4yLDAsMjEzLjMzMywweiBNMjEzLjMzMywzODRjLTk0LjA4LDAtMTcwLjY2Ny03Ni41ODctMTcwLjY2Ny0xNzAuNjY3UzExOS4yNTMsNDIuNjY3LDIxMy4zMzMsNDIuNjY3CiAgICAgICAgICAgICAgICBTMzg0LDExOS4yNTMsMzg0LDIxMy4zMzNTMzA3LjQxMywzODQsMjEzLjMzMywzODR6Ii8+CiAgICAgICAgICAgIDxyZWN0IHg9IjE5MiIgeT0iMTA2LjY2NyIgd2lkdGg9IjQyLjY2NyIgaGVpZ2h0PSI0Mi42NjciLz4KICAgICAgICA8L2c+CiAgICA8L2c+CjwvZz4KPC9zdmc+Cg==);
|
||||
filter: brightness(45%);
|
||||
}
|
||||
|
||||
.info-icon:hover {
|
||||
|
@ -343,65 +343,55 @@ function createDocCard(hit) {
|
||||
}
|
||||
|
||||
function makeThumbnail(mimeCategory, hit, imgWrapper, small) {
|
||||
let thumbnail;
|
||||
|
||||
if (
|
||||
//TODO: check tn field
|
||||
mimeCategory === "video" ||
|
||||
(hit["_source"].hasOwnProperty("width") && hit["_source"]["width"] > 32 && hit["_source"]["height"] > 32)
|
||||
|| hit["_source"]["mime"] === "application/pdf"
|
||||
|| hit["_source"]["mime"] === "application/epub+zip"
|
||||
|| hit["_source"]["mime"] === "application/x-cbz"
|
||||
|| hit["_source"]["mime"] === "application/x-cbr"
|
||||
|| hit["_source"].hasOwnProperty("font_name")
|
||||
) {
|
||||
thumbnail = document.createElement("img");
|
||||
if (small) {
|
||||
thumbnail.setAttribute("class", "fit-sm");
|
||||
} else {
|
||||
thumbnail.setAttribute("class", "card-img-top fit");
|
||||
}
|
||||
thumbnail.setAttribute("src", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
|
||||
|
||||
if (shouldDisplayRawImage(hit)) {
|
||||
thumbnail.addEventListener("click", () => {
|
||||
const l = lity(`f/${hit["_id"]}#.jpg`);
|
||||
window.addEventListener("scroll", () => l.close());
|
||||
});
|
||||
|
||||
imgWrapper.classList.add("pointer");
|
||||
} else if (shouldPlayVideo(hit)) {
|
||||
thumbnail.addEventListener("click", () => lity(`f/${hit["_id"]}#.mp4`));
|
||||
|
||||
imgWrapper.classList.add("pointer");
|
||||
|
||||
if (!small) {
|
||||
const playOverlay = document.createElement("div");
|
||||
playOverlay.innerHTML = '<svg viewBox="0 0 494.942 494.942" xmlns="http://www.w3.org/2000/svg"><path d="m35.353 0 424.236 247.471-424.236 247.471z"/></svg>';
|
||||
playOverlay.classList.add("play");
|
||||
imgWrapper.prepend(playOverlay);
|
||||
}
|
||||
}
|
||||
|
||||
const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"], small);
|
||||
imgWrapper.appendChild(placeholder);
|
||||
|
||||
thumbnail.addEventListener("error", () => {
|
||||
imgWrapper.remove();
|
||||
});
|
||||
thumbnail.addEventListener("load", () => {
|
||||
placeholder.remove();
|
||||
imgWrapper.appendChild(thumbnail);
|
||||
});
|
||||
|
||||
if (!hit["_source"].hasOwnProperty("thumbnail")) {
|
||||
return null;
|
||||
}
|
||||
|
||||
let thumbnail = document.createElement("img");
|
||||
if (small) {
|
||||
thumbnail.setAttribute("class", "fit-sm");
|
||||
} else {
|
||||
thumbnail.setAttribute("class", "card-img-top fit");
|
||||
}
|
||||
thumbnail.setAttribute("src", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
|
||||
|
||||
if (shouldDisplayRawImage(hit)) {
|
||||
thumbnail.addEventListener("click", () => {
|
||||
const l = lity(`f/${hit["_id"]}#.jpg`);
|
||||
window.addEventListener("scroll", () => l.close());
|
||||
});
|
||||
|
||||
imgWrapper.classList.add("pointer");
|
||||
} else if (shouldPlayVideo(hit)) {
|
||||
thumbnail.addEventListener("click", () => lity(`f/${hit["_id"]}#.mp4`));
|
||||
|
||||
imgWrapper.classList.add("pointer");
|
||||
|
||||
if (!small) {
|
||||
const playOverlay = document.createElement("div");
|
||||
playOverlay.innerHTML = '<svg viewBox="0 0 494.942 494.942" xmlns="http://www.w3.org/2000/svg"><path d="m35.353 0 424.236 247.471-424.236 247.471z"/></svg>';
|
||||
playOverlay.classList.add("play");
|
||||
imgWrapper.prepend(playOverlay);
|
||||
}
|
||||
}
|
||||
|
||||
const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"], small);
|
||||
imgWrapper.appendChild(placeholder);
|
||||
|
||||
thumbnail.addEventListener("error", () => {
|
||||
imgWrapper.remove();
|
||||
});
|
||||
thumbnail.addEventListener("load", () => {
|
||||
placeholder.remove();
|
||||
imgWrapper.appendChild(thumbnail);
|
||||
});
|
||||
|
||||
return thumbnail;
|
||||
}
|
||||
|
||||
function makeInfoButton(hit) {
|
||||
const infoButton = document.createElement("span");
|
||||
infoButton.appendChild(document.createTextNode("🛈"));
|
||||
infoButton.setAttribute("class", "info-icon");
|
||||
infoButton.addEventListener("click", infoButtonCb(hit));
|
||||
return infoButton;
|
||||
|
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user