diff --git a/site/README.md b/site/README.md index 20b6107..0d6ce36 100644 --- a/site/README.md +++ b/site/README.md @@ -1,6 +1,6 @@ # devloop site -Minimal static marketing site for the `devloop` CLI. Single page, monochrome +Minimal static landing site for the `devloop` CLI. Single page, monochrome teletype aesthetic, violet accent matching the CLI brand. No runtime dependencies: Tailwind compiled to static CSS, JetBrains Mono self-hosted from `public/fonts/` (OFL, weights 400 + 700), used across the whole page. Built with diff --git a/site/index.html b/site/index.html index 3b0ce99..de513fd 100644 --- a/site/index.html +++ b/site/index.html @@ -11,7 +11,7 @@ - +
+ +
+ BLOG + GITHUB +
-
+ 
                             Spec-driven code/review loop that runs until all
-                            acceptance criteria are met and bugs fixed.
+                            acceptance criteria are met and bugs fixed by agents.
                         

 
                         

                         

-                        

+                        

                             Requires Codex and Claude Code. Runs on macOS.
- +
-
+
+ + +
@@ -119,15 +137,19 @@

## WHY

-

+

Developers now spend most of their time in code review, assisted by coding agents. But the same - model family can't both code and review. It favors - its own outputs. Devloop makes Codex implement and + model family can't both code and review. It + favors its own outputs. Devloop makes Codex implement and Claude Code review adversarially (or vice versa), until all criteria are met and reviews addressed, so - humans only come in where judgment pays off: the - spec and PR sign-off. + humans only come in where judgment pays off: at the + spec and PR sign-off stages.

@@ -139,7 +161,7 @@

>HOW IT WORKS

-
    +
    • -
      -
      -

      When to use

      -
        +
        +

        When to use

        +
          • -
        -
        -
        -

        When not to use

        -
          +
        +

        When not to use

        +
          • -
        -
        +
      @@ -274,7 +292,7 @@

      ## FAQ

      -
      +
- - -
@@ -440,6 +434,40 @@

}); }); })(); + + // demo video: controls on hover/focus/touch, play button while paused + (() => { + const video = document.getElementById("demo"); + const playBtn = document.getElementById("demo-play"); + if (!video || !playBtn) return; + const figure = video.closest("figure"); + const coarse = window.matchMedia( + "(hover: none), (pointer: coarse)", + ); + + const syncControls = () => { + video.controls = + coarse.matches || + figure.matches(":hover") || + figure.contains(document.activeElement); + }; + ["mouseenter", "mouseleave", "focusin", "focusout"].forEach( + (e) => figure.addEventListener(e, syncControls), + ); + if (coarse.addEventListener) { + coarse.addEventListener("change", syncControls); + } else { + coarse.addListener(syncControls); + } + syncControls(); + + const syncPlayBtn = () => + playBtn.classList.toggle("hidden", !video.paused); + video.addEventListener("play", syncPlayBtn); + video.addEventListener("pause", syncPlayBtn); + playBtn.addEventListener("click", () => video.play()); + syncPlayBtn(); + })(); diff --git a/site/package.json b/site/package.json index 83e7a76..6272c4b 100644 --- a/site/package.json +++ b/site/package.json @@ -3,7 +3,7 @@ "version": "0.2.0", "private": true, "type": "module", - "description": "Static marketing site for the devloop CLI.", + "description": "Static landing site for the devloop CLI.", "scripts": { "dev": "vite", "build": "vite build", diff --git a/site/src/input.css b/site/src/input.css index 0c0cc27..fc51c4f 100644 --- a/site/src/input.css +++ b/site/src/input.css @@ -25,12 +25,12 @@ --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", "SFMono-Regular", "Menlo", "Cascadia Code", "Consolas", "Liberation Mono", monospace; - --color-bg: #070708; - --color-panel: #0e0e10; - --color-line: #1b1b1f; - --color-ink: #e8e8ea; - --color-dim: #7e7e86; - --color-faint: #4a4a51; + --color-bg: #121212; + --color-panel: #1c1c1c; + --color-line: #2a2a2a; + --color-ink: #ededec; + --color-dim: #a3a3a3; + --color-faint: #6b6b6b; --color-violet: #af87ff; --color-violet-bright: #d2a8ff; @@ -55,7 +55,7 @@ } ::selection { background: var(--color-violet); - color: #070708; + color: #121212; } code { background: var(--color-panel);