Skip to content

[FEATURE] Add Hover Effect to "Try demo" Button #52

@sanchitc05

Description

@sanchitc05

Is your feature request related to a problem? Please describe.
The "Try demo" button on the homepage currently doesn't provide visual feedback when a user's cursor hovers over it. This lack of interactivity can make the user experience feel less polished and may not clearly communicate that the button is clickable.

Describe the solution you'd like
I'd like to see a simple, clear hover effect added to the "Try demo" button. A subtle change in background color, a slight increase in size, or a minor shadow would all be effective ways to show the button is interactive.

Describe alternatives you've considered
I haven't considered any alternatives, as a hover effect is the standard and most direct way to solve this UX issue for a button.

Use Case

  • Who would use this feature? All users visiting the OptiBlogAi homepage.
  • How would it improve the OptiBlogAi experience? It would make the website feel more modern and responsive, improving the overall user experience.
  • What problem does it solve? It addresses the lack of visual feedback on a primary call-to-action button, ensuring users are confident that the element is clickable.

Feature Category

  • Content Generation
  • SEO Optimization
  • Scraping & Research
  • Quality Assessment
  • API & Integration
  • User Interface
  • Performance
  • Documentation
  • Other: [specify]

Implementation Suggestions
This can be implemented with standard CSS using the :hover pseudo-class. For example, a style similar to this could be applied:

.demo-button:hover {
  background-color: #555;
  transform: scale(1.05);
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

Priority

  • Critical - Blocking my use of OptiBlogAi
  • High - Would significantly improve my workflow
  • Medium - Nice to have
  • Low - Minor improvement

Additional context
This is a minor but important detail that contributes to the overall polish of the front-end. It would be a great task for new contributors looking to get familiar with the codebase.

Related Issues

  • Fixes #
  • Related to #
  • Depends on #

Checklist

  • I have searched for existing feature requests
  • I have provided clear use cases and benefits
  • I have considered implementation challenges
  • This feature aligns with OptiBlogAi's goals and scope

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions