Initialize Aidoit v0.1 monorepo
This commit is contained in:
Pavel Kerndl
@@ -0,0 +1,218 @@
|
||||
.app-shell {
|
||||
min-height: 100vh;
|
||||
display: grid;
|
||||
grid-template-columns: 250px 1fr;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
padding: 26px 20px;
|
||||
border-right: 1px solid var(--border);
|
||||
background: rgba(6, 14, 22, 0.9);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.brand {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
|
||||
.brand strong,
|
||||
.brand span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.brand span {
|
||||
margin-top: 3px;
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.brand-mark {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 13px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
color: #041019;
|
||||
background: linear-gradient(135deg, #83dcff, #4ca3ff);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
nav a {
|
||||
color: var(--muted);
|
||||
padding: 11px 12px;
|
||||
border-radius: 10px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
nav a:hover,
|
||||
nav a.active {
|
||||
color: var(--text);
|
||||
background: rgba(87, 199, 255, 0.1);
|
||||
}
|
||||
|
||||
.api-status {
|
||||
margin-top: auto;
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
border-top: 1px solid var(--border);
|
||||
padding-top: 18px;
|
||||
}
|
||||
|
||||
.api-status span,
|
||||
.feed-item > span {
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin-right: 7px;
|
||||
border-radius: 50%;
|
||||
background: #5be18a;
|
||||
}
|
||||
|
||||
.workspace {
|
||||
padding: 38px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
gap: 20px;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
.hero h1 {
|
||||
font-size: clamp(30px, 4vw, 48px);
|
||||
margin: 3px 0 10px;
|
||||
letter-spacing: -0.04em;
|
||||
}
|
||||
|
||||
.hero > div > p:last-child,
|
||||
.empty-state p,
|
||||
.feed-item p {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.hero button {
|
||||
border: 0;
|
||||
border-radius: 12px;
|
||||
padding: 13px 18px;
|
||||
background: var(--accent);
|
||||
color: #041019;
|
||||
font-weight: 800;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.eyebrow {
|
||||
margin: 0;
|
||||
color: var(--accent);
|
||||
font-weight: 800;
|
||||
font-size: 11px;
|
||||
letter-spacing: 0.14em;
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.content-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1.4fr 0.8fr;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.panel {
|
||||
min-height: 330px;
|
||||
padding: 22px;
|
||||
border: 1px solid var(--border);
|
||||
background: linear-gradient(180deg, rgba(16, 30, 44, 0.96), rgba(10, 22, 32, 0.96));
|
||||
border-radius: 18px;
|
||||
}
|
||||
|
||||
.panel h2 {
|
||||
margin: 3px 0 0;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.panel-heading a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
min-height: 240px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
align-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.empty-state > div {
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
border-radius: 18px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: rgba(87, 199, 255, 0.1);
|
||||
color: var(--accent);
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.feed-item {
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.feed-item p {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.app-shell {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.content-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 620px) {
|
||||
.workspace {
|
||||
padding: 22px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
import type { Metadata } from "next";
|
||||
import "@aidoit/ui/styles.css";
|
||||
import "./app.css";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Aidoit",
|
||||
description: "Personal AI operating system",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{ children: React.ReactNode }>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body>{children}</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,91 @@
|
||||
import { StatCard } from "@aidoit/ui";
|
||||
|
||||
const navigation = [
|
||||
"Overview",
|
||||
"Projects",
|
||||
"Runs",
|
||||
"Tasks",
|
||||
"Teams",
|
||||
"Tools",
|
||||
"Deployments",
|
||||
"Servers",
|
||||
];
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<main className="app-shell">
|
||||
<aside className="sidebar">
|
||||
<div className="brand">
|
||||
<div className="brand-mark">A</div>
|
||||
<div>
|
||||
<strong>Aidoit</strong>
|
||||
<span>Personal AI OS</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
{navigation.map((item, index) => (
|
||||
<a className={index === 0 ? "active" : ""} href="#" key={item}>
|
||||
{item}
|
||||
</a>
|
||||
))}
|
||||
</nav>
|
||||
|
||||
<div className="api-status">
|
||||
<span />
|
||||
Development environment
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<section className="workspace">
|
||||
<header className="hero">
|
||||
<div>
|
||||
<p className="eyebrow">AIDOIT CONTROL CENTER</p>
|
||||
<h1>Good evening, Pavel.</h1>
|
||||
<p>
|
||||
Build applications, orchestrate AI teams, and manage infrastructure
|
||||
from one workspace.
|
||||
</p>
|
||||
</div>
|
||||
<button type="button">New project</button>
|
||||
</header>
|
||||
|
||||
<section className="stats-grid" aria-label="Workspace statistics">
|
||||
<StatCard label="Projects" value="0" detail="Web, desktop and MSP" />
|
||||
<StatCard label="Active runs" value="0" detail="Harness executions" />
|
||||
<StatCard label="Pending tasks" value="0" detail="Waiting for a team" />
|
||||
<StatCard label="Deployments" value="0" detail="Preview and production" />
|
||||
</section>
|
||||
|
||||
<section className="content-grid">
|
||||
<article className="panel">
|
||||
<div className="panel-heading">
|
||||
<div>
|
||||
<p className="eyebrow">WORKSPACE</p>
|
||||
<h2>Recent projects</h2>
|
||||
</div>
|
||||
<a href="#">View all</a>
|
||||
</div>
|
||||
<div className="empty-state">
|
||||
<div>+</div>
|
||||
<h3>No projects yet</h3>
|
||||
<p>Create the first project and assign it to an AI team.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article className="panel">
|
||||
<p className="eyebrow">ACTIVITY</p>
|
||||
<h2>Harness feed</h2>
|
||||
<div className="feed-item">
|
||||
<span />
|
||||
<div>
|
||||
<strong>Platform initialized</strong>
|
||||
<p>Professional monorepo foundation is ready.</p>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
import type { NextConfig } from "next";
|
||||
|
||||
const config: NextConfig = {
|
||||
output: "standalone",
|
||||
transpilePackages: ["@aidoit/ui", "@aidoit/contracts", "@aidoit/sdk"],
|
||||
};
|
||||
|
||||
export default config;
|
||||
@@ -0,0 +1,28 @@
|
||||
{
|
||||
"name": "@aidoit/web",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --port 3000",
|
||||
"build": "next build",
|
||||
"start": "next start --port 3000",
|
||||
"lint": "next lint",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"test": "echo \"No web tests yet\""
|
||||
},
|
||||
"dependencies": {
|
||||
"@aidoit/contracts": "workspace:*",
|
||||
"@aidoit/sdk": "workspace:*",
|
||||
"@aidoit/ui": "workspace:*",
|
||||
"next": "^15.2.0",
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@aidoit/config": "workspace:*",
|
||||
"@types/node": "^22.0.0",
|
||||
"@types/react": "^19.0.0",
|
||||
"@types/react-dom": "^19.0.0",
|
||||
"typescript": "^5.8.0"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"extends": "@aidoit/config/nextjs.json",
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
Reference in New Issue
Block a user