import MainTemplate from "@/templates/MainTemplate"
import RecentEdits from "@/containers/RecentEdits"
import { Button } from "@/components/ui/button"
import { Link } from "react-router"
export default function Home() {
	return (
		<>
			<MainTemplate pageTitle="Home">
				<div className="flex-1 flex flex-col overflow-auto">
					<div className="@container/main flex flex-col mb-4">
						<div className="p-4 lg:p-6 flex flex-1">
							<div className="border w-full">
								<div className="border-b py-2 px-4 lg:px-6 bg-sidebar">
									<h2 className="scroll-m-20 font-semibold">Welcome</h2>
								</div>
								<div className="p-4 lg:p-6">
									<p className="leading-7 [&:not(:first-child)]:mt-6 font-normal mb-4">
										Eólas is my technical knowledge management system, or "second-brain",
										comprising notes from the study of software engineering and computer
										science.
									</p>
									<Button size="sm" variant="secondary" className="rounded-none" asChild>
										<Link to="/about">Learn more</Link>
									</Button>
								</div>
							</div>
						</div>

						<div className="px-4 lg:px-6 flex-1 flex">
							<RecentEdits />
						</div>
					</div>
				</div>
			</MainTemplate>
		</>
	)
}