mirror of
https://github.com/DefectingCat/DefectingCat.github.io
synced 2025-07-16 01:01:38 +00:00
Add google fonts
This commit is contained in:
4
.vscode/settings.json
vendored
Normal file
4
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"typescript.tsdk": "node_modules/.pnpm/typescript@5.0.2/node_modules/typescript/lib",
|
||||||
|
"typescript.enablePromptUseWorkspaceTsdk": true
|
||||||
|
}
|
31
app/fonts.ts
Normal file
31
app/fonts.ts
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
import {
|
||||||
|
Aleo,
|
||||||
|
Aref_Ruqaa,
|
||||||
|
Barlow,
|
||||||
|
JetBrains_Mono,
|
||||||
|
Poppins,
|
||||||
|
} from 'next/font/google';
|
||||||
|
|
||||||
|
export const aleo = Aleo({
|
||||||
|
weight: ['300', '400', '700'],
|
||||||
|
display: 'swap',
|
||||||
|
});
|
||||||
|
|
||||||
|
export const aref_ruqaa = Aref_Ruqaa({
|
||||||
|
weight: ['400', '700'],
|
||||||
|
display: 'swap',
|
||||||
|
});
|
||||||
|
|
||||||
|
export const barlow = Barlow({
|
||||||
|
weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
|
||||||
|
style: 'italic',
|
||||||
|
display: 'swap',
|
||||||
|
});
|
||||||
|
|
||||||
|
export const jetbrains_mono = JetBrains_Mono({
|
||||||
|
display: 'swap',
|
||||||
|
});
|
||||||
|
|
||||||
|
export const poppins = Poppins({
|
||||||
|
weight: ['300', '400', '700', '100', '200', '500', '600', '800', '900'],
|
||||||
|
});
|
@ -1,62 +0,0 @@
|
|||||||
import clsx from 'clsx';
|
|
||||||
import { Project } from 'pages/projects';
|
|
||||||
import { Children, cloneElement, isValidElement, ReactElement } from 'react';
|
|
||||||
import { VscGithubInverted } from 'react-icons/vsc';
|
|
||||||
|
|
||||||
type ProjectCardProps = {
|
|
||||||
project: Project;
|
|
||||||
icon?: ReactElement<{ className?: string }>;
|
|
||||||
};
|
|
||||||
|
|
||||||
const ProjectCard = ({ project, icon }: ProjectCardProps) => {
|
|
||||||
const Icon = Children.map(icon, (child) => {
|
|
||||||
if (!isValidElement(child)) return child;
|
|
||||||
return cloneElement(child, {
|
|
||||||
className: 'w-8 h-8',
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={clsx(
|
|
||||||
'py-3 px-4 rounded-lg bg-slate-100',
|
|
||||||
'hover:bg-slate-200',
|
|
||||||
'transition-all duration-300',
|
|
||||||
'flex items-center cursor-pointer',
|
|
||||||
'justify-between dark:bg-rua-gray-800',
|
|
||||||
'hover:dark:bg-rua-gray-700'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{Icon ? Icon : <VscGithubInverted className="w-8 h-8" />}
|
|
||||||
|
|
||||||
<a
|
|
||||||
href={project.url}
|
|
||||||
className="w-[calc(100%_-_40px)]"
|
|
||||||
target="_blank"
|
|
||||||
rel="noreferrer"
|
|
||||||
>
|
|
||||||
<h2
|
|
||||||
className={clsx(
|
|
||||||
'text-xl overflow-hidden',
|
|
||||||
'text-ellipsis whitespace-nowrap'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{project.name}
|
|
||||||
</h2>
|
|
||||||
<span
|
|
||||||
className={clsx(
|
|
||||||
'overflow-hidden break-keep text-ellipsis',
|
|
||||||
'whitespace-nowrap inline-block',
|
|
||||||
'w-[inherit]'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{project.description}
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ProjectCard;
|
|
Reference in New Issue
Block a user