c0ntroller/frontpage
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects 1 Activity

Socials as data

Browse Source
This commit is contained in:
Daniel Kluge 2022-10-29 21:48:36 +02:00
parent 8034aadb93
commit 642b8635c7
3 changed files with 53 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
data/socials.tsx Normal file
View File

@ -0,0 +1,38 @@
import { Github, Linkedin, Instagram, Discord, Steam } from "@icons-pack/react-simple-icons";
interface Social {
name: string;
url: string;
icon: JSX.Element;
}
export const socials = (iconSize?: string, color?: string): Social[] => {
iconSize = iconSize || "1em";
console.log(iconSize);
return [
{
name: "GitHub",
url: "https://github.com/C0ntroller",
icon: <Github size={iconSize} title="GitHub" color={color} />,
}, {
name: "LinkedIn",
url: "https://www.linkedin.com/in/c0ntroller/",
icon: <Linkedin size={iconSize} title="Linked" color={color} />,
}, {
name: "Instagram",
url: "https://www.instagram.com/c0ntroller/",
icon: <Instagram size={iconSize} title="Instagram" color={color} />,
}, {
name: "Steam",
url: "https://steamcommunity.com/id/c0ntroller/",
icon: <Steam size={iconSize} title="Steam" color={color} />,
}, {
name: "Discord",
url: "https://discordapp.com/users/224208617820127233",
icon: <Discord size={iconSize} title="Discord" color={color} />
}
];
};
export default socials;

13
pages/me.tsx
View File

@ -1,5 +1,6 @@
import type { NextPage } from "next";
import Link from "next/link";
import Image from "next/image";
import { useEffect } from "react";
import { Discord, Github, Instagram, Steam, Linkedin } from "@icons-pack/react-simple-icons";
import Layout from "../components/Blog/Layout";
@ -9,7 +10,7 @@ import pic from "../public/img/me.png";
import skills, { AdditionalSkill, Skill, SkillCard } from "../data/skills";
import achievements from "../data/achievements";
import Image from "next/image";
import socials from "../data/socials";
const Badge: NextPage<{ additional: AdditionalSkill }> = ({ additional }) => {
return <div className={styles.badge}>
@ -107,11 +108,11 @@ const Me: NextPage = () => {
</div>
<h2>Social Media</h2>
<div className={styles.socials}>
<a href="https://github.com/C0ntroller" target="_blank" rel="noreferrer" className="nocolor"><Github size="2em" title="Github" /></a>
<a href="https://www.linkedin.com/in/c0ntroller/" target="_blank" rel="noreferrer" className="nocolor"><Linkedin size="2em" title="Linked" /></a>
<a href="https://www.instagram.com/c0ntroller/" target="_blank" rel="noreferrer" className="nocolor"><Instagram size="2em" title="Instagram" /></a>
<a href="https://steamcommunity.com/id/c0ntroller/" target="_blank" rel="noreferrer" className="nocolor"><Steam size="2em" title="Steam" /></a>
<a href="https://discordapp.com/users/224208617820127233" target="_blank" rel="noreferrer" className="nocolor"><Discord size="2em" title="Discord" /></a>
{socials("2em").map((social, i) =>
<a key={i} href={social.url} target="_blank" rel="noreferrer" className="nocolor">
{social.icon}
</a>
)}
</div>
<h2>Achievements</h2>
{achievements().map((achievement, i) => <div key={i} className={styles.achievement}>

25
pages/terminal.tsx
View File

@ -8,11 +8,14 @@ import { useCommands } from "../lib/commands/ContextProvider";
import { useModalFunctions } from "../components/Terminal/contexts/ModalFunctions";
import ProjectModal from "../components/Terminal/ProjectModal";
import REPL from "../components/Terminal/REPL";
import styles from "../styles/Terminal/Terminal.module.css";
import type { ContentList } from "../lib/content/types";
import { useRouter } from "next/router";
import Rainbow from "../lib/colors";
import styles from "../styles/Terminal/Terminal.module.css";
import socials from "../data/socials";
const Terminal: NextPage<{ buildTime: string }> = ({ buildTime }) => {
const inputRef = useRef<HTMLInputElement>(null);
const { modalFunctions } = useModalFunctions();
@ -67,22 +70,10 @@ const Terminal: NextPage<{ buildTime: string }> = ({ buildTime }) => {
<span className={styles.divider}>|</span>
<a href="mailto:admin-website@c0ntroller.de" rel="noreferrer" className={styles.iconLink}><Icon path={mdiEmail} color="var(--repl_color)" size="1.5em" id="mdi_terminal_nav_email" title="Email" /></a>
<span className={styles.divider}>|</span>
<a href="https://github.com/C0ntroller" target="_blank" rel="noreferrer" className={styles.iconLink}><Github color="var(--repl_color)" size={iconSize} title="Github" /></a>
<span className={styles.divider}>|</span>
<a href="https://www.linkedin.com/in/c0ntroller/" target="_blank" rel="noreferrer" className={styles.iconLink}><Linkedin color="var(--repl_color)" size={iconSize} title="LinkedIn" /></a>
<span className={styles.divider}>|</span>
<a href="https://www.instagram.com/c0ntroller/" target="_blank" rel="noreferrer" className={styles.iconLink}><Instagram color="var(--repl_color)" size={iconSize} title="Instagram" /></a>
<span className={styles.divider}>|</span>
<a href="https://steamcommunity.com/id/c0ntroller/" target="_blank" rel="noreferrer" className={styles.iconLink}><Steam color="var(--repl_color)" size={iconSize} title="Steam" /></a>
<span className={styles.divider}>|</span>
<a href="https://discordapp.com/users/224208617820127233" target="_blank" rel="noreferrer" className={styles.iconLink}>
<span className={styles.tooltip} style={{ cursor: "pointer" }}>
<Discord color="var(--repl_color)" size={iconSize} title="Discord" />
<span className={styles.tooltiptext}>
C0ntroller_Z#3883
</span>
</span>
</a>
{socials(iconSize, "var(--repl_color)").map((social, i) => <>
{i !== 0 ? <span className={styles.divider} key={`d${i}`}>|</span> : null}
<a key={i} href={social.url} target="_blank" rel="noreferrer" className={styles.iconLink}>{social.icon}</a>
</>)}
<span className={styles.spacer} onClick={focusInput}>&nbsp;</span>
</div>
<REPL inputRef={inputRef} buildTime={buildTime} />