The Appview for the kipclip.com atproto bookmarking service

Unify detail modal button colors with brand palette

Open button uses coral brand color as primary action. Share and Edit
use neutral gray outlines. URL link also uses coral instead of blue.

+7 -5
+7 -5
frontend/components/BookmarkDetail.tsx
··· 100 100 href={bookmark.subject} 101 101 target="_blank" 102 102 rel="noopener noreferrer" 103 - className="text-sm text-blue-600 hover:text-blue-800 hover:underline break-all block" 103 + className="text-sm hover:underline break-all block" 104 + style={{ color: "var(--coral)" }} 104 105 onClick={(e) => e.stopPropagation()} 105 106 > 106 107 {bookmark.subject} ··· 162 163 </div> 163 164 164 165 {/* Action buttons */} 165 - <div className="flex gap-3 pt-2"> 166 + <div className="flex gap-2.5 pt-2"> 166 167 <button 167 168 type="button" 168 169 onClick={onOpen} 169 - className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg bg-blue-50 text-blue-700 font-medium hover:bg-blue-100 transition border border-blue-200" 170 + className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg text-white font-medium hover:opacity-90 transition" 171 + style={{ backgroundColor: "var(--coral)" }} 170 172 > 171 173 <svg 172 174 className="w-4 h-4" ··· 187 189 <button 188 190 type="button" 189 191 onClick={onShare} 190 - className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg bg-emerald-50 text-emerald-700 font-medium hover:bg-emerald-100 transition border border-emerald-200" 192 + className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg text-gray-700 font-medium hover:bg-gray-100 transition border border-gray-200" 191 193 > 192 194 <svg 193 195 className="w-4 h-4" ··· 208 210 <button 209 211 type="button" 210 212 onClick={onEdit} 211 - className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg bg-amber-50 text-amber-700 font-medium hover:bg-amber-100 transition border border-amber-200" 213 + className="flex-1 flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg text-gray-700 font-medium hover:bg-gray-100 transition border border-gray-200" 212 214 > 213 215 <svg 214 216 className="w-4 h-4"