---
import Layout from "../layouts/Layout.astro";

// plans:
// - what is coworking
// - how the overlays benefit
// - why did I open source
---

<Layout title="About">
	<div class="h-full flex flex-col text-white">
		<div class="w-full h-full flex flex-col justify-center items-center">
			<div
				class="w-4/5 lg:w-2/3 flex flex-col justify-center items-center text-center"
			>
				<img
					src="/assets/circle_logo.webp"
					alt="ryan logo"
					width="200"
					class="mb-10"
				/>
				<h1 class="text-5xl font-bold">About</h1>
				<p class="mt-5 text-lg mb-5">
					Hello, I'm <span class="font-bold">Ryan</span>, a
					computer science student based in Malaysia. The
					objective of this website is to offer valuable
					resources to aspiring streamers, helping them enhance
					their streaming experience!
				</p>
				<p>
					If you want to learn more about me, check out my <a
						href="https://ryanpython.me"
						target="_blank"
						class="underline underline-offset-2 transition-colors duration-500 hover:text-blue-500"
						>website</a
					>!
				</p>
			</div>
		</div>
	</div>
	<div class="w-full h-full flex flex-col text-white">
		<div
			class="w-full h-1/3 bg-gray-900 mt-12 flex flex-col justify-center items-center text-center"
		>
			<h2 class="font-bold text-2xl mb-5">
				What are Coworking & Study streams?
			</h2>
			<p class="w-4/5 lg:w-1/2">
				Coworking and study streams are a type of stream where
				people work or study together. It's a great way to stay
				motivated and productive, especially if you're working!
			</p>
		</div>
		<div
			class="w-full h-1/3 flex flex-col justify-center items-center text-center"
		>
			<h2 class="font-bold text-2xl mb-5">
				How can this guide benefit me?
			</h2>
			<p class="w-4/5 lg:w-1/2">
				This guide has been created to help out new (and old)
				coworking streamers! It contains a bunch of resources that
				you can use to enhance your stream, such as interactive
				overlays and useful bots.
			</p>
		</div>
		<div
			class="w-full h-1/3 bg-gray-900 flex flex-col justify-center items-center text-center"
		>
			<h2 class="font-bold text-2xl mb-5">
				Why should I stream myself working?
			</h2>
			<p class="w-4/5 lg:w-1/2">
				Streaming yourself working is a great way to stay
				accountable and productive. It's also a great way to grow
				your following and meet new people!
			</p>
		</div>
	</div>
</Layout>