Od ZIP-a do produkcji

Panel hostingu i domen dla agencji i franczyzobiorców.
Wgraj stronę, opublikuj podgląd, podepnij domenę.
Dostęp dla zaproszonych franczyzobiorców i zespołu agencji. Konto wymaga akceptacji admina.
<!DOCTYPE html>
<html lang="pl">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>firma.pl — Witamy na stronie firmowej</title>
    <link rel="stylesheet" href="/assets/styles.css" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
  </head>
  <body class="theme-light" data-page="home">
    <header class="nav" role="banner">
      <a href="/" class="logo" aria-label="Strona główna">Firma</a>
      <nav aria-label="Główne">
        <a href="/oferta">Oferta</a>
        <a href="/projekty">Projekty</a>
        <a href="/o-nas">O nas</a>
        <a href="/kontakt">Kontakt</a>
      </nav>
      <a class="btn btn-sm" href="/kontakt">Zapytaj o wycenę</a>
    </header>
    <main id="content">
      <section class="hero">
        <p class="kicker">Architekci Biznesu</p>
        <h1>Witaj na stronie — budujemy marki, które sprzedają</h1>
        <p class="lede">Treść gotowa do publikacji. Podgląd, domena, DNS i SSL w jednym panelu.</p>
        <div class="hero-actions">
          <a class="btn" href="/kontakt">Napisz do nas</a>
          <a class="btn-ghost" href="/oferta">Zobacz ofertę</a>
        </div>
      </section>
      <section class="grid features">
        <article>
          <h2>Usługi</h2>
          <p>Strategia, branding, strony i kampanie pod jedną marką.</p>
        </article>
        <article>
          <h2>Projekty</h2>
          <p>Wybrane realizacje dla franczyz i lokalnych biznesów.</p>
        </article>
        <article>
          <h2>Zespół</h2>
          <p>Poznaj ludzi za marką — projektanci, dev, account.</p>
        </article>
      </section>
      <section class="cta">
        <h2>Gotowi na start?</h2>
        <p>Wgraj stronę, opublikuj podgląd, podepnij domenę.</p>
        <a class="btn" href="/kontakt">Umów rozmowę</a>
      </section>
    </main>
    <footer class="site-footer">
      <p>© 2026 firma.pl · Wszystkie prawa zastrzeżone</p>
      <nav>
        <a href="/polityka">Polityka prywatności</a>
        <a href="/cookies">Cookies</a>
        <a href="/kontakt">Kontakt</a>
      </nav>
    </footer>
    <script type="module" src="/assets/app.js"></script>
  </body>
</html>

/* /assets/styles.css — design tokens + layout */
:root {
  --bg: #fafafa;
  --surface: #f4f4f6;
  --ink: #0a0a0b;
  --muted: #52525b;
  --accent: #5a189a;
  --accent-hover: #7b2cbf;
  --radius: 10px;
  --font-sans: Inter, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.5;
}
.nav {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #e4e4e7;
}
.hero { padding: 4.5rem 1.5rem 3rem; max-width: 720px; }
.hero h1 { font-size: 2.5rem; letter-spacing: -0.03em; line-height: 1.15; }
.btn {
  display: inline-flex;
  background: var(--accent);
  color: #fff;
  padding: 0.75rem 1.25rem;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 500;
}
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  padding: 2rem 1.5rem 4rem;
}

// hostpanel · deploy pipeline
import { deploy, attachDomain } from "@hostpanel/sdk"

const site = {
  id: "prj_firma_01",
  url: "https://firma.pl",
  preview: "https://firma.hostpanel.app",
  ssl: true,
  dns: ["A", "MX", "TXT"],
  status: "live",
}

export async function publish(projectId: string) {
  const build = await deploy({ projectId, branch: "main" })
  if (!build.ok) throw new Error(build.error)
  await attachDomain({ projectId, domain: "firma.pl" })
  return { ok: true, url: site.url }
}

export async function syncDns(domain: string) {
  return { domain, records: site.dns, verified: true }
}
firma.pl