Fixes: buttons overflowing code100x#793

Author: PatelYash7

src/components/VideoContentChapters.tsx

@@ -34,7 +34,7 @@ const VideoContentChapters = ({
   }, [player]);
 
   return (
-    <div className="w-full rounded-md border text-sm shadow-md lg:w-1/3">
+    <div className="w-full rounded-md border text-sm shadow-md semi:w-1/3">
       <div className="flex items-center justify-between bg-[#F5F5F5] p-2 py-3 dark:bg-[#212020]">
         <span>Chapters</span>
         <X onClick={onCancel} className="cursor-pointer" />

src/components/admin/ContentRendererClient.tsx

@@ -88,7 +88,7 @@ export const ContentRendererClient = ({
   };
 
   return (
-    <div className="flex flex-col items-start gap-2 lg:flex-row">
+    <div className="flex flex-col items-start gap-2 semi:flex-row">
       <div className="w-full flex-1">
         <VideoPlayerSegment
           setQuality={setQuality}

tailwind.config.js

@@ -15,6 +15,9 @@ module.exports = {
       padding: '2rem',
     },
     extend: {
+      screens: {
+        semi: '1140px'
+      },
       colors: {
         border: 'hsl(var(--border))',
         input: 'hsl(var(--input))',