diff --git a/public/s/css/f0ckm.css b/public/s/css/f0ckm.css
index 0d19a24..e139058 100644
--- a/public/s/css/f0ckm.css
+++ b/public/s/css/f0ckm.css
@@ -5624,7 +5624,8 @@ body[type='login'] {
position: relative;
width: 100%;
max-width: 100%;
- max-height: 135px;
+ min-height: 200px;
+ max-height: 200px;
background: var(--dropdown-bg);
border: 1px solid var(--black);
padding: 5px;
@@ -5640,6 +5641,7 @@ body[type='login'] {
/* Tabbed mode — switched to column layout by JS when packs are present */
.emoji-picker.has-tabs {
+ min-height: 200px;
max-height: 200px;
overflow: hidden;
flex-direction: column;
@@ -8967,9 +8969,18 @@ span.badge.badge-current {
}*/
.sidebar-comment-img.emoji {
- height: auto;
- max-width: 60px !important;
+ height: 32px;
+ width: auto;
+ max-width: 200px !important;
vertical-align: middle;
+ object-fit: contain;
+}
+
+video.sidebar-comment-img.emoji {
+ max-width: 200px !important;
+ vertical-align: middle;
+ object-fit: contain;
+ display: inline-block;
}
.sidebar-activity .video-embed-wrap {
diff --git a/public/s/js/comments.js b/public/s/js/comments.js
index c8e56e1..5c4c3c0 100644
--- a/public/s/js/comments.js
+++ b/public/s/js/comments.js
@@ -4155,7 +4155,9 @@ class CommentSystem {
// Rebuild content only if the cache has been updated since last build
buildPickerContent();
picker.style.display = ''; // Reset to CSS default (flex)
- requestAnimationFrame(() => picker.scrollIntoView({ behavior: 'smooth', block: 'nearest' }));
+ requestAnimationFrame(() => requestAnimationFrame(() =>
+ window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' })
+ ));
closeHandler = (ev) => {
if (!picker.contains(ev.target) && ev.target !== trigger) {
picker.style.display = 'none';
@@ -4225,7 +4227,9 @@ class CommentSystem {
}
container.appendChild(picker);
- requestAnimationFrame(() => picker.scrollIntoView({ behavior: 'smooth', block: 'nearest' }));
+ requestAnimationFrame(() => requestAnimationFrame(() =>
+ window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' })
+ ));
// Set up close handler
// Set up close handler
diff --git a/public/s/js/sidebar-activity.js b/public/s/js/sidebar-activity.js
index ec3a780..3a7ef33 100644
--- a/public/s/js/sidebar-activity.js
+++ b/public/s/js/sidebar-activity.js
@@ -25,7 +25,11 @@
const renderEmoji = (match, name) => {
if (customEmojis[name]) {
- return ``;
+ const url = customEmojis[name];
+ if (url.endsWith('.webm')) {
+ return ``;
+ }
+ return ``;
}
return match;
};
@@ -37,6 +41,15 @@
return div.innerHTML;
};
+ const playSidebarEmojiVideos = (container) => {
+ if (!container) return;
+ container.querySelectorAll('video.emoji').forEach(v => {
+ v.play().catch(() => {
+ v.addEventListener('canplay', () => v.play().catch(() => {}), { once: true });
+ });
+ });
+ };
+
const ytOembedCache = new Map(); // videoId -> meta object
const ytOembedPending = new Map(); // videoId -> Promise
@@ -592,8 +605,9 @@
attachMediaLoadListeners(container);
checkOverflow();
fetchSidebarYoutubeTitles(container);
- // Auto-play converted GIF videos
+ // Auto-play converted GIF videos and webm emoji stickers
container.querySelectorAll('video.autoplay-gif').forEach(v => { v.autoplay = true; v.muted = true; v.play().catch(() => { v.addEventListener('canplay', () => v.play().catch(() => { }), { once: true }); }); });
+ playSidebarEmojiVideos(container);
return true;
};
@@ -713,8 +727,9 @@
attachMediaLoadListeners(node);
checkOverflow(node);
fetchSidebarYoutubeTitles(node);
+ playSidebarEmojiVideos(node);
});
- // Auto-play converted GIF videos
+ // Auto-play converted GIF videos and webm emoji stickers
container.querySelectorAll('video.autoplay-gif').forEach(v => { v.autoplay = true; v.muted = true; v.play().catch(() => { v.addEventListener('canplay', () => v.play().catch(() => { }), { once: true }); }); });
}
@@ -780,6 +795,7 @@
attachMediaLoadListeners(node);
checkOverflow(node);
fetchSidebarYoutubeTitles(container);
+ playSidebarEmojiVideos(node);
}
}
};