Address review: drop redundant flex on the plant seed-lot toggle

Gadfly on #105: cardActionClass now bakes in `inline-flex items-center`, so the PlantCard seed-lot toggle's own `flex items-center` conflicted (two display utilities in one plain-string className). Drop them — keep just `mr-auto gap-1.5`. Also made cardActions.ts use one consistent concatenation style instead of mixing concat + template literals. Co-Authored-By: Claude Opus 4.8 (1M context) <[email protected]> Claude-Session: https://claude.ai/code/session_01H3zbym8Doka2d7D48maSgZ
2026-07-22 09:51:21 -04:00
parent b33bdeb9ff
commit 1b4bbf0a06
2 changed files with 6 additions and 4 deletions
@@ -82,7 +82,7 @@ export function PlantCard({
        <button
          type="button"
          onClick={() => setShowLots((v) => !v)}
-          className={`${cardActionClass} mr-auto flex items-center gap-1.5`}
+          className={`${cardActionClass} mr-auto gap-1.5`}
          aria-expanded={showLots}
        >
          {lots.length === 0 ? (
@@ -7,9 +7,11 @@

 const cardActionBase =
  'inline-flex min-h-[2.5rem] items-center rounded-md px-3 py-2 text-sm font-medium ' +
-  'text-muted outline-none transition-colors focus-visible:ring-2'
+  'text-muted outline-none transition-colors focus-visible:ring-2 '

-export const cardActionClass = `${cardActionBase} hover:bg-border/50 hover:text-fg focus-visible:ring-accent/40`
+export const cardActionClass =
+  cardActionBase + 'hover:bg-border/50 hover:text-fg focus-visible:ring-accent/40'

 export const cardDangerClass =
-  `${cardActionBase} hover:bg-red-500/10 hover:text-red-600 focus-visible:ring-red-500/40 dark:hover:text-red-400`
+  cardActionBase +
+  'hover:bg-red-500/10 hover:text-red-600 focus-visible:ring-red-500/40 dark:hover:text-red-400'