From 88252eea0654b3ed218b833ff215d17e2ff9990c Mon Sep 17 00:00:00 2001
From: Jordan Roher <jordan@notclickable.com>
Date: Mon, 18 Dec 2023 13:09:47 -0800
Subject: [PATCH] Fixed icons

---
 src/components/anchor.ts           |  4 ++--
 src/components/header.ts           |  4 ++--
 src/components/icon.ts             | 10 +++++-----
 src/components/service-catalogs.ts |  4 ++--
 src/components/services.ts         | 10 +++++-----
 src/pages/index.ts                 |  8 ++++----
 tailwind.config.js                 |  2 +-
 7 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/src/components/anchor.ts b/src/components/anchor.ts
index 02426bd..3c0c67e 100644
--- a/src/components/anchor.ts
+++ b/src/components/anchor.ts
@@ -20,14 +20,14 @@ export const Anchor = function (props: IProps) {
 
 	if (newWindowLocal) {
 		return `
-			<a href="${uri}" target="_blank" rel="noreffer" title="${title || ""}" className="${className || ""}">
+			<a href="${uri}" target="_blank" rel="noreffer" title="${title || ""}" class="${className || ""}">
 				${children}
 			</a>
 		`;
 	}
 
 	return `
-		<a href="${uri}" title="${title || ""}" className="${className || ""}">
+		<a href="${uri}" title="${title || ""}" class="${className || ""}">
 			${children}
 		</a>
 	`;
diff --git a/src/components/header.ts b/src/components/header.ts
index fc8bb98..4641781 100644
--- a/src/components/header.ts
+++ b/src/components/header.ts
@@ -8,8 +8,8 @@ interface IProps {
 export const Header = function (props: IProps) {
 	const { icon, title } = props;
 	return `
-		<div className="p-2 xl:p-4 flex flex-nowrap justify-center items-center gap-2 xl:flex-wrap">
-			${!is.null(icon) && `<img src="${icon}" alt="${title || ""}" className="inline-block w-16 h-16" />`}
+		<div class="p-2 xl:p-4 flex flex-nowrap justify-center items-center gap-2 xl:flex-wrap">
+			${!is.null(icon) && `<img src="${icon}" alt="${title || ""}" class="inline-block w-16 h-16" />`}
 			<h1>${title}</h1>
 		</div>
 	`;
diff --git a/src/components/icon.ts b/src/components/icon.ts
index 7d6e288..f3406ba 100644
--- a/src/components/icon.ts
+++ b/src/components/icon.ts
@@ -38,7 +38,7 @@ interface IProps {
 export const Icon = function (props: IProps): string {
 	const { name, uri, icon, index, iconBG, iconBubble, iconColor, iconAspect, newWindow } = props;
 
-	if (!is.null(icon)) {
+	if (is.null(icon)) {
 		if (!is.null(uri)) {
 			return Anchor({ uri: uri as string, title: name, newWindow, children: IconBlank({ index }) });
 		}
@@ -79,7 +79,7 @@ function IconBlank(props: IIconBlankProps) {
 	const { index } = props;
 	return `
 		<span
-			className="${`block w-16 h-16 rounded-2xl border border-black/5 shadow-sm ${getIconColor(index)} overflow-hidden`}"
+			class="${`block w-16 h-16 rounded-2xl border border-black/5 shadow-sm ${getIconColor(index)} overflow-hidden`}"
 		/>
 	`;
 }
@@ -176,14 +176,14 @@ function IconBase(props: IIconBaseProps) {
 
 	switch (iconType) {
 		case IconType.uri:
-			return `<img src="${icon}" alt="" className="${iconClassName || ""}" style="${{ ...iconStyle }}" />`;
+			return `<img src="${icon}" alt="" class="${iconClassName || ""}" style="${{ ...iconStyle }}" />`;
 		case IconType.dashboard:
 			icon = icon.replace(".png", "").replace(".jpg", "").replace(".svg", "");
 			return `
 				<img
 					src=${`https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}.png`}
 					alt=""
-					className="${iconClassName || ""}"
+					class="${iconClassName || ""}"
 					style="${{ ...iconStyle }}"
 				/>
 			`;
@@ -191,7 +191,7 @@ function IconBase(props: IIconBaseProps) {
 			icon = icon.replace("mdi-", "").replace(".svg", "");
 
 			return `
-				<div className="${iconClassName || ""}" style="${{ ...iconStyle }}">
+				<div class="${iconClassName || ""}" style="${{ ...iconStyle }}">
 					<div
 						className=${`block ${iconWidthHeightClassName} ${mdiIconColorFull} overflow-hidden`}
 						style="${{
diff --git a/src/components/service-catalogs.ts b/src/components/service-catalogs.ts
index d5c8bdf..4f9eb07 100644
--- a/src/components/service-catalogs.ts
+++ b/src/components/service-catalogs.ts
@@ -43,8 +43,8 @@ const ServiceCatalog = function (props: ICatalogProps) {
 	}
 
 	return `
-		<li className="${liClassName}">
-			<h2 className="${categoryClassName}">${catalog.category}</h2>
+		<li class="${liClassName}">
+			<h2 class="${categoryClassName}">${catalog.category}</h2>
 			${Services({ services: catalog.services })}
 		</li>
 	`;
diff --git a/src/components/services.ts b/src/components/services.ts
index 4314a26..e6401c8 100644
--- a/src/components/services.ts
+++ b/src/components/services.ts
@@ -11,7 +11,7 @@ export const Services = function (props: IServicesProps) {
 	const { services } = props;
 
 	return `
-		<ul className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-1 lg:gap-2 lg:gap-y-4">
+		<ul class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-1 lg:gap-2 lg:gap-y-4">
 			${services.map((service, index) => Service({ index, service })).join("")}
 		</ul>
 	`;
@@ -28,23 +28,23 @@ function Service(props: IServiceProps) {
 	const { name, uri, description, icon, iconBG, iconBubble, iconColor, iconAspect, newWindow } = service;
 
 	return `
-		<li className="p-4 flex gap-4">
+		<li class="p-4 flex gap-4">
 			${
 				!is.null(icon) &&
 				`
-				<span className="flex-shrink-0 flex">
+				<span class="flex-shrink-0 flex">
 				${Icon({ name, icon, uri, index, iconColor, iconBG, iconBubble, iconAspect, newWindow })}
 				</span>
 			`
 			}
 			<div>
-				<h3 className="text-lg mt-1 font-semibold line-clamp-1">
+				<h3 class="text-lg mt-1 font-semibold line-clamp-1">
 					${Anchor({ uri, newWindow, children: name })}
 				</h3>
 				${
 					!is.null(description) &&
 					`
-					<p className="text-sm text-black/50 dark:text-white/50 line-clamp-1">
+					<p class="text-sm text-black/50 dark:text-white/50 line-clamp-1">
 					${Anchor({ uri, newWindow, children: description })}
 					</p>
 				`
diff --git a/src/pages/index.ts b/src/pages/index.ts
index 0a87383..f871f6c 100644
--- a/src/pages/index.ts
+++ b/src/pages/index.ts
@@ -46,17 +46,17 @@ export const IndexPage = function (props: IProps): string {
 	}
 
 	return `
-		<div className="min-h-screen">
-			<div className="${pageWrapperClassName}">
+		<div class="min-h-screen">
+			<div class="${pageWrapperClassName}">
 				${
 					SHOWHEADER &&
 					`
-					<div className="${headerClassName}">
+					<div class="${headerClassName}">
 					${Header({ icon, title })}
 					</div>
 				`
 				}
-				<div className="${serviceCatalogListWrapperClassName}">
+				<div class="${serviceCatalogListWrapperClassName}">
 				${ServiceCatalogList({ catalogs: myServices })}
 				</div>
 			</div>
diff --git a/tailwind.config.js b/tailwind.config.js
index 5a92381..5168dad 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,6 +1,6 @@
 /** @type {import('tailwindcss').Config} */
 export default {
-	content: ["./dist/index.html"],
+	content: ["./public/index.html"],
 	safelist: [
 		/* Built from icon.tsx */
 		{