[ffigenpad] rename to navbar

pkgs/ffigenpad/web/src/App.tsx

@@ -6,7 +6,7 @@ import dartWasm from "../../bin/ffigenpad.wasm?url";
 import createLibClang from "../../third_party/libclang/bin/libclang.mjs";
 import { BindingsViewer } from "./components/bindings-viewer";
 import { ConfigEditor } from "./components/config-editor";
-import { Header } from "./components/header";
+import { Navbar } from "./components/navbar";
 import { HeaderEditor } from "./components/header-editor";
 import { LogsViewer } from "./components/logs-viewer";
 import { Button } from "./components/ui/button";
@@ -105,7 +105,7 @@ function App() {
 
   return (
     <Flex direction="column" gap="2" height="screen">
-      <Header />
+      <Navbar />
       <Box flexGrow={1}>
         <Show
           when={!ffigenpad.loading}

pkgs/ffigenpad/web/src/components/navbar.tsx

@@ -0,0 +1,29 @@
+import { Container, Divider, Flex } from "styled-system/jsx";
+import { Heading } from "./ui/heading";
+import { Button } from "./ui/button";
+
+export const Navbar = () => {
+  return (
+    <Divider py="2">
+      <Container>
+        <Flex align="center" justify="space-between">
+          <Heading as="h1" textStyle="2xl">
+            FFIgenPad
+          </Heading>
+          <Button
+            variant="link"
+            asChild={(props) => (
+              <a
+                {...props()}
+                href="https://github.com/dart-lang/native/tree/main/pkgs/ffigen"
+                target="_blank"
+              >
+                About
+              </a>
+            )}
+          />
+        </Flex>
+      </Container>
+    </Divider>
+  );
+};