diff --git a/src/components/ChannelPopup.svelte b/src/components/ChannelPopup.svelte
index 218b8741b..f6263590c 100644
--- a/src/components/ChannelPopup.svelte
+++ b/src/components/ChannelPopup.svelte
@@ -19,12 +19,12 @@
 </script>
 
 <div
-  class="relative px-2 py-24 flex justify-center"
+  class="relative px-2 pt-20 pb-24 flex justify-center"
   role="presentation"
   on:keypress
   on:click|self={close}
 >
-  <div class="relative bg-white rounded-md shadow dark:bg-gray-800 w-full max-w-[820px]">
+  <div class="relative bg-white rounded-lg shadow dark:bg-gray-800 w-full max-w-[820px]">
     <div
       class="flex justify-between items-center py-3 pl-5 pr-3 md:pr-4 rounded-t border-b dark:border-gray-700"
     >
@@ -48,8 +48,8 @@
         <CloseButton on:click={close} />
       </div>
     </div>
-    <div class="overflow-y-auto overflow-x-scroll w-full scrollbar-hide">
-      <div class="inline-table p-12 pt-10">
+    <div class="overflow-y-auto overflow-x-scroll max-w-full scrollbar-hide">
+      <div class="inline-table px-5 py-5 sm:py-10 sm:px-12">
         <HTMLPreview data={channel} {close} />
       </div>
     </div>