Skip to content

fix: replace gradient with flat bg on chat shortcut buttons to fix hover jump#3975

Open
devin-ai-integration[bot] wants to merge 1 commit intomainfrom
devin/1771098421-fix-chat-shortcut-hover-jump
Open

fix: replace gradient with flat bg on chat shortcut buttons to fix hover jump#3975
devin-ai-integration[bot] wants to merge 1 commit intomainfrom
devin/1771098421-fix-chat-shortcut-hover-jump

Conversation

@devin-ai-integration
Copy link
Contributor

@devin-ai-integration devin-ai-integration bot commented Feb 14, 2026

Summary

Replaces bg-linear-to-b from-white to-stone-50 hover:from-neutral-50 hover:to-stone-100 with bg-white hover:bg-neutral-100 on the three chat empty-state buttons ("Open AI Settings", "Shortcuts", "Prompts").

In Tailwind v4, transition-colors includes --tw-gradient-from and --tw-gradient-to (registered as <color>, animatable) in the transition list, but --tw-gradient-stops is registered as * (not animatable). This mismatch causes the gradient stops to snap while color vars transition, producing a visible jump on hover.

Switching to a flat background color eliminates the gradient/transition conflict. The original gradient (white → stone-50) was nearly invisible anyway.

Review & Testing Checklist for Human

  • Visually verify the buttons don't jump on hover in the actual desktop app — this fix was not tested in the running Tauri app, only analyzed from CSS output
  • Confirm the flat bg-white hover:bg-neutral-100 looks acceptable — the original was a subtle gradient; the new flat style is slightly different visually
  • Note: the same gradient+transition pattern exists on similar buttons elsewhere (e.g. advanced-search/view.tsx). If those also jump, they'd need the same treatment in a follow-up.

Notes


Open with Devin

…ver jump

Co-Authored-By: artem@hyprnote.com <thestua@gmail.com>
@netlify
Copy link

netlify bot commented Feb 14, 2026

Deploy Preview for hyprnote-storybook canceled.

Name Link
🔨 Latest commit 08be738
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote-storybook/deploys/6990d1e1d215e000088b16cc

@netlify
Copy link

netlify bot commented Feb 14, 2026

Deploy Preview for hyprnote canceled.

Name Link
🔨 Latest commit 08be738
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote/deploys/6990d1e172f90e000852e921

@devin-ai-integration
Copy link
Contributor Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR that start with 'DevinAI' or '@devin'.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment and CI monitoring

Copy link
Contributor Author

@devin-ai-integration devin-ai-integration bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Devin Review: No Issues Found

Devin Review analyzed this PR and found no bugs or issues to report.

Open in Devin Review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

0 participants