UI: align home-screen widget and TaskRow with the palette tokens
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -101,7 +101,7 @@ const s = StyleSheet.create({
|
|||||||
justifyContent: "center",
|
justifyContent: "center",
|
||||||
},
|
},
|
||||||
checkboxDone: { backgroundColor: C.done },
|
checkboxDone: { backgroundColor: C.done },
|
||||||
check: { color: "#FFFFFF", fontSize: 13, lineHeight: 16, fontWeight: "700" },
|
check: { color: C.onAccent, fontSize: 13, lineHeight: 16, fontWeight: "700" },
|
||||||
title: { ...type.row, color: C.text },
|
title: { ...type.row, color: C.text },
|
||||||
titleDone: { color: C.muted, textDecorationLine: "line-through" },
|
titleDone: { color: C.muted, textDecorationLine: "line-through" },
|
||||||
meta: { ...type.meta, color: C.muted, marginTop: 3 },
|
meta: { ...type.meta, color: C.muted, marginTop: 3 },
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
// Built only from react-native-android-widget primitives (no RN views, no
|
// Built only from react-native-android-widget primitives (no RN views, no
|
||||||
// hooks) — it renders to Android RemoteViews in a headless task.
|
// hooks) — it renders to Android RemoteViews in a headless task.
|
||||||
//
|
//
|
||||||
// Interactions mirror the app: tap the circle to complete, tap the row to
|
// Interactions mirror the app: tap the checkbox to complete, tap the row to
|
||||||
// open Clarify, tap + to capture, tap anywhere else to open the app.
|
// open Clarify, tap + to capture, tap anywhere else to open the app.
|
||||||
import { FlexWidget, TextWidget } from "react-native-android-widget";
|
import { FlexWidget, TextWidget } from "react-native-android-widget";
|
||||||
import { dueMeta, type DueTone } from "../lib/dates";
|
import { dueMeta, type DueTone } from "../lib/dates";
|
||||||
@@ -31,7 +31,7 @@ function Row({ task }: { task: Task }) {
|
|||||||
style={{ width: 32, height: 32, alignItems: "center", justifyContent: "center" }}
|
style={{ width: 32, height: 32, alignItems: "center", justifyContent: "center" }}
|
||||||
>
|
>
|
||||||
<FlexWidget
|
<FlexWidget
|
||||||
style={{ width: 19, height: 19, borderRadius: 10, borderWidth: 2, borderColor: PRIORITY_COLOR[task.priority] }}
|
style={{ width: 19, height: 19, borderRadius: 6, borderWidth: 2, borderColor: PRIORITY_COLOR[task.priority] }}
|
||||||
/>
|
/>
|
||||||
</FlexWidget>
|
</FlexWidget>
|
||||||
<FlexWidget style={{ flex: 1, marginLeft: 6 }}>
|
<FlexWidget style={{ flex: 1, marginLeft: 6 }}>
|
||||||
@@ -60,7 +60,7 @@ export function NextUpWidget({ tasks, totalNext, overdueCount }: { tasks: Task[]
|
|||||||
style={{ width: "match_parent", flexDirection: "row", alignItems: "center", justifyContent: "space-between", marginBottom: 4 }}
|
style={{ width: "match_parent", flexDirection: "row", alignItems: "center", justifyContent: "space-between", marginBottom: 4 }}
|
||||||
>
|
>
|
||||||
<FlexWidget style={{ flexDirection: "row", alignItems: "center" }}>
|
<FlexWidget style={{ flexDirection: "row", alignItems: "center" }}>
|
||||||
<TextWidget text="NEXT UP" style={{ fontSize: 12, letterSpacing: 1, color: C.muted }} />
|
<TextWidget text="Next up" style={{ fontSize: 13, fontWeight: "600", letterSpacing: 0.3, color: C.textSecondary }} />
|
||||||
{totalNext > tasks.length && (
|
{totalNext > tasks.length && (
|
||||||
<TextWidget text={` +${totalNext - tasks.length} more`} style={{ fontSize: 12, color: C.muted }} />
|
<TextWidget text={` +${totalNext - tasks.length} more`} style={{ fontSize: 12, color: C.muted }} />
|
||||||
)}
|
)}
|
||||||
@@ -79,7 +79,7 @@ export function NextUpWidget({ tasks, totalNext, overdueCount }: { tasks: Task[]
|
|||||||
accessibilityLabel="Add task"
|
accessibilityLabel="Add task"
|
||||||
style={{ width: 28, height: 28, borderRadius: 14, backgroundColor: C.accent, alignItems: "center", justifyContent: "center" }}
|
style={{ width: 28, height: 28, borderRadius: 14, backgroundColor: C.accent, alignItems: "center", justifyContent: "center" }}
|
||||||
>
|
>
|
||||||
<TextWidget text="+" style={{ fontSize: 16, color: "#FFFFFF" }} />
|
<TextWidget text="+" style={{ fontSize: 16, color: C.onAccent }} />
|
||||||
</FlexWidget>
|
</FlexWidget>
|
||||||
</FlexWidget>
|
</FlexWidget>
|
||||||
{tasks.length === 0 ? (
|
{tasks.length === 0 ? (
|
||||||
|
|||||||
Reference in New Issue
Block a user