Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

experimenting to improve extension (drag & tailwind) #237

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

CodeTorso
Copy link
Collaborator

@CodeTorso CodeTorso commented Aug 8, 2024

Enhancements to Extension Functionality (Drag & Tailwind)

Overview

This pull request introduces several enhancements to the extension's functionality, focusing on improving user experience through the integration of drag-and-drop capabilities and the incorporation of Tailwind CSS for improved styling.

Changes

  • New Features:

    • Implemented drag-and-drop functionality to enhance user interaction and experience.
    • Integrated Tailwind CSS to streamline the styling and layout of the extension's user interface.
    • Added support for smoother drag interactions, ensuring seamless item movement within the extension.
  • Refactoring:

    • Refactored the codebase to leverage Tailwind's utility-first approach, improving maintainability and readability.
    • Restructured the CSS codebase to utilize Tailwind's utility classes, reducing the need for custom CSS and enhancing code readability.
    • Updated the package.json file to include necessary dependencies for Tailwind CSS and the motion library, ensuring compatibility and functionality.
  • Other Changes:

    • Adjusted the styling of popover trigger buttons to improve their appearance and behavior.
    • Wrapped the main container in a draggable element, allowing users to move it around the screen easily.
    • Enhanced the overall design and responsiveness of the user interface to provide a more dynamic user experience.

✨ Generated with love by Kaizen ❤️

Original Description None

@CodeTorso CodeTorso marked this pull request as draft August 8, 2024 22:54
Copy link
Contributor

kaizen-bot bot commented Aug 8, 2024

Code Review

All Clear: This PR is ready to merge! 👍

Incorrect Usage of motion.div

The motion.div is used incorrectly without proper configuration.

Potential Solution:

Either remove the motion.div or configure it properly with animation props.

apps/extension/content/ContentApp.tsx | 265 - 265

reason_for_request: Improper use of the motion component can lead to unexpected behavior or errors.

level: [critical] , severity: [8]

✨ Generated with love by Kaizen ❤️


Useful Commands
  • Feedback: Reply with !feedback [your message]

  • Ask PR: Reply with !ask-pr [your question]

  • Review: Reply with !review

<Toaster />

<motion.div dragConstraints={drag} drag className=" absolute">HEllo therre</motion.div>
Copy link
Contributor

Choose a reason for hiding this comment

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

Comment: The motion.div is used incorrectly without proper configuration.

Solution: Either remove the motion.div or configure it properly with animation props.

Reason For Comment: Improper use of the motion component can lead to unexpected behavior or errors.

Suggested change
<motion.div dragConstraints={drag} drag className=" absolute">HEllo therre</motion.div>
// Remove or properly configure the motion.div
// <motion.div dragConstraints={drag}drag className=" absolute">Hello there</motion.div>

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

what model is this ?

@Dhravya
Copy link
Collaborator

Dhravya commented Aug 10, 2024

image

Looks great!

One small quirk: Too much inertia
if i drag and quickly move it, it will flow away

Can we try to make it more sticky/

@CodeTorso
Copy link
Collaborator Author

I made sure it, does not have momentum still will try

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.

2 participants