style: compress buildpulse mobile chrome

This commit is contained in:
OpenClaw Bot
2026-05-12 23:43:27 +02:00
parent 223d9325a1
commit f09da97163
3 changed files with 126 additions and 5 deletions
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"name": "buildpulse", "name": "buildpulse",
"private": true, "private": true,
"version": "0.4.5", "version": "0.4.6",
"type": "module", "type": "module",
"scripts": { "scripts": {
"api": "node --env-file=../.env server/index.mjs", "api": "node --env-file=../.env server/index.mjs",
+4 -4
View File
@@ -1580,7 +1580,7 @@ function App() {
<div className="app-shell"> <div className="app-shell">
<header className="mobile-shell-header card"> <header className="mobile-shell-header card">
<div> <div>
<p className="eyebrow">BuildPulse v0.4.5</p> <p className="eyebrow">BuildPulse v0.4.6</p>
<h1>BuildPulse</h1> <h1>BuildPulse</h1>
<p className="hero-goal compact-goal"> <p className="hero-goal compact-goal">
<strong>Current goal:</strong> {appState.project.current_goal || 'Classify new ideas before they become work.'} <strong>Current goal:</strong> {appState.project.current_goal || 'Classify new ideas before they become work.'}
@@ -1589,8 +1589,8 @@ function App() {
<div className="top-status-row"> <div className="top-status-row">
<span className={`status-dot ${backendMode === 'appwrite' ? 'healthy' : backendMode === 'connecting' ? 'connecting' : 'degraded'}`} aria-hidden="true" /> <span className={`status-dot ${backendMode === 'appwrite' ? 'healthy' : backendMode === 'connecting' ? 'connecting' : 'degraded'}`} aria-hidden="true" />
<span>{backendMode === 'appwrite' ? 'Live' : backendMode === 'connecting' ? 'Syncing' : 'Local'}</span> <span>{backendMode === 'appwrite' ? 'Live' : backendMode === 'connecting' ? 'Syncing' : 'Local'}</span>
<button type="button" className="ghost small" onClick={() => setActiveTab('status')}> <button type="button" className="ghost small" aria-label="Open system status" onClick={() => setActiveTab('status')}>
System Status Status
</button> </button>
</div> </div>
</header> </header>
@@ -2502,7 +2502,7 @@ function App() {
aria-controls="today-command-drawer" aria-controls="today-command-drawer"
onClick={() => setTodayCommandDrawerOpen((current) => !current)} onClick={() => setTodayCommandDrawerOpen((current) => !current)}
> >
{todayCommandDrawerOpen ? 'Hide commands' : 'Commands'} {todayCommandDrawerOpen ? 'Hide' : 'More'}
</button> </button>
</div> </div>
+121
View File
@@ -3109,3 +3109,124 @@ button.ghost,
border: 1px solid rgba(125, 211, 252, 0.34); border: 1px solid rgba(125, 211, 252, 0.34);
} }
} }
/* v0.4.6 — compress mobile top chrome and give edge controls breathing room. */
@media (max-width: 760px) {
.app-shell {
width: min(100% - 1rem, 100%);
padding-top: 0.28rem;
}
.mobile-shell-header.card {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: end;
gap: 0.5rem;
padding: 0.18rem 0.1rem 0.05rem;
}
.mobile-shell-header .eyebrow {
margin-bottom: 0.05rem;
font-size: 0.56rem;
letter-spacing: 0.14em;
}
.mobile-shell-header h1 {
font-size: 1.32rem;
line-height: 0.9;
}
.compact-goal {
max-width: 34ch;
-webkit-line-clamp: 1;
margin-top: 0.12rem;
font-size: 0.7rem;
line-height: 1.2;
}
.top-status-row {
justify-self: end;
width: auto;
gap: 0.28rem;
padding: 0.24rem 0.34rem;
font-size: 0.67rem;
}
.top-status-row .ghost.small {
padding: 0.16rem 0.28rem;
font-size: 0.64rem;
}
.tab-bar {
margin-top: 0.32rem;
}
.today-card > .section-heading {
padding-top: 0.45rem;
}
.today-command-bar {
gap: 0.5rem;
padding-inline: 0.08rem;
}
.today-primary-command {
min-height: 2.68rem;
}
.today-drawer-toggle {
min-width: 4.25rem;
padding-inline: 0.44rem;
}
.feature-column-details summary {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 0.65rem;
align-items: center;
padding-right: 0.18rem;
}
.feature-column-details summary::after {
min-width: 3.2rem;
text-align: right;
font-size: 0.58rem;
letter-spacing: 0.08em;
}
.feature-column-details[open] summary::after {
content: 'Fold';
}
.feature-column-details:not([open]) summary::after {
content: 'Open';
}
}
/* v0.4.6a — keep the compact controls readable, not cramped. */
@media (max-width: 760px) {
.today-drawer-toggle {
min-width: 4.95rem;
font-size: 0.78rem;
}
.today-primary-command {
font-size: 0.94rem;
}
.pill,
.tap-chip {
white-space: nowrap;
font-size: 0.62rem;
line-height: 1;
padding: 0.18rem 0.38rem;
}
.item-card-header {
align-items: flex-start;
}
.item-card-header .pill {
flex: 0 0 auto;
}
}