Enhance Indexer page with sorting functionality and size/age parsing; update News and Settings pages for improved layout and responsiveness; implement subscription tiers and donation options on Upgrade page.

app/news/page.tsx

@@ -62,9 +62,9 @@ export default function NewsPage() {
   // };
 
   return (
-    <div className="container mx-auto p-4 py-8 md:py-12 space-y-8">
-      <div className="flex justify-between items-center mb-6">
-        <h1 className="text-3xl font-bold tracking-tight">Site News & Announcements</h1>
+    <div className="container mx-auto p-4 py-8 md:py-12 lg:py-16 xl:max-w-7xl space-y-8 lg:space-y-10">
+      <div className="flex justify-between items-center mb-6 lg:mb-8">
+        <h1 className="text-3xl lg:text-4xl font-bold tracking-tight">Site News & Announcements</h1>
         <div className="space-x-2">
           <Link href="/upgrade" passHref>
             <Button variant="ghost">Upgrade</Button>
@@ -78,11 +78,11 @@ export default function NewsPage() {
         </div>
       </div>
 
-      <div className="space-y-6">
+      <div className="space-y-6 lg:space-y-8">
         {mockNewsData.map((article) => (
           <Card key={article.id} className="shadow-md hover:shadow-lg transition-shadow duration-200">
             <CardHeader>
-              <CardTitle>{article.title}</CardTitle>
+              <CardTitle className="text-xl lg:text-2xl">{article.title}</CardTitle>
               <CardDescription>
                 Posted by {article.author} on {article.date}
               </CardDescription>