mirror of
https://github.com/Radiquum/radiquum.github.io.git
synced 2025-09-07 15:03:54 +05:00
feat: add hover effect on links
This commit is contained in:
parent
72bad7b8ea
commit
814b43498b
5 changed files with 6 additions and 6 deletions
|
@ -23,9 +23,9 @@ export const Characters = () => {
|
|||
<Section>
|
||||
<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">
|
||||
<div className="flex items-center gap-4 xl:gap-8">
|
||||
{links.map((item) => (
|
||||
<Link href={item.url} key={`photos.link.${item.text}`}>
|
||||
<Link href={item.url} key={`characters.link.${item.text}`}>
|
||||
<IconWithText
|
||||
icon={item.icon}
|
||||
text={item.text}
|
||||
|
|
|
@ -37,7 +37,7 @@ export const Contacts = () => {
|
|||
{links.map((item) => {
|
||||
if (item.url) {
|
||||
return (
|
||||
<Link href={item.url} key={`socials.link.${item.text}`}>
|
||||
<Link href={item.url} key={`contacts.link.${item.text}`}>
|
||||
<IconWithText
|
||||
icon={item.icon}
|
||||
text={item.text}
|
||||
|
|
|
@ -42,7 +42,7 @@ export const Photos = () => {
|
|||
<Section>
|
||||
<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">
|
||||
<div className="flex items-center gap-4 xl:gap-8">
|
||||
{links.map((item) => (
|
||||
<Link href={item.url} key={`photos.link.${item.text}`}>
|
||||
<IconWithText
|
||||
|
|
|
@ -53,7 +53,7 @@ export const Projects = () => {
|
|||
<h2 className="text-4xl md:text-5xl">Projects</h2>
|
||||
<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}`}>
|
||||
<Link href={item.url} key={`projects.link.${item.text}`}>
|
||||
<IconWithText icon={item.icon} text={item.text} desc={item.desc} />
|
||||
</Link>
|
||||
))}
|
||||
|
|
|
@ -6,7 +6,7 @@ type IconWithTextProps = {
|
|||
|
||||
export const IconWithText = ({ icon, text, desc }: IconWithTextProps) => {
|
||||
return (
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="flex items-center gap-1 hover:text-[#c8e8fe] transition-colors">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={icon} alt={""} />
|
||||
<div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue