No more phosphor-react

This commit is contained in:
Daniel Kluge 2022-10-20 14:58:13 +02:00
parent 1078f07bae
commit aa28e1a8a7
7 changed files with 90 additions and 62 deletions

View File

@ -2,11 +2,12 @@
import type { NextPage } from "next"; import type { NextPage } from "next";
import Link from "next/link"; import Link from "next/link";
import Image from "next/image"; import Image from "next/image";
import { TerminalWindow, House, User } from "phosphor-react"; import Icon from "@mdi/react";
import { mdiConsole, mdiAccount, mdiHome } from "@mdi/js";
import ThemeSwitch from "./ThemeSwitch"; import ThemeSwitch from "./ThemeSwitch";
import styles from "../../styles/Blog/Navigation.module.scss"; import styles from "../../styles/Blog/Navigation.module.scss";
import logo from "../../public/icon.png"; import logo from "../../public/img/icon.png";
const Navigation: NextPage<{}> = () => { const Navigation: NextPage<{}> = () => {
return <nav className={styles.navigation}> return <nav className={styles.navigation}>
@ -22,17 +23,17 @@ const Navigation: NextPage<{}> = () => {
<div className={styles.navLink}> <div className={styles.navLink}>
<Link href={"/"}><a className="nostyle"> <Link href={"/"}><a className="nostyle">
<span className={styles.linkText}>Projects</span> <span className={styles.linkText}>Projects</span>
<span className={styles.linkIcon}><House size={"2em"} /></span> <span className={styles.linkIcon}><Icon path={mdiHome} size={"2em"} /></span>
</a></Link> </a></Link>
</div> </div>
<div className={styles.navLink}> <div className={styles.navLink}>
<Link href={"/me"}><a className="nostyle"> <Link href={"/me"}><a className="nostyle">
<span className={styles.linkText}>About me</span> <span className={styles.linkText}>About me</span>
<span className={styles.linkIcon}><User size={"2em"} /></span> <span className={styles.linkIcon}><Icon path={mdiAccount} size={"2em"} /></span>
</a></Link> </a></Link>
</div> </div>
<div className={styles.spacer}></div> <div className={styles.spacer}></div>
<div className={styles.navIcon}><a className="nostyle" href={"/terminal"}><TerminalWindow size={"2em"} /></a></div> <div className={styles.navIcon}><a className="nostyle" href={"/terminal"}><Icon path={mdiConsole} size={"2em"} /></a></div>
<ThemeSwitch /> <ThemeSwitch />
</nav>; </nav>;
}; };

View File

@ -1,7 +1,8 @@
import type { NextPage } from "next"; import type { NextPage } from "next";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useTheme } from "next-themes"; import { useTheme } from "next-themes";
import { Sun, Moon, FileJs } from "phosphor-react"; import Icon from "@mdi/react";
import { mdiWhiteBalanceSunny, mdiWeatherNight, mdiLanguageJavascript } from "@mdi/js";
import styles from "../../styles/Blog/ThemeSwitch.module.scss"; import styles from "../../styles/Blog/ThemeSwitch.module.scss";
@ -35,7 +36,7 @@ const ThemeSwitch: NextPage<{ size?: string }> = ({ size }) => {
if (!mounted) { if (!mounted) {
return <div className={styles.switch} title="Theme switching needs JS to be enabled."> return <div className={styles.switch} title="Theme switching needs JS to be enabled.">
<FileJs size={size || "1.5em"} className={styles.placeHolder} /> <Icon path={mdiLanguageJavascript} size={size || "1.5em"} className={styles.placeHolder} />
</div>; </div>;
} }
@ -43,8 +44,8 @@ const ThemeSwitch: NextPage<{ size?: string }> = ({ size }) => {
const moonClasses = fadeProps.moon || (theme === "light" ? styles.selected : undefined); const moonClasses = fadeProps.moon || (theme === "light" ? styles.selected : undefined);
return <div className={styles.switch}> return <div className={styles.switch}>
<Sun size={size || "1.5em"} className={sunClasses} onClick={() => switchTheme("light")} /> <div className={sunClasses} onClick={() => switchTheme("light")}><Icon path={mdiWhiteBalanceSunny} size={size || "1.5em"} /></div>
<Moon size={size || "1.5em"} className={moonClasses} onClick={() => switchTheme("dark")} /> <div className={moonClasses} onClick={() => switchTheme("dark")}><Icon path={mdiWeatherNight} size={size || "1.5em"} /></div>
</div>; </div>;
}; };

105
package-lock.json generated
View File

