work on caste load

This commit is contained in:
Romulus21
2025-07-28 08:54:53 +02:00
parent a229c416a9
commit 9362dbe400
5 changed files with 102 additions and 22 deletions

View File

@@ -1,13 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Framy</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 25.74 512.2 460.51"><path d="M409.8 77.7 397.2 63l-66.3 57.3 66.5 56.5 12.6-14.7-49.3-41.9zm55.9 77c-6.7 0-12.2 5.5-12.2 12.2s5.5 12.2 12.2 12.2 12.2-5.5 12.2-12.2c0-6.8-5.5-12.2-12.2-12.2m34.4-112c-7.1-7.3-16.1-11.2-24.4-13.6-7.4-2-15-3.1-22.7-3.3-6.1-.2-10.1.2-10.1.2l1.8 19.3s13.3-1 25.8 2.5c6.3 1.8 12 4.6 15.9 8.5 3.8 3.9 6.4 8.8 6.4 17.5 0 4.5-1.2 6.8-3.2 9-2.4 2.4-5.4 4.3-8.7 5.3-7.2 2.6-15 2.7-15 2.7h-9.7v50.1h19.4v-32.4c4.1-.4 5.8.1 11.9-2.1 5.6-2 11.6-5.1 16.5-10.5 5.4-6.1 8.3-13.9 8.2-22-.2-13.2-5-23.9-12.1-31.2" style="fill:#f4301c"/><path d="M24.6 466.2c13.6 6.3 32 11.3 54.6 14.8 45.2 7 99.9 7 145.1 0 22.6-3.5 41-8.4 54.6-14.7 6.8-3.2 12.4-6.7 16.9-11.1 4.4-4.4 7.8-10.2 7.8-16.8V148.9c0-10.1-7.1-17.6-15.7-23-8.5-5.4-19.7-9.7-33.1-13.3-26.9-7.2-63-11.5-103-11.5s-76.1 4.3-103 11.5c-13.5 3.6-24.6 7.9-33.1 13.3-8.6 5.3-15.7 12.8-15.7 23v289.4c0 6.6 3.3 12.4 7.8 16.8 4.4 4.4 10 7.9 16.8 11.1M26 142.1c5.8-3.7 15.5-7.7 27.8-11 24.5-6.6 59.5-10.9 98-10.9s73.4 4.3 97.9 10.9c12.3 3.3 22 7.3 27.8 11s6.7 6.3 6.7 6.7-.9 3-6.7 6.7c-5.9 3.7-15.5 7.7-27.8 11-24.5 6.6-59.4 10.9-98 10.9s-73.5-4.3-98-10.9c-12.3-3.3-21.9-7.3-27.8-11s-6.7-6.3-6.7-6.7c.2-.3 1-2.9 6.8-6.7m-6.7 31.3c8.1 4.6 17.5 8.6 29.4 11.8 26.9 7.2 63 11.5 103 11.5 39.9 0 76.1-4.3 103-11.5 11.9-3.2 21.3-7.3 29.4-11.8v72c0 .2 0 1.1-2.1 3.1q-5.1 4.5-11.4 7.2c-10.9 5.1-28 9.9-49.4 13.2-42.8 6.6-96.3 6.6-139.1 0-21.4-3.3-38.5-8.1-49.4-13.2q-6.3-2.7-11.4-7.2c-2-2-2.1-2.9-2.1-3.1v-72zm0 96.3c1.9 1.1 3.2 2.5 5.3 3.5 13.6 6.4 32 11.3 54.6 14.8 45.2 7 99.9 7 145.1 0 22.6-3.5 41-8.4 54.6-14.8 2.1-1 3.4-2.4 5.3-3.5v72.1c0 .2 0 1.1-2.1 3.1q-5.1 4.5-11.4 7.2c-10.9 5.1-28 9.9-49.4 13.2-42.8 6.6-96.3 6.6-139.1 0-21.4-3.3-38.5-8.1-49.4-13.2q-6.3-2.7-11.4-7.2c-2-2-2.1-2.9-2.1-3.1zm0 96.5c1.9 1.1 3.2 2.5 5.3 3.5 13.6 6.3 32 11.3 54.6 14.8 45.2 7 99.9 7 145.1 0 22.6-3.5 41-8.5 54.6-14.8 2.1-1 3.4-2.4 5.3-3.5v72.1c0 .2 0 1.1-2.1 3.1q-5.1 4.5-11.4 7.2c-10.9 5.1-28 9.9-49.4 13.2-42.8 6.6-96.3 6.6-139.1 0-21.4-3.3-38.5-8.1-49.4-13.2q-6.3-2.7-11.4-7.2c-2-2-2.1-2.9-2.1-3.1z" style="fill:#1e5781"/></svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" id="Layer_1" x="0" y="0" version="1.1" viewBox="0 0 512 512"><style>.st1{fill:#fff}</style><path d="M240 440c-27.2 0-48-20.8-48-48v-80c0-27.2 20.8-48 48-48h128c27.2 0 48 20.8 48 48v80c0 27.2-20.8 48-48 48z" style="fill:#65b1dd"/><path d="M368 280c17.6 0 32 14.4 32 32v80c0 17.6-14.4 32-32 32H240c-17.6 0-32-14.4-32-32v-80c0-17.6 14.4-32 32-32zm0-32H240c-35.2 0-64 28.8-64 64v80c0 35.2 28.8 64 64 64h128c35.2 0 64-28.8 64-64v-80c0-35.2-28.8-64-64-64" class="st1"/><path d="M64 472c-27.2 0-48-20.8-48-48V312c0-27.2 20.8-48 48-48h160c27.2 0 48 20.8 48 48v112c0 27.2-20.8 48-48 48z" style="fill:#336697"/><path d="M224 280c17.6 0 32 14.4 32 32v112c0 17.6-14.4 32-32 32H64c-17.6 0-32-14.4-32-32V312c0-17.6 14.4-32 32-32zm0-32H64c-35.2 0-64 28.8-64 64v112c0 35.2 28.8 64 64 64h160c35.2 0 64-28.8 64-64V312c0-35.2-28.8-64-64-64" class="st1"/><path d="M192 328c-27.2 0-48-20.8-48-48V88c0-27.2 20.8-48 48-48h256c27.2 0 48 20.8 48 48v192c0 27.2-20.8 48-48 48z" style="fill:#1d4775"/><path d="M448 56c17.6 0 32 14.4 32 32v192c0 17.6-14.4 32-32 32H192c-17.6 0-32-14.4-32-32V88c0-17.6 14.4-32 32-32zm0-32H192c-35.2 0-64 28.8-64 64v192c0 35.2 28.8 64 64 64h256c35.2 0 64-28.8 64-64V88c0-35.2-28.8-64-64-64" class="st1"/></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -1,23 +1,82 @@
import type { FC } from "react";
import { CastesLinks } from "./CastesLinks";
function App() {
const links = [
{ name: "Adminer", link: "http://adminer.loc" },
{ name: "Duplicati", link: "http://localhost:8200" },
{ name: "Adminer", link: "http://adminer.loc", icon: "assets/adminer.svg" },
{
name: "Duplicati",
link: "http://localhost:8200",
icon: "assets/duplicati.svg",
},
];
const proLinks = [
{
name: "GPAO",
link: "http://gpao.loc",
icon: "http://gpao.loc/favicon.ico",
},
{ name: "Mycastes", link: "http://mycastes.loc" },
];
return (
<main className="dark:bg-sky-950 dark:text-sky-50 h-screen flex flex-col">
<main className="dark:bg-slate-950 dark:text-slate-50 h-screen flex flex-col gap-10">
<h1 className="text-center text-5xl font-semibold">Frame Work</h1>
<ul className="flex flex-wrap gap-2 text-3xl flex-1 items-center justify-center">
{links.map((link) => (
<li>
<a href={link.link} target="_blank">
{link.name}
</a>
</li>
))}
</ul>
<LinkGroup title="Perso" links={links} />
<LinkGroup title="Pro Dev" links={proLinks} />
<CastesLinks />
</main>
);
}
export default App;
interface LinkGroupProps {
title: string;
links: LinkInterface[];
}
export const LinkGroup: FC<LinkGroupProps> = ({ title, links }) => {
return (
<div>
<h2 className="text-3xl font-semibold text-center mb-5">{title}</h2>
<ul className="flex flex-wrap gap-2 text-3xl flex-1 items-center justify-center">
{links.map((link) => (
<Link link={link} />
))}
</ul>
</div>
);
};
interface LinkInterface {
name: string;
link: string;
icon?: string;
}
interface LinkProps {
link: LinkInterface;
}
const Link: FC<LinkProps> = ({ link }) => {
return (
<li>
<a
href={link.link}
target="_blank"
className="block h-16 min-w-60 text-center bg-slate-800 px-5 py-3 rounded hover:bg-slate-700 transition hover:scale-105"
>
{link.icon ? (
<div className="flex items-center">
<img src={link.icon} alt={link.name} className="max-h-10" />
<div className="flex-1">{link.name}</div>
</div>
) : (
link.name
)}
</a>
</li>
);
};

19
src/CastesLinks.tsx Normal file
View File

@@ -0,0 +1,19 @@
import { useEffect, useState } from "react";
import { LinkGroup } from "./App";
export const CastesLinks = () => {
const [loading, setLoading] = useState(true);
const links = [{ name: "GPAO", link: "http://gpao.lan" }];
useEffect(() => {
testConnection();
}, []);
const testConnection = async () => {
try {
const res = await fetch("http://gpao.lan");
console.log("link", res);
} catch (error) {}
};
return <LinkGroup title="Castes" links={links} />;
};