This commit introduces several improvements to the blog homepage: - Adds a search icon and link to the Russian version of the blog - Reduces the font size of the main title to make it more visually balanced - Updates the blog description to focus on posts about science - Adjusts the overall layout and spacing for a more polished appearance These changes aim to enhance the user experience and better communicate the blog's content and focus.
83 lines
3.2 KiB
TypeScript
83 lines
3.2 KiB
TypeScript
import searchPic from '../public/search.svg';
|
||
|
||
|
||
import Image from "next/image";
|
||
import Link from "next/link";
|
||
import AnimatedLink from '../components/animatedLink';
|
||
import BlogArea from "../components/blogpost";
|
||
import HeaderToolbar from "../components/header/toolbar";
|
||
|
||
// Mock data for blog posts
|
||
const blogposts = [
|
||
{
|
||
label: 'Retro Futurism: A Journey Through Time',
|
||
body: 'Explore the fascinating world of retro futurism and its impact on modern science and culture.',
|
||
publish: '2023-10-01',
|
||
get_absolute_url: '/blog/retro-futurism',
|
||
},
|
||
{
|
||
label: 'The Science Behind Video Games',
|
||
body: 'Discover how video games are pushing the boundaries of technology and human interaction.',
|
||
publish: '2023-09-25',
|
||
get_absolute_url: '/blog/science-video-games',
|
||
},
|
||
];
|
||
|
||
export default function Home() {
|
||
return (
|
||
<div className="text-xl mx-48">
|
||
<header className="flex flex-col">
|
||
<div className="flex flex-row mt-12 mb-22">
|
||
<ul className="w-full flex flex-row justify-between items-baseline list-none">
|
||
<li className="text-4xl">
|
||
<AnimatedLink href="https://blog.aderk.tech/en">
|
||
aderk.tech
|
||
</AnimatedLink>
|
||
</li>
|
||
|
||
<li className="text-6xl flex items-center justify-center filter brightness-0 invert">
|
||
<Link href="#">
|
||
<Image
|
||
src={searchPic}
|
||
alt="search"
|
||
width={32}
|
||
height={32}
|
||
/>
|
||
</Link>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div className="text-2xl mb-20">
|
||
<p>
|
||
Hello. I am is a programmer, hacker, gamer and otaku. Love comics, coding, read books. There I am posting articles about computer science and another staff, that’s im like.
|
||
</p>
|
||
</div>
|
||
<HeaderToolbar />
|
||
</header>
|
||
|
||
<main>
|
||
<BlogArea blogposts={blogposts} />
|
||
</main>
|
||
|
||
<footer className="border-t border-white pt-4 flex flex-row justify-around text-2xl">
|
||
<ul className="list-none m-4">
|
||
<li className="text-3xl"><h3>Socials</h3></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="https://www.instagram.com/aderkitty/">Instagram</AnimatedLink></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="https://mastodon.social/@aderkonstantin">Mastodon</AnimatedLink></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="https://github.com/AderKonstantin">GitHub</AnimatedLink></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="https://steamcommunity.com/yourprofile">Steam</AnimatedLink></li>
|
||
</ul>
|
||
<ul className="list-none m-4">
|
||
<li className="text-3xl"><h3>Games</h3></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="#">Joe The Rabbit</AnimatedLink></li>
|
||
</ul>
|
||
<ul className="list-none m-4">
|
||
<li className="text-3xl"><h3>Other Projects</h3></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="#">Ader Berry Bot (Telegram)</AnimatedLink></li>
|
||
<li className="p-3 text-xl"><AnimatedLink href="#">Store</AnimatedLink></li>
|
||
</ul>
|
||
</footer>
|
||
</div>
|
||
);
|
||
}
|