@ -6,6 +6,9 @@
"": { "": {
"name": "c0ntroller.de", "name": "c0ntroller.de",
"dependencies": { "dependencies": {
"@icons-pack/react-simple-icons": "^5.10.0",
"@mdi/js": "^7.0.96",
"@mdi/react": "^1.6.1",
"asciidoctor": "^2.2.5", "asciidoctor": "^2.2.5",
"color": "^4.2.3", "color": "^4.2.3",
"highlight.js": "^11.5.1", "highlight.js": "^11.5.1",
@ -13,7 +16,6 @@
"next": "12.1.0", "next": "12.1.0",
"next-themes": "^0.2.1", "next-themes": "^0.2.1",
"node-fetch": "^3.2.0", "node-fetch": "^3.2.0",
"phosphor-react": "^1.3.1",
"react": "17.0.2", "react": "17.0.2",
"react-dom": "17.0.2" "react-dom": "17.0.2"
}, },
@ -167,9 +169,9 @@
} }
}, },
"node_modules/@babel/runtime": { "node_modules/@babel/runtime": {
"version": "7.17.2", "version": "7.19.4",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.2.tgz", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.4.tgz",
"integrity": "sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw==", "integrity": "sha512-EXpLCrk55f+cYqmHsSR+yD/0gAIMxxA9QK9lnQWzhMCvt+YmoBN7Zx94s++Kv0+unHk39vxNO8t+CMA2WSS3wA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"regenerator-runtime": "^0.13.4" "regenerator-runtime": "^0.13.4"
@ -231,6 +233,14 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true "dev": true
}, },
"node_modules/@icons-pack/react-simple-icons": {
"version": "5.10.0",
"resolved": "https://registry.npmjs.org/@icons-pack/react-simple-icons/-/react-simple-icons-5.10.0.tgz",
"integrity": "sha512-I93VYZJS6EQjiQr1k+FxNQv5xVWJIu222BoiSwb6CPTwAEtrCJXVZ9vygzdAOx5CnchKEIg7OcRHrx8o74uyoA==",
"peerDependencies": {
"react": "^16.13 || ^17 || ^18"
}
},
"node_modules/@jridgewell/gen-mapping": { "node_modules/@jridgewell/gen-mapping": {
"version": "0.3.2", "version": "0.3.2",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz",
@ -295,6 +305,19 @@
"@jridgewell/sourcemap-codec": "^1.4.10" "@jridgewell/sourcemap-codec": "^1.4.10"
} }
}, },
"node_modules/@mdi/js": {
"version": "7.0.96",
"resolved": "https://registry.npmjs.org/@mdi/js/-/js-7.0.96.tgz",
"integrity": "sha512-lNqhkV3cpPfYb/Avh+vXLFukUTbHbyHoFo4Jdc7Oc9UvURGVhamFIpgOVvEf2bNA78zvjXTZeVWExUTR+DLBfQ=="
},
"node_modules/@mdi/react": {
"version": "1.6.1",
"resolved": "https://registry.npmjs.org/@mdi/react/-/react-1.6.1.tgz",
"integrity": "sha512-4qZeDcluDFGFTWkHs86VOlHkm6gnKaMql13/gpIcUQ8kzxHgpj31NuCkD8abECVfbULJ3shc7Yt4HJ6Wu6SN4w==",
"dependencies": {
"prop-types": "^15.7.2"
}
},
"node_modules/@next/env": { "node_modules/@next/env": {
"version": "12.1.0", "version": "12.1.0",
"resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz",
@ -626,9 +649,9 @@
"dev": true "dev": true
}, },
"node_modules/@types/prop-types": { "node_modules/@types/prop-types": {
"version": "15.7.4", "version": "15.7.5",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
"integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==", "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==",
"dev": true "dev": true
}, },
"node_modules/@types/react": { "node_modules/@types/react": {
@ -1524,9 +1547,9 @@
"integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==" "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg=="
}, },
"node_modules/csstype": { "node_modules/csstype": {
"version": "3.0.11", "version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
"integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==", "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
"dev": true "dev": true
}, },
"node_modules/damerau-levenshtein": { "node_modules/damerau-levenshtein": {
@ -3702,17 +3725,6 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/phosphor-react": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/phosphor-react/-/phosphor-react-1.4.1.tgz",
"integrity": "sha512-gO5j7U0xZrdglTAYDYPACU4xDOFBTJmptrrB/GeR+tHhCZF3nUMyGmV/0hnloKjuTrOmpSFlbfOY78H39rgjUQ==",
"engines": {
"node": ">=10"
},
"peerDependencies": {
"react": ">=16"
}
},
"node_modules/picocolors": { "node_modules/picocolors": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -3769,7 +3781,6 @@
"version": "15.8.1", "version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
"dev": true,
"dependencies": { "dependencies": {
"loose-envify": "^1.4.0", "loose-envify": "^1.4.0",
"object-assign": "^4.1.1", "object-assign": "^4.1.1",
@ -3872,8 +3883,7 @@
"node_modules/react-is": { "node_modules/react-is": {
"version": "16.13.1", "version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
"dev": true
}, },
"node_modules/readdirp": { "node_modules/readdirp": {
"version": "3.6.0", "version": "3.6.0",
@ -5064,9 +5074,9 @@
} }
}, },
"@babel/runtime": { "@babel/runtime": {
"version": "7.17.2", "version": "7.19.4",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.2.tgz", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.4.tgz",
"integrity": "sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw==", "integrity": "sha512-EXpLCrk55f+cYqmHsSR+yD/0gAIMxxA9QK9lnQWzhMCvt+YmoBN7Zx94s++Kv0+unHk39vxNO8t+CMA2WSS3wA==",
"dev": true, "dev": true,
"requires": { "requires": {
"regenerator-runtime": "^0.13.4" "regenerator-runtime": "^0.13.4"
@ -5116,6 +5126,12 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true "dev": true
}, },
"@icons-pack/react-simple-icons": {
"version": "5.10.0",
"resolved": "https://registry.npmjs.org/@icons-pack/react-simple-icons/-/react-simple-icons-5.10.0.tgz",
"integrity": "sha512-I93VYZJS6EQjiQr1k+FxNQv5xVWJIu222BoiSwb6CPTwAEtrCJXVZ9vygzdAOx5CnchKEIg7OcRHrx8o74uyoA==",
"requires": {}
},
"@jridgewell/gen-mapping": { "@jridgewell/gen-mapping": {
"version": "0.3.2", "version": "0.3.2",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz",
@ -5171,6 +5187,19 @@
"@jridgewell/sourcemap-codec": "^1.4.10" "@jridgewell/sourcemap-codec": "^1.4.10"
} }
}, },
"@mdi/js": {
"version": "7.0.96",
"resolved": "https://registry.npmjs.org/@mdi/js/-/js-7.0.96.tgz",
"integrity": "sha512-lNqhkV3cpPfYb/Avh+vXLFukUTbHbyHoFo4Jdc7Oc9UvURGVhamFIpgOVvEf2bNA78zvjXTZeVWExUTR+DLBfQ=="
},
"@mdi/react": {
"version": "1.6.1",
"resolved": "https://registry.npmjs.org/@mdi/react/-/react-1.6.1.tgz",
"integrity": "sha512-4qZeDcluDFGFTWkHs86VOlHkm6gnKaMql13/gpIcUQ8kzxHgpj31NuCkD8abECVfbULJ3shc7Yt4HJ6Wu6SN4w==",
"requires": {
"prop-types": "^15.7.2"
}
},
"@next/env": { "@next/env": {
"version": "12.1.0", "version": "12.1.0",
"resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz",
@ -5387,9 +5416,9 @@
"dev": true "dev": true
}, },
"@types/prop-types": { "@types/prop-types": {
"version": "15.7.4", "version": "15.7.5",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
"integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==", "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==",
"dev": true "dev": true
}, },
"@types/react": { "@types/react": {
@ -6073,9 +6102,9 @@
} }
}, },
"csstype": { "csstype": {
"version": "3.0.11", "version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
"integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==", "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
"dev": true "dev": true
}, },
"damerau-levenshtein": { "damerau-levenshtein": {
@ -7679,12 +7708,6 @@
"integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
"dev": true "dev": true
}, },
"phosphor-react": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/phosphor-react/-/phosphor-react-1.4.1.tgz",
"integrity": "sha512-gO5j7U0xZrdglTAYDYPACU4xDOFBTJmptrrB/GeR+tHhCZF3nUMyGmV/0hnloKjuTrOmpSFlbfOY78H39rgjUQ==",
"requires": {}
},
"picocolors": { "picocolors": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -7722,7 +7745,6 @@
"version": "15.8.1", "version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
"dev": true,
"requires": { "requires": {
"loose-envify": "^1.4.0", "loose-envify": "^1.4.0",
"object-assign": "^4.1.1", "object-assign": "^4.1.1",
@ -7792,8 +7814,7 @@
"react-is": { "react-is": {
"version": "16.13.1", "version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
"dev": true
}, },
"readdirp": { "readdirp": {
"version": "3.6.0", "version": "3.6.0",

View File

@ -8,6 +8,9 @@
"lint": "npx next lint" "lint": "npx next lint"
}, },
"dependencies": { "dependencies": {
"@icons-pack/react-simple-icons": "^5.10.0",
"@mdi/js": "^7.0.96",
"@mdi/react": "^1.6.1",
"asciidoctor": "^2.2.5", "asciidoctor": "^2.2.5",
"color": "^4.2.3", "color": "^4.2.3",
"highlight.js": "^11.5.1", "highlight.js": "^11.5.1",
@ -15,7 +18,6 @@
"next": "12.1.0", "next": "12.1.0",
"next-themes": "^0.2.1", "next-themes": "^0.2.1",
"node-fetch": "^3.2.0", "node-fetch": "^3.2.0",
"phosphor-react": "^1.3.1",
"react": "17.0.2", "react": "17.0.2",
"react-dom": "17.0.2" "react-dom": "17.0.2"
}, },

View File

@ -1,6 +1,8 @@
import type { NextPage, GetStaticProps } from "next"; import type { NextPage, GetStaticProps } from "next";
import Head from "next/head"; import Head from "next/head";
import { GithubLogo, InstagramLogo, DiscordLogo, GameController, Envelope } from "phosphor-react"; import Icon from "@mdi/react";
import { mdiEmail } from "@mdi/js";
import { Discord, Github, Instagram, Steam } from "@icons-pack/react-simple-icons";
import { useEffect, useRef,useCallback } from "react"; import { useEffect, useRef,useCallback } from "react";
import { useCommands } from "../lib/commands/ContextProvider"; import { useCommands } from "../lib/commands/ContextProvider";
import { useModalFunctions } from "../components/Terminal/contexts/ModalFunctions"; import { useModalFunctions } from "../components/Terminal/contexts/ModalFunctions";
@ -49,6 +51,8 @@ const Home: NextPage<{ buildTime: string }> = ({ buildTime }) => {
} }
}, [router]); }, [router]);
const iconSize = "1.3em";
return (<main onKeyDown={hideModalOnEsc} tabIndex={-1}> return (<main onKeyDown={hideModalOnEsc} tabIndex={-1}>
<Head> <Head>
<title>c0ntroller.de</title> <title>c0ntroller.de</title>
@ -61,17 +65,17 @@ const Home: NextPage<{ buildTime: string }> = ({ buildTime }) => {
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="https://github.com/C0ntroller/c0ntroller.de/issues/new" target="_blank" rel="noreferrer">Bug?</a> <a href="https://github.com/C0ntroller/c0ntroller.de/issues/new" target="_blank" rel="noreferrer">Bug?</a>
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="mailto:admin-website@c0ntroller.de" rel="noreferrer"><Envelope color="var(--repl_color)" className={styles.iconLink} alt="E-Mail" /></a> <a href="mailto:admin-website@c0ntroller.de" rel="noreferrer" className={styles.iconLink}><Icon path={mdiEmail} color="var(--repl_color)" size={"1.5em"} /></a>
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="https://github.com/C0ntroller" target="_blank" rel="noreferrer"><GithubLogo color="var(--repl_color)" className={styles.iconLink} alt="GitHub" /></a> <a href="https://github.com/C0ntroller" target="_blank" rel="noreferrer" className={styles.iconLink}><Github color="var(--repl_color)" size={iconSize} /></a>
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="https://www.instagram.com/c0ntroller/" target="_blank" rel="noreferrer"><InstagramLogo color="var(--repl_color)" className={styles.iconLink} alt="Instagram" /></a> <a href="https://www.instagram.com/c0ntroller/" target="_blank" rel="noreferrer" className={styles.iconLink}><Instagram color="var(--repl_color)" size={iconSize} /></a>
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="https://steamcommunity.com/id/c0ntroller/" target="_blank" rel="noreferrer"><GameController color="var(--repl_color)" className={styles.iconLink} alt="Steam" /></a> <a href="https://steamcommunity.com/id/c0ntroller/" target="_blank" rel="noreferrer" className={styles.iconLink}><Steam color="var(--repl_color)" size={iconSize} /></a>
<span className={styles.divider}>|</span> <span className={styles.divider}>|</span>
<a href="https://discordapp.com/users/224208617820127233" target="_blank" rel="noreferrer"> <a href="https://discordapp.com/users/224208617820127233" target="_blank" rel="noreferrer" className={styles.iconLink}>
<span className={styles.tooltip} style={{ cursor: "pointer" }}> <span className={styles.tooltip} style={{ cursor: "pointer" }}>
<DiscordLogo color="var(--repl_color)" className={styles.iconLink} alt="Discord" /> <Discord color="var(--repl_color)" size={iconSize} />
<span className={styles.tooltiptext}> <span className={styles.tooltiptext}>
C0ntroller_Z#3883 C0ntroller_Z#3883
</span> </span>

View File

Before

Width:  |  Height:  |  Size: 27 KiB

After

Width:  |  Height:  |  Size: 27 KiB

View File

@ -45,9 +45,8 @@
} }
.iconLink { .iconLink {
cursor: pointer; height: 1.15em;
font-size: 1.6em; width: 1.6em;
padding-top: 0.3em;
} }
.tooltip { .tooltip {