Cronocide/starbase-81
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed icons

Browse Source
This commit is contained in:
Jordan Roher 2023-12-18 13:09:47 -08:00
parent 438e5f5405
commit 88252eea06
7 changed files with 21 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/anchor.ts
View File

@ -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>
`;

4
src/components/header.ts
View File

@ -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>
`;

10
src/components/icon.ts
View File

@ -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="${{

4
src/components/service-catalogs.ts
View File

@ -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>
`;

10
src/components/services.ts
View File

@ -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>
`

8
src/pages/index.ts
View File

@ -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>

2
tailwind.config.js
View File

@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ["./dist/index.html"],
content: ["./public/index.html"],
safelist: [
/* Built from icon.tsx */
{