diff --git a/src/webpage/localuser.ts b/src/webpage/localuser.ts index d90c3b9..6893691 100644 --- a/src/webpage/localuser.ts +++ b/src/webpage/localuser.ts @@ -2315,6 +2315,8 @@ class Localuser { if (sValue !== search.value) { return; } + let left = 0, + right = 0; for (const gif of gifReturns) { const div = document.createElement("div"); div.classList.add("gifBox"); @@ -2326,7 +2328,19 @@ class Localuser { img.width = gif.width / scale; img.height = gif.height / scale; div.append(img); + + if (left <= right) { + div.style.top = left + "px"; + left += Math.ceil(img.height) + 10; + div.style.left = "5px"; + } else { + div.style.top = right + "px"; + right += Math.ceil(img.height) + 10; + div.style.left = "210px"; + } + gifs.append(div); + div.onclick = () => { if (this.channelfocus) { this.channelfocus.sendMessage(gif.url, {embeds: [], attachments: [], replyingto: null}); @@ -2334,6 +2348,7 @@ class Localuser { } }; } + gifs.style.height = Math.max(left, right) + "px"; }; let last = ""; search.onkeyup = () => { diff --git a/src/webpage/style.css b/src/webpage/style.css index e92bbbb..46230c8 100644 --- a/src/webpage/style.css +++ b/src/webpage/style.css @@ -2690,6 +2690,8 @@ fieldset input[type="radio"] { overflow-y: auto; margin: 0.1in; align-items: center; + position: relative; + overflow-x: clip; } .searchGifBar { height: 0.3in; @@ -2704,7 +2706,16 @@ fieldset input[type="radio"] { .gifBox { img { max-width: 196px; + border-radius: 4px; } + + + + cursor: pointer; - cursor: p; + position: absolute; + overflow: hidden; + + + }