style: compress buildpulse mobile chrome
This commit is contained in:
+1
-1
@@ -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
@@ -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
@@ -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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user