diff --git a/src/dev/components.tsx b/src/dev/components.tsx
index 2c9dbcdc..87c80d19 100644
--- a/src/dev/components.tsx
+++ b/src/dev/components.tsx
@@ -19,9 +19,9 @@ export function App(props: AppProps) {
const { baseUrl, frame, routes, state } = props
return (
-
)
@@ -339,9 +339,7 @@ async function Inspector(props: InspectorProps) {
)
}
-type HeaderProps = {}
-
-function Header(_props: HeaderProps) {
+function Footer() {
return (
𝑭𝒂𝒓𝒄
@@ -437,6 +435,15 @@ export function DevStyles() {
background: var(--bg);
}
+ a:focus-visible,
+ button:focus-visible,
+ div:focus-visible,
+ input:focus-visible,
+ pre:focus-visible {
+ box-shadow: 0 0 0 2px rgba(0, 125, 255, 0.8);
+ outline: none;
+ }
+
pre {
margin: 0;
--shiki-dark-bg: transparent !important;
@@ -500,7 +507,7 @@ export function DevStyles() {
input::placeholder {
opacity: 1;
- color: #9ca3af;
+ color: var(--fg2);
}
:disabled {
diff --git a/src/farc.tsx b/src/farc.tsx
index 07f9f515..1f98aee3 100644
--- a/src/farc.tsx
+++ b/src/farc.tsx
@@ -108,6 +108,19 @@ export class Farc<
/>
)}
+
+
+ view 𝒇𝒓𝒂𝒎𝒆
+
+