Backup_Repos/filestash
1
0
Fork 0
mirror of https://github.com/mickael-kerjean/filestash synced 2025-12-06 08:22:24 +01:00
Code Issues Projects Releases Wiki Activity

fix (tag): tag hovering issue

Browse source
This commit is contained in:
MickaelK 2025-08-27 17:53:47 +10:00
parent cec55aa996
commit 3b48a5fa80
3 changed files with 20 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
public/assets/components/sidebar.js
View file

@ -249,11 +249,12 @@ async function ctrlTagPane(render, { tags, path }) {
rxjs.catchError(() => rxjs.of({ tags: [] })), rxjs.catchError(() => rxjs.of({ tags: [] })),
), ),
).pipe( ).pipe(
rxjs.map(({ tags, response }) => { // feature: create the DOM
rxjs.mergeMap(({ tags, response }) => {
render($page); render($page);
if (tags.length === 0) { if (tags.length === 0) {
$page.classList.add("hidden"); $page.classList.add("hidden");
return {}; return rxjs.EMPTY;
} }
$page.classList.remove("hidden"); $page.classList.remove("hidden");
const $fragment = document.createDocumentFragment(); const $fragment = document.createDocumentFragment();
@ -280,8 +281,9 @@ async function ctrlTagPane(render, { tags, path }) {
} }
$fragment.appendChild($tag); $fragment.appendChild($tag);
}); });
return { $list: renderTaglist($fragment), response }; return rxjs.of({ $list: renderTaglist($fragment), response });
}), }),
// feature: tag mouse hover effect
rxjs.tap(({ $list, response }) => { rxjs.tap(({ $list, response }) => {
if (isMobile) return; if (isMobile) return;
else if (!response) return; else if (!response) return;
@ -296,16 +298,19 @@ async function ctrlTagPane(render, { tags, path }) {
if (tags.indexOf(tagname) === -1) continue; if (tags.indexOf(tagname) === -1) continue;
paths.push(path); paths.push(path);
} }
$tag.onmouseenter = () => document.querySelectorAll(".component_thing").forEach(($thing) => { $tag.onmouseenter = () => {
const thingpath = $thing.getAttribute("data-path"); const $things = document.querySelectorAll(".component_thing");
for (let i=0; i<paths.length; i++) { $things.forEach(($thing) => {
if (paths[i].indexOf(thingpath) === 0) { const thingpath = $thing.getAttribute("data-path");
$thing.classList.add("hover"); for (let i=0; i<paths.length; i++) {
$tag.onmouseleave = () => $thing.classList.remove("hover"); if (paths[i].indexOf(thingpath) === 0) {
break; $thing.classList.add("hover");
break;
}
} }
} });
}); $tag.onmouseleave = () => $things.forEach(($thing) => $thing.classList.remove("hover"));
};
}); });
}), }),
)); ));

2
public/assets/pages/filespage/modal_tag.css
View file

@ -9,7 +9,7 @@
border: 2px solid var(--border); border: 2px solid var(--border);
border-radius: 5px; border-radius: 5px;
padding: 5px 10px; padding: 5px 10px;
color: var(--color); color: rgba(0,0,0,0.75);
width: 100%; width: 100%;
display: block; display: block;
box-sizing: border-box; box-sizing: border-box;

3
public/assets/pages/filespage/thing.css
View file

@ -254,7 +254,8 @@
.list > .component_thing.view-grid img.thumbnail { .list > .component_thing.view-grid img.thumbnail {
transition: 0.2s ease-out transform; transition: 0.2s ease-out transform;
} }
.list > .component_thing.view-grid.not-selected:hover img.thumbnail { .list > .component_thing.view-grid.not-selected:hover img.thumbnail,
.list > .component_thing.view-grid.not-selected.hover img.thumbnail {
transform: scale(0.6); transform: scale(0.6);
} }
.list > .component_thing.view-grid.not-selected:hover .image_layer { .list > .component_thing.view-grid.not-selected:hover .image_layer {