Radiquum/radiquum.github.io
1
0
Fork 0
mirror of https://github.com/Radiquum/radiquum.github.io.git synced 2025-09-08 15:33:54 +05:00
Code Issues Projects Releases Packages Wiki Activity

feat: add tablet styles (768-1023px)

Browse source
This commit is contained in:
Kentai Radiquum 2025-07-23 11:52:12 +05:00
parent 5981db3626
commit e63a3126ae
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
10 changed files with 67 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

37
app/Section/Characters.tsx
View file

@ -21,8 +21,8 @@ const links = [
export const Characters = () => {
return (
<Section>
<div className="flex flex-col gap-2">
<h2 className="text-4xl">Characters</h2>
<div className="flex flex-col gap-2 mt-2 md:flex-row md:justify-between md:items-center">
<h2 className="text-4xl md:text-5xl">Characters</h2>
<div className="flex items-center gap-4">
{links.map((item) => (
<Link href={item.url} key={`photos.link.${item.text}`}>
@ -35,7 +35,7 @@ export const Characters = () => {
))}
</div>
</div>
<div className="flex flex-col gap-4 mt-2">
<div className="flex flex-col gap-4 mt-2 md:hidden">
<CharacterImage
name="Kentai"
species="Red Panda"
@ -49,6 +49,37 @@ export const Characters = () => {
image="/images/protogen.png"
/>
</div>
<div className="flex-col gap-8 mt-2 hidden md:flex">
<div className="flex gap-4">
<CharacterImage
name="Kentai"
species="Red Panda"
gender="Male"
image="/images/red_panda.png"
/>
<div className="flex flex-col">
<p className="text-5xl">Kentai</p>
<p className="mt-2 text-3xl">Red Panda</p>
<p className="text-3xl">Male</p>
<div className="flex-1"></div>
<button className="rounded-full bg-[#491f1f] px-4 py-2 text-3xl">
about
</button>
</div>
</div>
<div className="flex gap-4">
<CharacterImage
name=""
species="Protogen"
gender="Male"
image="/images/protogen.png"
/>
<div className="flex flex-col">
<p className="mt-2 text-3xl">Protogen</p>
<p className="text-3xl">Male</p>
</div>
</div>
</div>
</Section>
);
};

4
app/Section/Contacts.tsx
View file

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

16
app/Section/Intro.tsx
View file

@ -2,15 +2,19 @@ export const Intro = () => {
return (
<div className="flex gap-4 flex-col">
<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">
<h1 className="text-[#FFB1CD] tracking-tight font-bold text-8xl md:text-[128px]">
Radiquum
</h1>
</div>
<div className="w-full flex items-center justify-center py-24 bg-[#161213] rounded-bl-[128px] rounded-tr-[128px]">
<div className="flex flex-col">
<p className="text-[#C8E8FE] font-medium text-4xl">Photographer</p>
<p className="text-[#FF8686] font-medium text-4xl">Developer</p>
<p className="text-[#FF851A] font-medium text-4xl">
<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">
Photographer
</p>
<p className="text-[#FF8686] font-medium text-4xl md:text-5xl">
Developer
</p>
<p className="text-[#FF851A] font-medium text-4xl md:text-5xl">
Self-Hosting admirer
</p>
</div>

4
app/Section/Photos.tsx
View file

@ -40,8 +40,8 @@ export const Photos = () => {
return (
<div className="flex flex-col gap-4">
<Section>
<div className="flex flex-col gap-2">
<h2 className="text-4xl">Photos</h2>
<div className="flex flex-col gap-2 md:flex-row md:justify-between md:items-center">
<h2 className="text-4xl md:text-5xl">Photos</h2>
<div className="flex items-center gap-4">
{links.map((item) => (
<Link href={item.url} key={`photos.link.${item.text}`}>

4
app/Section/Projects.tsx
View file

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

4
app/Section/Socials.tsx
View file

@ -50,8 +50,8 @@ const links = [
export const Socials = () => {
return (
<Section>
<h2 className="text-4xl">Socials</h2>
<div className="grid grid-cols-2 gap-x-12 gap-y-2">
<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">
{links.map((item) => (
<Link href={item.url} key={`socials.link.${item.text}`}>
<IconWithText icon={item.icon} text={item.text} desc={item.desc} />