remove container for tailwind v4

Author: codercatdev

app/(main)/(auth)/login/page.tsx

@@ -11,7 +11,7 @@ import { Suspense } from "react";
 
 export default function LoginForm() {
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			<div className="w-full flex justify-center p-8 sm:p-20 md:p-32">
 				<Card className="w-full max-w-sm">
 					<CardHeader>

app/(main)/(author)/author/[slug]/page.tsx

@@ -62,7 +62,7 @@ export default async function AuthorPage({ params }: { params: Params }) {
 	}
 
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			<BreadcrumbLinks
 				links={[{ title: "Authors", href: "/authors/page/1" }]}
 			/>

app/(main)/(author)/authors/page/[num]/page.tsx

@@ -26,7 +26,7 @@ export default async function Page({ params }: { params: Params }) {
 	const limit = offset + LIMIT;
 
 	return (
-		<div className="container px-5 mx-auto mb-32">
+		<div className=" px-5 mx-auto mb-32">
 			<MoreContent type="author" limit={limit} offset={offset} showHeader />
 			<PaginateList
 				base="authors"

app/(main)/(course)/course/[courseSlug]/lesson/[lessonSlug]/page.tsx

@@ -91,7 +91,7 @@ export default async function LessonPage({ params }: { params: Params }) {
 	return (
 		<>
 			{lesson?._id && course?._id && (
-				<div className="container px-5 mx-auto grid gap-2">
+				<div className=" px-5 mx-auto grid gap-2">
 					<Suspense fallback={<>Loading Lesson Panel...</>}>
 						<LessonPanelClientOnly lesson={lesson} course={course} />
 					</Suspense>

app/(main)/(course)/course/[courseSlug]/page.tsx

@@ -68,7 +68,7 @@ export default async function CoursePage({ params }: { params: Params }) {
 	}
 
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			<ShowPro />
 			<BreadcrumbLinks
 				links={[{ title: "Courses", href: "/courses/page/1" }]}

app/(main)/(course)/courses/page.tsx

@@ -70,7 +70,7 @@ export default async function Page() {
 	).map((res) => res.data) as [CoursesQueryResult];
 
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			{heroPost ? (
 				<HeroCourse
 					title={heroPost.title}

app/(main)/(course)/courses/page/[num]/page.tsx

@@ -27,7 +27,7 @@ export default async function Page({ params }: { params: Params }) {
 	const limit = offset + LIMIT;
 
 	return (
-		<div className="container px-5 mx-auto mb-32">
+		<div className=" px-5 mx-auto mb-32">
 			<MoreContent type="course" limit={limit} offset={offset} showHeader />
 			<PaginateList
 				base="podcasts"

app/(main)/(guest)/guest/[slug]/page.tsx

@@ -62,7 +62,7 @@ export default async function GuestPage({ params }: { params: Params }) {
 	}
 
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			<BreadcrumbLinks links={[{ title: "Guests", href: "/guests/page/1" }]} />
 			<div className="w-full flex flex-col gap-4 md:gap-8">
 				<div className="flex gap-2 md:gap-8">

app/(main)/(guest)/guests/page/[num]/page.tsx

@@ -27,7 +27,7 @@ export default async function Page({ params }: { params: Params }) {
 	const limit = offset + LIMIT;
 
 	return (
-		<div className="container px-5 mx-auto mb-32">
+		<div className=" px-5 mx-auto mb-32">
 			<MoreContent type="guest" limit={limit} offset={offset} showHeader />
 			<PaginateList
 				base="guests"

app/(main)/(podcast)/podcast/[slug]/page.tsx

@@ -73,7 +73,7 @@ export default async function PodcastPage({ params }: { params: Params }) {
 	const src = podcast?.spotify?.enclosures?.at(0)?.url;
 
 	return (
-		<div className="container px-5 mx-auto">
+		<div className=" px-5 mx-auto">
 			<BreadcrumbLinks
 				links={[{ title: "Podcasts", href: "/podcasts/page/1" }]}
 			/>