unchained/mission-control
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mobile: smaller fonts, single column, less padding

Browse Source
This commit is contained in:
Neo
2026-02-19 11:11:02 +00:00
parent f752b7a11c
commit d194771a3e
1 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
app/page.tsx
View File

@@ -77,7 +77,7 @@ export default function MissionControl() {
<header style={{ <header style={{
position: 'relative', position: 'relative',
zIndex: 10, zIndex: 10,
padding: '20px', padding: '15px',
borderBottom: '1px solid rgba(255,255,255,0.08)', borderBottom: '1px solid rgba(255,255,255,0.08)',
display: 'flex', display: 'flex',
justifyContent: 'space-between', justifyContent: 'space-between',
@@ -101,7 +101,7 @@ export default function MissionControl() {
</div> </div>
<div> <div>
<h1 style={{ <h1 style={{
fontSize: '1.5rem', fontSize: '1rem',
fontWeight: 700, fontWeight: 700,
background: 'linear-gradient(90deg, #fff 0%, #a0a0a0 100%)', background: 'linear-gradient(90deg, #fff 0%, #a0a0a0 100%)',
WebkitBackgroundClip: 'text', WebkitBackgroundClip: 'text',
@@ -147,7 +147,7 @@ export default function MissionControl() {
<main style={{ <main style={{
position: 'relative', position: 'relative',
zIndex: 10, zIndex: 10,
padding: '20px', padding: '15px',
maxWidth: '1200px', maxWidth: '1200px',
margin: '0 auto' margin: '0 auto'
}}> }}>
@@ -158,7 +158,7 @@ export default function MissionControl() {
justifyContent: 'center', justifyContent: 'center',
height: '50vh', height: '50vh',
flexDirection: 'column', flexDirection: 'column',
gap: '20px' gap: '10px'
}}> }}>
<div style={{ <div style={{
width: '60px', width: '60px',
@@ -197,7 +197,7 @@ function TasksBoard({ tasks }: { tasks: Task[] }) {
]; ];
return ( return (
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(280px, 1fr))', gap: '20px' }}> <div style={{ display: 'grid', gridTemplateColumns: '1fr', gap: '10px' }}>
{columns.map((col, i) => ( {columns.map((col, i) => (
<div <div
key={col.status} key={col.status}
@@ -333,7 +333,7 @@ function CronMonitor({ crons }: { crons: CronJob[] }) {
⏱ ⏱
</div> </div>
<div> <div>
<h2 style={{ color: '#fff', fontSize: '1.2rem' }}>System Cron Jobs</h2> <h2 style={{ color: '#fff', fontSize: '1rem' }}>System Cron Jobs</h2>
<p style={{ color: '#666', fontSize: '0.75rem' }}>{crons.length} active jobs</p> <p style={{ color: '#666', fontSize: '0.75rem' }}>{crons.length} active jobs</p>
</div> </div>
</div> </div>
@@ -411,7 +411,7 @@ function MemoryVault({ memories }: { memories: Memory[] }) {
💾 💾
</div> </div>
<div> <div>
<h2 style={{ color: '#fff', fontSize: '1.2rem' }}>Memory Vault</h2> <h2 style={{ color: '#fff', fontSize: '1rem' }}>Memory Vault</h2>
<p style={{ color: '#666', fontSize: '0.75rem' }}>{memories.length} memories stored</p> <p style={{ color: '#666', fontSize: '0.75rem' }}>{memories.length} memories stored</p>
</div> </div>
</div> </div>
@@ -435,14 +435,14 @@ function MemoryVault({ memories }: { memories: Memory[] }) {
}} }}
/> />
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(280px, 1fr))', gap: '20px' }}> <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(280px, 1fr))', gap: '10px' }}>
{filtered.map((mem, i) => ( {filtered.map((mem, i) => (
<div <div
key={mem.id} key={mem.id}
style={{ style={{
background: 'rgba(20, 20, 30, 0.6)', background: 'rgba(20, 20, 30, 0.6)',
borderRadius: '12px', borderRadius: '12px',
padding: '20px', padding: '15px',
border: '1px solid rgba(255,255,255,0.05)', border: '1px solid rgba(255,255,255,0.05)',
backdropFilter: 'blur(20px)', backdropFilter: 'blur(20px)',
transition: 'all 0.3s ease', transition: 'all 0.3s ease',
@@ -497,7 +497,7 @@ function Team() {
]; ];
return ( return (
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(280px, 1fr))', gap: '20px' }}> <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(280px, 1fr))', gap: '10px' }}>
{members.map((member, i) => ( {members.map((member, i) => (
<div <div
key={i} key={i}