add code icon, add icons to link/redirect list in /o-gractwie

components/Icon.tsx

@@ -3,6 +3,7 @@ type iconselection =
 	| "Users"
 	| "Link2"
 	| "ExternalLink"
+	| "Code"
 	| "Twitter"
 	| "GitHub"
 	| "YouTube"
@@ -100,6 +101,25 @@ const Icon = ({ icon, width, height, ...props }: iconprops) => {
 					<line x1="10" y1="14" x2="21" y2="3" />
 				</svg>
 			);
+		case "Code":
+			return (
+				<svg
+					xmlns="http://www.w3.org/2000/svg"
+					width={width || 24}
+					height={height || 24}
+					viewBox="0 0 24 24"
+					fill="none"
+					stroke="currentColor"
+					strokeWidth="2"
+					strokeLinecap="round"
+					strokeLinejoin="round"
+					className="feather feather-code"
+					{...props}
+				>
+					<polyline points="16 18 22 12 16 6" />
+					<polyline points="8 6 2 12 8 18" />
+				</svg>
+			);
 		case "Twitter":
 			// twitter icon courtesy of simpleicons.org
 			return (
@@ -164,7 +184,10 @@ const Icon = ({ icon, width, height, ...props }: iconprops) => {
 					<path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z" />
 				</svg>
 			);
+		default:
+			return <></>;
 	}
 };
 
 export { Icon };
+export type { iconselection };

data/links.json

@@ -3,25 +3,29 @@
 		"name": "Discord",
 		"href": "https://discord.gg/NBXq95C",
 		"hrefalias": ["/discord", "/dsc", "/dc"],
-		"desc": "Nasz serwer na Discordzie!"
+		"desc": "Nasz serwer na Discordzie!",
+		"icon": "Discord"
 	},
 	{
 		"name": "YouTube",
 		"href": "https://www.youtube.com/@gractwopl",
 		"hrefalias": ["/youtube", "/yt"],
-		"desc": "Nasz kanał na YouTubie!"
+		"desc": "Nasz kanał na YouTubie!",
+		"icon": "YouTube"
 	},
 	{
 		"name": "Twitter",
 		"href": "https://twitter.com/gractwo",
 		"hrefalias": ["/twitter", "/twt"],
-		"desc": "Nasz profil na Twitterze!"
+		"desc": "Nasz profil na Twitterze!",
+		"icon": "Twitter"
 	},
 	{
 		"name": "GitHub",
 		"href": "https://github.com/gractwo",
 		"hrefalias": ["/github", "/gh"],
-		"desc": "Nasz org na GitHubie!"
+		"desc": "Nasz org na GitHubie!",
+		"icon": "GitHub"
 	},
 	{
 		"href": "/o-gractwie#sklad-administracji",
@@ -31,6 +35,7 @@
 		"name": "Kod Źródłowy",
 		"href": "https://github.com/gractwo/gractwo-web",
 		"hrefalias": ["/source", "/oss"],
-		"desc": "Kod źródłowy naszej strony internetowej."
+		"desc": "Kod źródłowy naszej strony internetowej.",
+		"icon": "Code"
 	}
 ]

pages/o-gractwie.tsx

@@ -3,6 +3,7 @@ import { SEO } from "../components/SEO";
 import styles from "../styles/oGractwie.module.scss";
 import Link from "next/link";
 import { Icon } from "../components/Icon";
+import { iconselection } from "../components/Icon";
 import administracja from "../data/administracja.json";
 import links from "../data/links.json";
 
@@ -75,6 +76,7 @@ const PageInfo = () => {
 							return (
 								<Link className="chip" key={el.name} href={el.href}>
 									{el.name}
+									{el.icon ? <Icon icon={el.icon as iconselection} /> : ""}
 								</Link>
 							);
 						}