diff --git a/src/components/views/All.jsx b/src/components/views/All.jsx
index 7e4feaa9..1bd1698f 100755
--- a/src/components/views/All.jsx
+++ b/src/components/views/All.jsx
@@ -720,7 +720,7 @@ const All = () => {
                                 commentMediaInfo?.url.slice(0, 30) + "(...)" :
                                 commentMediaInfo?.url
                                 }</a>&nbsp;({commentMediaInfo?.type === "iframe" ? "video" : commentMediaInfo?.type})
-                                {isThreadThumbnailClicked[index] ? (
+                                {isThreadThumbnailClicked[index] && commentMediaInfo.type !== "image" ? (
                                   <span>
                                     -[
                                       <span className='reply-link' 
@@ -1432,7 +1432,7 @@ const All = () => {
                                   replyMediaInfo?.url.slice(0, 30) + "(...)" :
                                   replyMediaInfo?.url
                                   }</a>&nbsp;({replyMediaInfo?.type})
-                                  {replyMediaInfo?.type === "video" || "iframe" ? (
+                                  {replyMediaInfo?.type === "video" ||  replyMediaInfo?.type === "iframe" ? (
                                     isReplyThumbnailClicked[index] ? (
                                       <span>
                                         -[
@@ -1844,7 +1844,7 @@ const All = () => {
                                         style={{cursor: "pointer"}}
                                         onError={(e) => e.target.src = fallbackImgUrl} />
                                     )}
-                                    {commentMediaInfo?.type === "video" || "iframe" ? (
+                                    {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                       isMobileThreadThumbnailClicked[index] ? (
                                         <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                           <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -1901,7 +1901,7 @@ const All = () => {
                                             onError={(e) => e.target.src = fallbackImgUrl} 
                                           />
                                         )}
-                                        {commentMediaInfo?.type === "video" || "iframe" ? (
+                                        {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                           isMobileThreadThumbnailClicked[index] ? (
                                             <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                               <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
diff --git a/src/components/views/AllCatalog.jsx b/src/components/views/AllCatalog.jsx
index 71ac7a58..487a1ae6 100755
--- a/src/components/views/AllCatalog.jsx
+++ b/src/components/views/AllCatalog.jsx
@@ -339,53 +339,55 @@ const CatalogPost = ({post}) => {
 
 
   return (
-    <div key={`thread-`} className="thread" 
-    onMouseOver={() => {setIsHoveringOnThread(thread.cid)}} 
+    <div key={`thread-`} className="thread"  
     onMouseLeave={() => {handleMouseOnLeaveThread()}}>
       {isHoveringOnThread === thread.cid  ? 
-      <div ref={popupRef}
-      onMouseOver={() => handleMouseOnLeaveThread()}
-      style={{
-      opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
-      visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
-      left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      }}
-      className="thread_popup">
-        <p
-        style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
-          && !isEnoughSpaceOnRight
-          ?
-          {overflow:"visible",whiteSpace:"normal"}
-        : null
-        }
-        className="thread_popup_content">
-        <span className="thread_popup_title" >
-          {thread.title ? `${thread.title} ` : "Posted "}
-        </span>
-        by 
-        <span className="thread_popup_author"> 
-        {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
-        </span> 
-        {thread.timestamp ? getFormattedTime(thread.timestamp) : null}</p>
-        <div>
-        {thread.replyCount > 0 ?
-        <p className="thread_popup_lastReply">
-        Last reply by <span className="thread_popup_author"> Anonymous </span> 
-        {getFormattedTime(thread.lastReplyTimestamp)}</p>
-        : null}</div>
-        </div> : null }
+        <div ref={popupRef}
+        onMouseOver={() => handleMouseOnLeaveThread()}
+        style={{
+        opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
+        visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
+        left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
+          ? isMediaShowed
+            ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+            : `calc(50% + ${textRect.width}px / 2 + 5px)`
+          : 'auto',
+        right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
+          ? isMediaShowed
+            ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+            : `calc(50% + ${textRect.width}px / 2 + 5px)`
+          : 'auto',
+        }}
+        className="thread_popup">
+          <p
+          style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
+            && !isEnoughSpaceOnRight
+            ?
+            {overflow:"visible",whiteSpace:"normal"}
+          : null}
+          className="thread_popup_content">
+            <span className="thread_popup_title" >
+              {thread.title ? `${thread.title} ` : "Posted "}
+            </span>
+            by 
+            <span className="thread_popup_author"> 
+              {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
+            </span> 
+            {thread.timestamp ? getFormattedTime(thread.timestamp) : null}
+          </p>
+          <div>
+            {thread.replyCount > 0 ?
+              <p className="thread_popup_lastReply">
+                Last reply by <span className="thread_popup_author"> Anonymous </span> 
+                {getFormattedTime(thread.lastReplyTimestamp)}
+              </p>
+            : null}
+          </div>
+        </div> 
+      : null }
       {commentMediaInfo?.url ? (
         <Link style={{all: "unset", cursor: "pointer"}} key={`link-`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} 
-        onClick={() => setSelectedThread(thread.cid)}>
+        onClick={() => setSelectedThread(thread.cid)} onMouseOver={() => {setIsHoveringOnThread(thread.cid)}}>
           {commentMediaInfo?.type === "webpage" ? (
             thread.thumbnailUrl ? (
               <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
@@ -398,6 +400,13 @@ const CatalogPost = ({post}) => {
               </span>
             ) : null
           ) : null}
+          {commentMediaInfo?.type === "iframe" && (thread.thumbnailUrl || commentMediaInfo.thumbnail) ? (
+            <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
+              <img className="card" ref={imageRef} key={`img-`}
+              src={commentMediaInfo.thumbnail} alt={commentMediaInfo.type}
+              onError={(e) => { e.target.src = fallbackImgUrl }}  />
+            </span>
+          ) : null}
           {commentMediaInfo?.type === "image" ? (
             <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
               <img className="card" ref={imageRef} key={`img-`}
@@ -425,11 +434,7 @@ const CatalogPost = ({post}) => {
         </Link>
       ) : null}
       <div key={`ti-`} className="thread-icons" >
-      {(commentMediaInfo && (
-        commentMediaInfo.type === 'image' || 
-        commentMediaInfo.type === 'video' || 
-        (commentMediaInfo.type === 'webpage' && 
-        commentMediaInfo.thumbnail))) ? (                          
+      {isMediaShowed ? (                          
           <OfflineIndicator 
           address={thread.subplebbitAddress} 
           className="thread-icon offline-icon"
@@ -441,7 +446,7 @@ const CatalogPost = ({post}) => {
           tooltipPlace="top" />
       )}
       </div>
-      <BoardForm selectedStyle={selectedStyle} 
+      <BoardForm selectedStyle={selectedStyle} onMouseOver={() => handleMouseOnLeaveThread()}
       style={{ all: "unset"}}>
         <div key={`meta-`} className="meta" title="(R)eplies / (L)ink Replies" >
           R:&nbsp;<b key={`b-`}>{thread.replyCount}</b>
@@ -594,7 +599,7 @@ const CatalogPost = ({post}) => {
       onClick={() => setSelectedThread(thread.cid)}>
         <div key={`t-`} className="teaser" style={{maxHeight: `calc(320px - ${displayHeight})`}}
         ref={(el) => (threadRefs.current[thread.cid] = el)}>
-          <span key={`teaser-width${thread.cid}`} ref={textRef}>
+          <span key={`teaser-width${thread.cid}`} ref={textRef} onMouseOver={() => {setIsHoveringOnThread(thread.cid)}}>
             <b key={`b2-`}>{thread.title ? `${thread.title}` : null}</b>
             {thread.content ? `: ${thread.content}` : null}
           </span>
diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx
index 62aa4625..758721f0 100755
--- a/src/components/views/Board.jsx
+++ b/src/components/views/Board.jsx
@@ -1416,7 +1416,7 @@ const Board = () => {
                                     commentMediaInfo?.url.slice(0, 30) + "(...)" :
                                     commentMediaInfo?.url
                                     }</a>&nbsp;({commentMediaInfo?.type === "iframe" ? "video" : commentMediaInfo?.type})
-                                    {isThreadThumbnailClicked[index] ? (
+                                    {isThreadThumbnailClicked[index] && commentMediaInfo.type !== "image" ? (
                                       <span>
                                         -[
                                           <span className='reply-link' 
@@ -2125,8 +2125,8 @@ const Board = () => {
                                           replyMediaInfo?.url.slice(0, 30) + "(...)" :
                                           replyMediaInfo?.url
                                           }</a>&nbsp;({replyMediaInfo?.type})
-                                          {replyMediaInfo?.type === "video" || "iframe" ? (
-                                            isReplyThumbnailClicked[index] ? (
+                                          {replyMediaInfo?.type === "video" ||  replyMediaInfo?.type === "iframe" ? (
+                                            isReplyThumbnailClicked[index] && commentMediaInfo.type !== "image"  ? (
                                               <span>
                                                 -[
                                                   <span className='reply-link' 
@@ -2532,7 +2532,7 @@ const Board = () => {
                                             style={{cursor: "pointer"}}
                                             onError={(e) => e.target.src = fallbackImgUrl} />
                                         )}
-                                        {commentMediaInfo?.type === "video" || "iframe" ? (
+                                        {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                           isMobileThreadThumbnailClicked[index] ? (
                                             <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                               <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -2589,7 +2589,7 @@ const Board = () => {
                                                 onError={(e) => e.target.src = fallbackImgUrl} 
                                               />
                                             )}
-                                            {commentMediaInfo?.type === "video" || "iframe" ? (
+                                            {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                               isMobileThreadThumbnailClicked[index] ? (
                                                 <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                                   <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -2789,7 +2789,7 @@ const Board = () => {
                                                 onError={(e) => e.target.src = fallbackImgUrl} 
                                               />
                                             )}
-                                            {replyMediaInfo?.type === "video" || "iframe" ? (
+                                            {replyMediaInfo?.type === "video" ||  replyMediaInfo?.type === "iframe" ? (
                                               isMobileReplyThumbnailClicked[index] ? (
                                                 <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                                   <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx
index 4c20bb25..8f2930b5 100755
--- a/src/components/views/Catalog.jsx
+++ b/src/components/views/Catalog.jsx
@@ -591,51 +591,53 @@ const CatalogPost = ({post}) => {
   } else {
     return (
       <div key={`thread-`} className="thread"
-      onMouseLeave={()=>{handleMouseOnLeaveThread()}} onMouseOver={() => setIsHoveringOnThread(thread.cid)}>
-      {isHoveringOnThread === thread.cid  ? 
-      <div ref={popupRef}
-      onMouseOver={() => handleMouseOnLeaveThread()}
-      style={{
-      opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
-      visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
-      left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      }}
-      className="thread_popup">
-        <p
-        style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
-          && !isEnoughSpaceOnRight
-          ?
-          {overflow:"visible",whiteSpace:"normal"}
-        : null
-        }
-        className="thread_popup_content">
-        <span className="thread_popup_title" >
-          {thread.title ? `${thread.title} ` : "Posted "}
-        </span>
-        by 
-        <span className="thread_popup_author"> 
-        {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
-        </span> 
-        {thread.timestamp ? getFormattedTime(thread.timestamp) : null}</p>
-        <div>
-        {thread.replyCount > 0 ?
-        <p className="thread_popup_lastReply">
-        Last reply by <span className="thread_popup_author"> Anonymous </span> 
-        {getFormattedTime(thread.lastReplyTimestamp)}</p>
-        : null}</div>
-        </div> : null }
+      onMouseLeave={()=>{handleMouseOnLeaveThread()}}>
+        {isHoveringOnThread === thread.cid  ? 
+          <div ref={popupRef}
+          onMouseOver={() => handleMouseOnLeaveThread()}
+          style={{
+          opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
+          visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
+          left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
+            ? isMediaShowed
+              ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+              : `calc(50% + ${textRect.width}px / 2 + 5px)`
+            : 'auto',
+          right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
+            ? isMediaShowed
+              ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+              : `calc(50% + ${textRect.width}px / 2 + 5px)`
+            : 'auto',
+          }}
+          className="thread_popup">
+            <p
+            style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
+              && !isEnoughSpaceOnRight
+              ?
+              {overflow:"visible",whiteSpace:"normal"}
+            : null
+            }
+            className="thread_popup_content">
+            <span className="thread_popup_title" >
+              {thread.title ? `${thread.title} ` : "Posted "}
+            </span>
+            by 
+            <span className="thread_popup_author"> 
+            {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
+            </span> 
+            {thread.timestamp ? getFormattedTime(thread.timestamp) : null}</p>
+            <div>
+              {thread.replyCount > 0 ?
+              <p className="thread_popup_lastReply">
+              Last reply by <span className="thread_popup_author"> Anonymous </span> 
+              {getFormattedTime(thread.lastReplyTimestamp)}</p>
+              : null}
+            </div>
+          </div> 
+        : null }
         {commentMediaInfo?.url ? (
           <Link style={{all: "unset", cursor: "pointer"}} key={`link-`} to={`/p/${selectedAddress}/c/${thread.cid}`} 
-          onClick={() => setSelectedThread(thread.cid)}>
+          onClick={() => setSelectedThread(thread.cid)} onMouseOver={() => setIsHoveringOnThread(thread.cid)}>
             {commentMediaInfo?.type === "webpage" ? (
               thread.thumbnailUrl ? (
                 <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
@@ -648,6 +650,13 @@ const CatalogPost = ({post}) => {
                 </span>
               ) : null
             ) : null}
+            {commentMediaInfo?.type === "iframe" && (thread.thumbnailUrl || commentMediaInfo.thumbnail) ? (
+              <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
+                <img className="card" ref={imageRef} key={`img-`}
+                src={commentMediaInfo.thumbnail} alt={commentMediaInfo.type}
+                onError={(e) => { e.target.src = fallbackImgUrl }}  />
+              </span>
+            ) : null}
             {commentMediaInfo?.type === "image" ? (
               <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
                 <img className="card" ref={imageRef} key={`img-`}
@@ -674,11 +683,7 @@ const CatalogPost = ({post}) => {
             ) : null}
           </Link>
         ) : null}
-        {(commentMediaInfo && (
-        commentMediaInfo.type === 'image' || 
-        commentMediaInfo.type === 'video' ||
-        (commentMediaInfo.type === 'webpage' && 
-        commentMediaInfo.thumbnail))) ? (
+        {isMediaShowed ? (
         <div key={`ti-`} className="thread-icons" >
           {thread.pinned ? (
             <span key={`si-`} className="thread-icon sticky-icon" title="Sticky"
@@ -692,7 +697,7 @@ const CatalogPost = ({post}) => {
           ) : null}
         </div>
         ) : null}
-        <BoardForm selectedStyle={selectedStyle} 
+        <BoardForm selectedStyle={selectedStyle} onMouseOver={() => handleMouseOnLeaveThread()}
         style={{ all: "unset"}}>
           <div key={`meta-`} className="meta" title="(R)eplies / (L)ink Replies" >
             R:&nbsp;<b key={`b-`}>{thread.replyCount}</b>
@@ -702,11 +707,7 @@ const CatalogPost = ({post}) => {
                 L:&nbsp;<b key={`i-`}>{linkCount}</b>
               </>
             ) : null}
-            {(commentMediaInfo && (
-              commentMediaInfo.type === 'image' || 
-              commentMediaInfo.type === 'video' || 
-              (commentMediaInfo.type === 'webpage' && 
-              commentMediaInfo.thumbnail))) ? null : (
+            {isMediaShowed ? null : (
               <div className='thread-icons' 
               style={{position: 'absolute', top: '-2px', right: '15px'}}>
                 {thread.pinned ? (
@@ -795,10 +796,7 @@ const CatalogPost = ({post}) => {
                       ) : null}
                     </>
                   )}</VerifiedAuthor>
-                  {(commentMediaInfo && (
-                    commentMediaInfo.type === 'image' || 
-                    (commentMediaInfo.type === 'webpage' && 
-                    commentMediaInfo.thumbnail))) ? ( 
+                  {isMediaShowed ? ( 
                       <li 
                       onMouseOver={() => {setIsImageSearchOpen(true)}}
                       onMouseLeave={() => {setIsImageSearchOpen(false)}}>
@@ -863,7 +861,7 @@ const CatalogPost = ({post}) => {
           <div key={`t-`} className="teaser" style={{maxHeight: `calc(320px - ${displayHeight})`}}>
           <div style={{cursor:"text"}}
             ref={(el) => (threadRefs.current[thread.cid] = el)}>
-              <span key={`teaser-width${thread.cid}`} ref={textRef}>
+              <span key={`teaser-width${thread.cid}`} ref={textRef} onMouseOver={() => setIsHoveringOnThread(thread.cid)}>
                 <b key={`b2-`}>{thread.title ? `${thread.title}` : null}</b>
                 {thread.content ? `: ${thread.content}` : null}
               </span>
diff --git a/src/components/views/Pending.jsx b/src/components/views/Pending.jsx
index 9125fcca..62943f91 100755
--- a/src/components/views/Pending.jsx
+++ b/src/components/views/Pending.jsx
@@ -496,7 +496,7 @@ const Pending = () => {
                                       style={{cursor: "pointer"}}
                                       onError={(e) => e.target.src = fallbackImgUrl} />
                                   )}
-                                  {commentMediaInfo?.type === "video" || "iframe" ? (
+                                  {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                     isMobileThumbnailClicked[index] ? (
                                       <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                         <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -553,7 +553,7 @@ const Pending = () => {
                                         onError={(e) => e.target.src = fallbackImgUrl} 
                                       />
                                     )}
-                                    {commentMediaInfo?.type === "video" || "iframe" ? (
+                                    {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                       isMobileThumbnailClicked[index] ? (
                                         <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                           <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx
index 9f418818..ea5cc73a 100755
--- a/src/components/views/Subscriptions.jsx
+++ b/src/components/views/Subscriptions.jsx
@@ -731,7 +731,7 @@ const Subscriptions = () => {
                                 commentMediaInfo?.url.slice(0, 30) + "(...)" :
                                 commentMediaInfo?.url
                                 }</a>&nbsp;({commentMediaInfo?.type === "iframe" ? "video" : commentMediaInfo?.type})
-                                {isThreadThumbnailClicked[index] ? (
+                                {isThreadThumbnailClicked[index] && commentMediaInfo.type !== "image" ? (
                                   <span>
                                     -[
                                       <span className='reply-link' 
@@ -1443,7 +1443,7 @@ const Subscriptions = () => {
                                   replyMediaInfo?.url.slice(0, 30) + "(...)" :
                                   replyMediaInfo?.url
                                   }</a>&nbsp;({replyMediaInfo?.type})
-                                  {replyMediaInfo?.type === "video" || "iframe" ? (
+                                  {replyMediaInfo?.type === "video" ||  replyMediaInfo?.type === "iframe" ? (
                                     isReplyThumbnailClicked[index] ? (
                                       <span>
                                         -[
@@ -1855,7 +1855,7 @@ const Subscriptions = () => {
                                         style={{cursor: "pointer"}}
                                         onError={(e) => e.target.src = fallbackImgUrl} />
                                     )}
-                                    {commentMediaInfo?.type === "video" || "iframe" ? (
+                                    {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                       isMobileThreadThumbnailClicked[index] ? (
                                         <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                           <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -1912,7 +1912,7 @@ const Subscriptions = () => {
                                             onError={(e) => e.target.src = fallbackImgUrl} 
                                           />
                                         )}
-                                        {commentMediaInfo?.type === "video" || "iframe" ? (
+                                        {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                           isMobileThreadThumbnailClicked[index] ? (
                                             <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                               <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
diff --git a/src/components/views/SubscriptionsCatalog.jsx b/src/components/views/SubscriptionsCatalog.jsx
index 6648ca5b..7770d150 100755
--- a/src/components/views/SubscriptionsCatalog.jsx
+++ b/src/components/views/SubscriptionsCatalog.jsx
@@ -340,52 +340,55 @@ const CatalogPost = ({post}) => {
 
   return (
     <div key={`thread-`} className="thread" 
-    onMouseOver={() => {setIsHoveringOnThread(thread.cid)}} 
     onMouseLeave={() => {handleMouseOnLeaveThread()}}>
       {isHoveringOnThread === thread.cid  ? 
-      <div ref={popupRef}
-      onMouseOver={() => handleMouseOnLeaveThread()}
-      style={{
-      opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
-      visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
-      left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
-        ? isMediaShowed
-          ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
-          : `calc(50% + ${textRect.width}px / 2 + 5px)`
-        : 'auto',
-      }}
-      className="thread_popup">
-        <p
-        style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
-          && !isEnoughSpaceOnRight
-          ?
-          {overflow:"visible",whiteSpace:"normal"}
-        : null
-        }
-        className="thread_popup_content">
-        <span className="thread_popup_title" >
-          {thread.title ? `${thread.title} ` : "Posted "}
-        </span>
-        by 
-        <span className="thread_popup_author"> 
-        {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
-        </span> 
-        {thread.timestamp ? getFormattedTime(thread.timestamp) : null}</p>
-        <div>
-        {thread.replyCount > 0 ?
-        <p className="thread_popup_lastReply">
-        Last reply by <span className="thread_popup_author"> Anonymous </span> 
-        {getFormattedTime(thread.lastReplyTimestamp)}</p>
-        : null}</div>
-        </div> : null }
+        <div ref={popupRef}
+        onMouseOver={() => handleMouseOnLeaveThread()}
+        style={{
+        opacity: isCalculationDone && isEnoughSpaceOnRight !== null ? 1 : 0,
+        visibility: isCalculationDone && isEnoughSpaceOnRight !== null ? 'visible' : 'hidden',
+        left: isCalculationDone && isEnoughSpaceOnRight !== null && isEnoughSpaceOnRight
+          ? isMediaShowed
+            ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+            : `calc(50% + ${textRect.width}px / 2 + 5px)`
+          : 'auto',
+        right: isCalculationDone && isEnoughSpaceOnRight !== null && !isEnoughSpaceOnRight
+          ? isMediaShowed
+            ? `calc(50% + ${imageRect.width}px / 2 + 5px)`
+            : `calc(50% + ${textRect.width}px / 2 + 5px)`
+          : 'auto',
+        }}
+        className="thread_popup">
+          <p
+          style={isEnoughSpaceOnLeft !== null && !isEnoughSpaceOnLeft
+            && !isEnoughSpaceOnRight
+            ?
+            {overflow:"visible",whiteSpace:"normal"}
+          : null
+          }
+          className="thread_popup_content">
+            <span className="thread_popup_title" >
+              {thread.title ? `${thread.title} ` : "Posted "}
+            </span>
+            by 
+            <span className="thread_popup_author"> 
+              {thread.author.displayName ?` ${thread.author.displayName} ` : " Anonymous "} 
+            </span> 
+            {thread.timestamp ? getFormattedTime(thread.timestamp) : null}
+          </p>
+          <div>
+            {thread.replyCount > 0 ?
+              <p className="thread_popup_lastReply">
+                Last reply by <span className="thread_popup_author"> Anonymous </span> 
+                {getFormattedTime(thread.lastReplyTimestamp)}
+              </p>
+            : null}
+          </div>
+        </div> 
+      : null }
       {commentMediaInfo?.url ? (
         <Link style={{all: "unset", cursor: "pointer"}} key={`link-`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} 
-        onClick={() => setSelectedThread(thread.cid)}>
+        onClick={() => setSelectedThread(thread.cid)} onMouseOver={() => {setIsHoveringOnThread(thread.cid)}}>
           {commentMediaInfo?.type === "webpage" ? (
             thread.thumbnailUrl ? (
               <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
@@ -398,6 +401,13 @@ const CatalogPost = ({post}) => {
               </span>
             ) : null
           ) : null}
+          {commentMediaInfo?.type === "iframe" && (thread.thumbnailUrl || commentMediaInfo.thumbnail) ? (
+            <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
+              <img className="card" ref={imageRef} key={`img-`}
+              src={commentMediaInfo.thumbnail} alt={commentMediaInfo.type}
+              onError={(e) => { e.target.src = fallbackImgUrl }}  />
+            </span>
+          ) : null}
           {commentMediaInfo?.type === "image" ? (
             <span className="file-thumb" style={{width: displayWidth, height: displayHeight}}>
               <img className="card" ref={imageRef} key={`img-`}
@@ -425,11 +435,7 @@ const CatalogPost = ({post}) => {
         </Link>
       ) : null}
       <div key={`ti-`} className="thread-icons" >
-      {(commentMediaInfo && (
-        commentMediaInfo.type === 'image' || 
-        commentMediaInfo.type === 'video' || 
-        (commentMediaInfo.type === 'webpage' && 
-        commentMediaInfo.thumbnail))) ? (                          
+      {isMediaShowed ? (                          
           <OfflineIndicator 
           address={thread.subplebbitAddress} 
           className="thread-icon offline-icon"
@@ -441,7 +447,7 @@ const CatalogPost = ({post}) => {
           tooltipPlace="top" />
       )}
       </div>
-      <BoardForm selectedStyle={selectedStyle} 
+      <BoardForm selectedStyle={selectedStyle} onMouseOver={() => handleMouseOnLeaveThread()}
       style={{ all: "unset"}}>
         <div key={`meta-`} className="meta" title="(R)eplies / (L)ink Replies" >
           R:&nbsp;<b key={`b-`}>{thread.replyCount}</b>
@@ -594,7 +600,7 @@ const CatalogPost = ({post}) => {
       onClick={() => setSelectedThread(thread.cid)}>
         <div key={`t-`} className="teaser" style={{maxHeight: `calc(320px - ${displayHeight})`}}
         ref={(el) => (threadRefs.current[thread.cid] = el)}>
-        <span key={`teaser-width${thread.cid}`} ref={textRef}>
+        <span key={`teaser-width${thread.cid}`} ref={textRef} onMouseOver={() => {setIsHoveringOnThread(thread.cid)}}>
           <b key={`b2-`}>{thread.title ? `${thread.title}` : null}</b>
           {thread.content ? `: ${thread.content}` : null}
         </span>
diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx
index f8ef95f6..719dd8c9 100755
--- a/src/components/views/Thread.jsx
+++ b/src/components/views/Thread.jsx
@@ -1534,7 +1534,7 @@ const Thread = () => {
                                 replyMediaInfo?.url.slice(0, 30) + "(...)" :
                                 replyMediaInfo?.url
                                 }</a>&nbsp;({replyMediaInfo?.type})
-                                {replyMediaInfo?.type === "video" || "iframe" ? (
+                                {replyMediaInfo?.type === "video" ||  replyMediaInfo?.type === "iframe" ? (
                                     isReplyThumbnailClicked[index] ? (
                                       <span>
                                         -[
@@ -1819,7 +1819,7 @@ const Thread = () => {
                                     style={{cursor: "pointer"}}
                                     onError={(e) => e.target.src = fallbackImgUrl} />
                                 )}
-                                {commentMediaInfo?.type === "video" || "iframe" ? (
+                                {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                   isMobileThreadThumbnailClicked[index] ? (
                                     <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                       <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
@@ -1876,7 +1876,7 @@ const Thread = () => {
                                       onError={(e) => e.target.src = fallbackImgUrl} 
                                     />
                                   )}
-                                  {commentMediaInfo?.type === "video" || "iframe" ? (
+                                  {commentMediaInfo?.type === "video" || commentMediaInfo?.type ===  "iframe" ? (
                                     isMobileThreadThumbnailClicked[index] ? (
                                       <div style={{textAlign: "center", marginTop: "15px", marginBottom: "15px"}}>
                                         <span className='button-mobile' style={{float: "none", cursor: "pointer"}}
diff --git a/src/utils/getCommentMediaInfo.js b/src/utils/getCommentMediaInfo.js
index de1d367a..009521fc 100644
--- a/src/utils/getCommentMediaInfo.js
+++ b/src/utils/getCommentMediaInfo.js
@@ -14,6 +14,13 @@ const getCommentMediaInfo = (comment) => {
       if (['youtube.com', 'www.youtube.com', 'youtu.be'].includes(host)) {
         const videoId = host === 'youtu.be' ? url.pathname.slice(1) : url.searchParams.get('v');
         embedUrl = `https://www.youtube-nocookie.com/embed/${videoId}`;
+        const thumbnailUrl = `https://img.youtube.com/vi/${videoId}/sddefault.jpg`;
+        return {
+          url: comment.link,
+          embedUrl,
+          type: 'iframe',
+          thumbnail: comment.thumbnailUrl || thumbnailUrl,
+        };
       } else if (host.includes('odysee.com')) {
         const pathComponents = url.pathname.split('/');
         const channelAndId = pathComponents[1];