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

[Animation] Add animation to "Manage your Cloud Native mess" section on homepage #5513

Open
ritiksaxena124 opened this issue May 2, 2024 · 8 comments · May be fixed by #5581
Open

[Animation] Add animation to "Manage your Cloud Native mess" section on homepage #5513

ritiksaxena124 opened this issue May 2, 2024 · 8 comments · May be fixed by #5581
Assignees
Labels
component/ui Issues related to UI good first issue Good for newcomers kind/enhancement New feature or request

Comments

@ritiksaxena124
Copy link
Contributor

Current Behavior

The integrations shown inside the section are static, There is no animation
image

Desired Behavior

Add animation such that the integrations integrations at the first column move in a downward direction and integrations in the second column move upward direction infinitely.


Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

Join the Layer5 Community by submitting your community member form.

@ritiksaxena124 ritiksaxena124 added kind/enhancement New feature or request good first issue Good for newcomers component/ui Issues related to UI labels May 2, 2024
Copy link

github-actions bot commented May 2, 2024

This issue has been labeled with 'component/ui'. 🧰 Here are docs on Contributing to Meshery UI. 🎨 Here is the Meshery UI Figma File File. Lastly, here are docs on Contributing to Meshery's End-to-End Tests Using Cypress.


        Be sure to join the community, if you haven't yet and please leave a ⭐ star on the project 😄

1 similar comment
Copy link

github-actions bot commented May 2, 2024

This issue has been labeled with 'component/ui'. 🧰 Here are docs on Contributing to Meshery UI. 🎨 Here is the Meshery UI Figma File File. Lastly, here are docs on Contributing to Meshery's End-to-End Tests Using Cypress.


        Be sure to join the community, if you haven't yet and please leave a ⭐ star on the project 😄

@JonathanKoerber
Copy link

Hi this looks like a interesting could I be assigned to this issue?

@ritiksaxena124
Copy link
Contributor Author

Sure @JonathanKoerber go ahead 👍

@JonathanKoerber
Copy link

Hi, making progress but don't quite have it figured out. Should be able to be done my the end of this week.

@sudhanshutech
Copy link
Member

@hargunkaur286

@JonathanKoerber
Copy link

Hi @sudhanshutech and @ritiksaxena124 I have made the animation. To make it visible there is a check that I've disabled. Am I Ok to disable the ckeck. It seem to check if the images are inside the screen with this import { useInView } from "react-intersection-observer".

layer5-animation

Please let me know what I should do.

@JonathanKoerber
Copy link

For more context this is the check that I've disabled. Its seems to be an external library.

Screenshot from 2024-06-12 19-39-09

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component/ui Issues related to UI good first issue Good for newcomers kind/enhancement New feature or request
Development

Successfully merging a pull request may close this issue.

3 participants