From 96dcbe426461e4b89013c9fd52c8d20f8047bbd5 Mon Sep 17 00:00:00 2001
From: Avi <avi@aiolabs.com>
Date: Tue, 1 Sep 2026 11:12:49 -0500
Subject: [PATCH] fix(polish): align HomeScreen with design system

- Remove identity card gradient (flat surface + success border per
  flat-by-default rule)
- Fix profile row border-radius from 8px to var(--radius-sm) (9px)
- Improve publication empty state: centered layout with icon + button
  instead of inline sentence
- Normalize home-identity-name font-size to 16px (matches profile-name)
- Remove redundant grid-template-columns from home-grid
---
 frontend/src/screens/HomeScreen.tsx | 15 +++++++++------
 frontend/src/styles.css             | 17 +++++++++++++----
 2 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/frontend/src/screens/HomeScreen.tsx b/frontend/src/screens/HomeScreen.tsx
index 74b6cfd..be8caad 100644
--- a/frontend/src/screens/HomeScreen.tsx
+++ b/frontend/src/screens/HomeScreen.tsx
@@ -226,13 +226,16 @@ function PublicationResult({
 }) {
   if (!lastPublish) {
     return (
-      <p className="muted">
-        You haven't published anything yet.{' '}
-        <button type="button" className="linklike" onClick={onNavigateCompose}>
+      <div className="home-publish-empty">
+        <Icon name="edit" size={20} />
+        <p className="muted">
+          You haven't published anything yet.
+        </p>
+        <Button variant="secondary" size="sm" onClick={onNavigateCompose}>
+          <Icon name="edit" size={16} />
           Compose your first note
-        </button>
-        .
-      </p>
+        </Button>
+      </div>
     );
   }
 
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 480437d..2463abd 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1408,7 +1408,6 @@ select {
 
 .home-grid {
   display: grid;
-  grid-template-columns: 1fr;
   gap: 20px;
 }
 
@@ -1481,7 +1480,7 @@ select {
   justify-content: space-between;
   gap: 20px;
   border-color: var(--success);
-  background: linear-gradient(135deg, var(--surface), var(--success-soft));
+  background: var(--surface);
 }
 
 .home-identity-content {
@@ -1511,7 +1510,7 @@ select {
 .home-identity-name {
   margin: 0 0 4px;
   color: var(--text);
-  font-size: 18px;
+  font-size: 16px;
   font-weight: 650;
 }
 
@@ -1544,7 +1543,7 @@ select {
   align-items: center;
   gap: 14px;
   padding: 8px;
-  border-radius: 8px;
+  border-radius: var(--radius-sm);
   border: 1px solid transparent;
 }
 
@@ -1583,6 +1582,16 @@ select {
   margin-top: 14px;
 }
 
+.home-publish-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 0;
+  text-align: center;
+  color: var(--text-muted);
+}
+
 .relay-status-list {
   list-style: none;
   margin: 0;