Implemented sliding animation for the adopter logos #5878
Conversation
added sliding animation to adopter logos some cleanup
|
Welcome @prajjwalyd! It looks like this is your first PR to knative/docs 🎉 |
knative-prow
bot
added
the
size/L
✅ Deploy Preview for knative ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
There was a problem hiding this comment.
Thanks @prajjwalyd this looks great already!
I added some comments inline.
I just realized something though. If we add the adopters too (on top of current list of vendors), we might need a 2nd row. Ideally scrolling in the opposite direction, like CNCF does.
What do you think?
overrides/home.html
Outdated
| const adopters = [ | ||
| { logoPath: "images/corporate-logos/Google.svg", url: "https://www.google.com" }, | ||
| { logoPath: "images/corporate-logos/vmware.svg", url: "https://www.vmware.com" }, | ||
| { logoPath: "images/corporate-logos/IBM.svg", url: "https://www.ibm.com" }, | ||
| { logoPath: "images/corporate-logos/Redhat.svg", url: "https://www.redhat.com" }, | ||
| { logoPath: "images/corporate-logos/triggermesh_logo.svg", url: "https://www.triggermesh.com" } | ||
|
|
||
| ]; |
There was a problem hiding this comment.
Can you also add the adopters here?
https://github.com/knative/community/blob/main/ADOPTERS.MD
Unfortunately, we don't have their logos handy :(
There was a problem hiding this comment.
And, can you make the whole list randomized? Not statically randomized, but randomized in the runtime?
I mean, it would be nice if we see the adopters+vendors in random order every time we refresh this page.
There was a problem hiding this comment.
We should drop trigger mesh - they're no longer in business
There was a problem hiding this comment.
The latest changes are as follows:
- Added more corporate logos by following - https://github.com/knative/community/blob/main/ADOPTERS.MD
- Mixed the adopters and vendors under the 'Trusted by' heading.
- Added a second row that scrolls to the right.
- Randomized the logo display order on each refresh.
- Dropped Trigger mesh.
There was a problem hiding this comment.
The current list is not yet fully completed, and there are some aspect ratio and styling fixes needed for certain images...
however, the logic has been implemented, and we simply need to continue adding the remaining logos and links to the list.
Let me know if this approach seems acceptable, and then I can proceed with the final styling adjustments!
There was a problem hiding this comment.
Looks great!
As you said, some images need some work (aspect ratio, whitespace padding), but the overall logic looks good to me.
Special thanks for keeping the commit history clean!
I just noticed that padding is a little bit too much on mobile screens, but that's another story. Our website is not properly responsive.
knative-prow
bot
added
size/XXL
|
/lgtm Thanks a lot @prajjwalyd As we talked in Slack, can you create a ticket for the missing logos? |
|
[APPROVALNOTIFIER] This PR is APPROVED This pull-request has been approved by: aliok, prajjwalyd The full list of commands accepted by this bot can be found here. The pull request process is described here
Needs approval from an approver in each of these files:
Approvers can indicate their approval by writing |
knative-prow
bot
added
the
approved
* added sliding animation to adopter logos added sliding animation to adopter logos some cleanup * added some more corporate logos * added a second row of adopters * added/updated corporate logos and adjusted their styling
Addresses - knative/community#1416
Proposed Changes
I've been working on implementing the sliding animation for the adopters' logos.
scrnli_2_19_2024_1-16-44.AM.webm
I haven't used any external libraries for this...
Also, the logos along with their links are dynamically rendered as per the instructions.
Public preview link: https://prajjwalyd.github.io/docs/