feat: Implement admin article creation and editing pages, new global styles, and a UI switch component.

Author: Llewellyn500

app/admin/articles/[id]/page.tsx

@@ -375,10 +375,9 @@ export default function EditArticlePage() {
               <h3 className="font-semibold text-white/90">Publishing</h3>
               <div className="flex items-center space-x-2">
                 <Switch
-                  id="publish-status"
                   checked={isPublished}
                   onCheckedChange={setIsPublished}
-                  className="data-[state=checked]:bg-[#8a2be2] data-[state=unchecked]:bg-[#333333] border border-white/20"
+                  className="data-[state=checked]:bg-[#8a2be2] data-[state=unchecked]:bg-zinc-600 border border-white/20"
                 />
                 <Label
                   htmlFor="publish-status"

app/admin/articles/new/page.tsx

@@ -549,7 +549,7 @@ export default function NewArticlePage() {
                   id="publish-status"
                   checked={isPublished}
                   onCheckedChange={setIsPublished}
-                  className="data-[state=checked]:bg-[#8a2be2] data-[state=unchecked]:bg-[#333333] border border-white/20"
+                  className="data-[state=checked]:bg-[#8a2be2] data-[state=unchecked]:bg-zinc-600 border border-white/20"
                 />
                 <label
                   htmlFor="publish-status"

app/globals.css

@@ -219,16 +219,14 @@ select:-webkit-autofill {
   font-weight: 600;
   font-size: clamp(2rem, 1.8rem + 1vw, 3rem);
   margin-bottom: 0.5em !important;
-  border-bottom: 1px solid #ffffff5b !important;
-  padding-bottom: 0.1em !important;
+  margin-bottom: 0.5em !important;
 }
 
 .markdown-body h2 {
   font-size: clamp(1.5rem, 1.3rem + 0.8vw, 2.25rem);
   font-weight: 600;
   margin-bottom: 0.5em !important;
-  border-bottom: 1px solid #ffffff5b !important;
-  padding-bottom: 0.3em !important;
+  margin-bottom: 0.5em !important;
 }
 
 .markdown-body h3 {

components/ui/switch.tsx

@@ -1,9 +1,9 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SwitchPrimitives from "@radix-ui/react-switch"
+import * as React from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils";
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
@@ -19,11 +19,11 @@ const Switch = React.forwardRef<
   >
     <SwitchPrimitives.Thumb
       className={cn(
-        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        "pointer-events-none block h-5 w-5 rounded-full bg-white shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
       )}
     />
   </SwitchPrimitives.Root>
-))
-Switch.displayName = SwitchPrimitives.Root.displayName
+));
+Switch.displayName = SwitchPrimitives.Root.displayName;
 
-export { Switch }
+export { Switch };