Simplify examples

Author: aaronshekey

app/routes/components.input.tsx

@@ -26,58 +26,9 @@ export default function Page() {
 			<h1 className="text-5xl font-medium">Input</h1>
 			<p className="mt-4 text-xl text-gray-600">Fundamental component for inputs.</p>
 
-			<Example className="mt-4 flex-col gap-6">
-				<div className="flex gap-2">
-					<Select>
-						<SelectTrigger className="w-[180px]">
-							<SelectValue placeholder="Select a fruit" />
-						</SelectTrigger>
-						<SelectContent>
-							<SelectGroup>
-								<SelectLabel>Fruits</SelectLabel>
-								<SelectItem value="apple">Apple</SelectItem>
-							</SelectGroup>
-						</SelectContent>
-					</Select>
-					<Input placeholder="Enter a username" />
-					<Button priority="muted" appearance="outline" type="button">
-						Submit
-					</Button>
-				</div>
-				<div className="flex gap-2">
-					<Select>
-						<SelectTrigger className="w-[180px]">
-							<SelectValue placeholder="Select" />
-						</SelectTrigger>
-						<SelectContent>
-							<SelectGroup>
-								<SelectLabel>Fruits</SelectLabel>
-								<SelectItem value="apple">Apple</SelectItem>
-							</SelectGroup>
-						</SelectContent>
-					</Select>
-					<Input placeholder="Enter a username" state="danger" />
-					<Button priority="danger" appearance="outline" type="button">
-						Submit
-					</Button>
-				</div>
-				<div className="flex gap-2">
-					<Select disabled>
-						<SelectTrigger className="w-[180px]">
-							<SelectValue placeholder="Select" />
-						</SelectTrigger>
-						<SelectContent>
-							<SelectGroup>
-								<SelectLabel>Fruits</SelectLabel>
-								<SelectItem value="apple">Apple</SelectItem>
-							</SelectGroup>
-						</SelectContent>
-					</Select>
-					<Input placeholder="Enter a username" disabled />
-					<Button priority="muted" appearance="outline" type="button" disabled>
-						Submit
-					</Button>
-				</div>
+			<Example className="mt-4 flex-col gap-4">
+				<Input className="max-w-64" placeholder="Enter a username" />
+				<Input className="max-w-64" placeholder="Enter a username" state="danger" />
 			</Example>
 			<CodeBlock className="rounded-b-lg rounded-t-none">
 				<CodeBlockBody>

app/routes/components.select.tsx

@@ -27,7 +27,7 @@ export default function Page() {
 
 			<Example className="mt-4">
 				<Select>
-					<SelectTrigger className="w-[180px]">
+					<SelectTrigger className="max-w-64">
 						<SelectValue placeholder="Select a fruit" />
 					</SelectTrigger>
 					<SelectContent>