personal memory agent
Merge branch 'hopper-jvzcgk7i-todos-visual-contrast'
+27
-6
+27
-6
apps/todos/workspace.html
+27
-6
apps/todos/workspace.html
···
105
105
.todo-checkbox {
106
106
width: 1.25rem;
107
107
height: 1.25rem;
108
-
accent-color: var(--facet-color, #b06a1a);
108
+
appearance: none;
109
+
-webkit-appearance: none;
110
+
border: 1.5px solid #9ca3af;
111
+
border-radius: 3px;
112
+
background: #fff;
113
+
cursor: pointer;
114
+
}
115
+
116
+
.todo-checkbox:checked {
117
+
background-color: var(--facet-color, #b06a1a);
118
+
border-color: var(--facet-color, #b06a1a);
119
+
}
120
+
121
+
.todo-checkbox:checked::after {
122
+
content: '';
123
+
display: block;
124
+
width: 5px;
125
+
height: 9px;
126
+
margin: 1px auto 0;
127
+
border: solid #fff;
128
+
border-width: 0 2px 2px 0;
129
+
transform: rotate(45deg);
109
130
}
110
131
111
132
.todo-checkbox-target {
112
133
display: inline-flex;
113
134
align-items: center;
114
135
justify-content: center;
115
-
margin-top: -1px;
136
+
margin-top: 0;
116
137
min-width: 2.75rem;
117
138
min-height: 2.75rem;
118
139
flex-shrink: 0;
···
180
201
181
202
.todo-actions {
182
203
display: flex;
183
-
gap: 0.25rem;
204
+
gap: 0.375rem;
184
205
flex-shrink: 0;
185
206
margin-left: auto;
186
207
opacity: 0;
···
202
223
border: none;
203
224
border-radius: 4px;
204
225
background: transparent;
205
-
color: #6b7280;
226
+
color: #4b5563;
206
227
cursor: pointer;
207
228
transition: background 0.15s, color 0.15s;
208
229
}
···
293
314
min-width: 0;
294
315
margin-left: 3.25rem;
295
316
padding: 0.375rem 0.5rem;
296
-
border: 1px solid transparent;
317
+
border: 1px solid #e5e7eb;
297
318
border-radius: 4px;
298
319
font-size: 0.9rem;
299
320
color: #111827;
300
-
background: transparent;
321
+
background: #fafbfc;
301
322
outline: none;
302
323
transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
303
324
}