feat: add images for character section

This commit is contained in:
Kentai Radiquum 2025-07-23 12:56:33 +05:00
parent e63a3126ae
commit 72bad7b8ea
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
13 changed files with 45 additions and 17 deletions

View file

@ -49,7 +49,7 @@ export const Characters = () => {
image="/images/protogen.png"
/>
</div>
<div className="flex-col gap-8 mt-2 hidden md:flex">
<div className="flex-col gap-8 mt-2 hidden md:flex relative">
<div className="flex gap-4">
<CharacterImage
name="Kentai"
@ -66,18 +66,46 @@ export const Characters = () => {
about
</button>
</div>
<div className="ml-21 hidden xl:block">
<img
className="rounded-4xl w-[372px] h-[288px] object-cover"
src="/images/red_panda2.png"
alt=""
/>
</div>
<div className="hidden xl:block absolute -right-72">
<img
className="rounded-4xl w-[372px] h-[288px] object-cover"
src="/images/red_panda3.png"
alt=""
/>
</div>
</div>
<div className="flex gap-4">
<div className="flex gap-4 xl:flex-row-reverse">
<CharacterImage
name=""
species="Protogen"
gender="Male"
image="/images/protogen.png"
/>
<div className="flex flex-col">
<div className="flex flex-col xl:text-right">
<p className="mt-2 text-3xl">Protogen</p>
<p className="text-3xl">Male</p>
</div>
<div className="mr-16 hidden xl:block">
<img
className="rounded-4xl w-[372px] h-[288px] object-cover"
src="/images/protogen2.png"
alt=""
/>
</div>
<div className="ml-10 hidden xl:block absolute -left-72">
<img
className="rounded-4xl w-[372px] h-[288px] object-cover"
src="/images/protogen3.png"
alt=""
/>
</div>
</div>
</div>
</Section>

View file

@ -33,7 +33,7 @@ export const Contacts = () => {
return (
<Section>
<h2 className="text-4xl md:text-5xl">Contacts</h2>
<div className="grid grid-cols-2 md:grid-cols-3 gap-4">
<div className="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-4">
{links.map((item) => {
if (item.url) {
return (

View file

@ -1,20 +1,20 @@
export const Intro = () => {
return (
<div className="flex gap-4 flex-col">
<div className="flex gap-4 flex-col xl:gap-8">
<div className="w-full flex items-center justify-center py-24 bg-[#101316] rounded-tl-[256px] rounded-br-[256px]">
<h1 className="text-[#FFB1CD] tracking-tight font-bold text-8xl md:text-[128px]">
<h1 className="text-[#FFB1CD] tracking-tight font-bold text-8xl md:text-[128px] xl:text-[200px] 2xl:text-[232px]">
Radiquum
</h1>
</div>
<div className="w-full flex items-center justify-center py-24 bg-[#161213] rounded-bl-[128px] rounded-tr-[128px] md:rounded-bl-[256px] md:rounded-tr-[256px]">
<div className="flex flex-col md:flex-row md:gap-8 md:flex-wrap md:justify-center">
<p className="text-[#C8E8FE] font-medium text-4xl md:text-5xl">
<div className="flex flex-col md:flex-row md:gap-8 md:flex-wrap md:justify-center 2xl:gap-16">
<p className="text-[#C8E8FE] font-medium text-4xl md:text-5xl xl:text-8xl 2xl:text-[128px]">
Photographer
</p>
<p className="text-[#FF8686] font-medium text-4xl md:text-5xl">
<p className="text-[#FF8686] font-medium text-4xl md:text-5xl xl:text-8xl 2xl:text-[128px]">
Developer
</p>
<p className="text-[#FF851A] font-medium text-4xl md:text-5xl">
<p className="text-[#FF851A] font-medium text-4xl md:text-5xl xl:text-8xl 2xl:text-[128px]">
Self-Hosting admirer
</p>
</div>

View file

@ -11,13 +11,13 @@ const links = [
icon: "/icons/ic_baseline-telegram.svg",
text: "Telegram",
desc: "@photowah",
url: "https://x.com/radiquum",
url: "https://t.me/photowah",
},
{
icon: "/icons/simple-icons_immich.svg",
text: "Gallery",
desc: "wah.su/photos",
url: "https://bsky.app/profile/@radiquum.wah.su",
url: "https://wah.su/photos",
},
];

View file

@ -51,7 +51,7 @@ export const Projects = () => {
return (
<Section>
<h2 className="text-4xl md:text-5xl">Projects</h2>
<div className="grid grid-cols-1 gap-2 md:grid-cols-2">
<div className="grid grid-cols-1 gap-2 md:grid-cols-2 xl:grid-cols-3">
{links.map((item) => (
<Link href={item.url} key={`socials.link.${item.text}`}>
<IconWithText icon={item.icon} text={item.text} desc={item.desc} />

View file

@ -51,7 +51,7 @@ export const Socials = () => {
return (
<Section>
<h2 className="text-4xl md:text-5xl">Socials</h2>
<div className="grid grid-cols-2 md:grid-cols-3 gap-x-12 gap-y-2">
<div className="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-x-12 gap-y-2">
{links.map((item) => (
<Link href={item.url} key={`socials.link.${item.text}`}>
<IconWithText icon={item.icon} text={item.text} desc={item.desc} />