website icon indicating copy to clipboard operation
website copied to clipboard

website: added social media icon on readme and footer

Open jaiakash opened this issue 10 months ago • 19 comments

Fixes #3684 Fixes #3633 Fixes #3683

Hi, I have added

  • X (twitter), Slack, YouTube and KubeFlow CNCF icon in project readme
  • New twitter icon, YouTube and LinkedIn on footer

Screenshot 1:

Screenshot 2025-02-13 at 11 43 29 PM

Screenshot 2:

Screenshot 2025-02-13 at 11 40 26 PM

jaiakash avatar Feb 13 '25 18:02 jaiakash

Hi @jaiakash. Thanks for your PR.

I'm waiting for a kubeflow member to verify that this patch is reasonable to test. If it is, they should reply with /ok-to-test on its own line. Until that is done, I will not automatically test new commits in this PR, but the usual testing commands by org members will still work. Regular contributors should join the org to skip this step.

Once the patch is verified, the new status will be reflected by the ok-to-test label.

I understand the commands that are listed here.

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

google-oss-prow[bot] avatar Feb 13 '25 18:02 google-oss-prow[bot]

Here is the final version: image

Screenshot 2025-02-19 at 2 17 50 PM

jaiakash avatar Feb 19 '25 08:02 jaiakash

/lgtm

thanks for this @jaiakash!!!

franciscojavierarceo avatar Feb 19 '25 12:02 franciscojavierarceo

I think https://github.com/kubeflow/website/pull/3998/files#r1961211039 is still open. maybe we should link both youtube channels otherwise i can approve and merge it. Please tell me if you have further objections.

juliusvonkohout avatar Feb 20 '25 10:02 juliusvonkohout

I think #3998 (files) is still open. maybe we should link both youtube channels otherwise i can approve and merge it. Please tell me if you have further objections.

@juliusvonkohout are you suggesting to add 2 youtube links? Personally i feel one is appropriate.

Moreover, the https://www.youtube.com/@KubeflowCommunity links KubeFlow main youtube, twitter and website.

Screenshot 2025-02-20 at 3 54 35 PM

jaiakash avatar Feb 20 '25 10:02 jaiakash

Then please let @andreyvelich approve, since he opened that discussion.

juliusvonkohout avatar Feb 20 '25 17:02 juliusvonkohout

It looks like formatting at the website is incorrect. @jaiakash Can you take a look please ? Screenshot 2025-02-20 at 17 08 29

andreyvelich avatar Feb 20 '25 17:02 andreyvelich

Hi @andreyvelich, I’m experiencing the same issue when using the Netlify link from the PR.

However, it works fine when I run it locally. Could you confirm if the screenshot you shared is from the Netlify test deployment for this PR?

And how can we verify the correct changes?

jaiakash avatar Feb 20 '25 17:02 jaiakash

You can check it in the Netlify preview: https://deploy-preview-3998--competent-brattain-de2d6d.netlify.app/

andreyvelich avatar Feb 20 '25 17:02 andreyvelich

Yeah i can see netlify preview, but there are differences in local preview and netflify preview. Is there some other configuration that I have to change.

https://github.com/user-attachments/assets/27c363ee-2c49-4668-91d6-4cc7b260ced4

jaiakash avatar Feb 20 '25 17:02 jaiakash

@thesuperzapper Any thoughts ?

andreyvelich avatar Feb 20 '25 17:02 andreyvelich

New changes are detected. LGTM label has been removed.

google-oss-prow[bot] avatar Feb 21 '25 05:02 google-oss-prow[bot]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: Once this PR has been reviewed and has the lgtm label, please ask for approval from andreyvelich. For more information see the Kubernetes Code Review Process.

The full list of commands accepted by this bot can be found here.

Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment Approvers can cancel approval by writing /approve cancel in a comment

google-oss-prow[bot] avatar Feb 21 '25 05:02 google-oss-prow[bot]

Here is something similar i found, https://stackoverflow.com/questions/62616990/fontawesome-icons-not-appearing-when-deploying-website-to-netlify But i don think that applies to us.

jaiakash avatar Feb 21 '25 05:02 jaiakash

ks fine when I run it locally. Could you confirm if the screenshot you shared is from the Netlify test deployment for this PR?

I'm experiencing the same using the same the source code locally and I'm not seeing https://x.com/kubeflow/ image

varodrig avatar Feb 21 '25 19:02 varodrig

thanks @jaiakash for working on this. cc @thesuperzapper to review as well.

varodrig avatar Feb 21 '25 21:02 varodrig

/hold

waiting for updates

varodrig avatar Feb 25 '25 03:02 varodrig

Hi @andreyvelich, @varodrig,

It looks like there is a version mismatch for font-awesome due to the docsy submodule we are using.
Currently, we are on docsy v0.6.0, which depends on:

  • font-awesome v6.2.0
  • hugo v0.124.1

Reference: Docsy v0.6.0 Dependencies.

To properly display the Bluesky icon, the new X (Twitter) icon, and YouTube, we need to:

  • Upgrade docsy from v0.6.0 to the latest compatible version.
  • Update the default Hugo version from 0.124.1 to 0.136.2+.
  • Update the documentation (README.md) to reflect these newer versions.
# TIP: to install hugo run the following commands
HOMEBREW_COMMIT="7b167101ab2dce314f563d372a808e4b16983d24" # 0.136.2 not 0.124.1
  • Test: layouts/partials and assets/scss code

jaiakash avatar Mar 14 '25 22:03 jaiakash

For now, I think we have two action items to address this:

  1. Add temporary static assets for X, Bluesky, and YouTube in the website footer so they display correctly.
  2. Create a new issue to upgrade docsy to the latest version. This should include regression testing of all pages on the new version by the community. (I'm happy to help with this!)
  3. Once docsy is upgraded, remove the temporary static icons and switch to font-awesome logos.

Also from discussions in https://github.com/kubeflow/website/issues/3954 and https://github.com/kubeflow/website/issues/3629, especially comment from https://github.com/kubeflow/website/issues/3954#issuecomment-2590582428, I think 1 would be the way to solve this ( https://github.com/kubeflow/website/issues/3684 https://github.com/kubeflow/website/issues/3633 https://github.com/kubeflow/website/issues/3683) as of now.

Still, we can decide the priority order based on whether we want the icons/links in the footer immediately or if we should upgrade docsy first before displaying them properly.

Let me know your thoughts! 🚀

jaiakash avatar Mar 14 '25 22:03 jaiakash

Hey @jaiakash, can you add static assets for those icons and use them? We can’t upgrade Docsy, especially after what was done in https://github.com/kubeflow/website/pull/3981.

milinddethe15 avatar Apr 06 '25 05:04 milinddethe15

can you add static assets for those icons and use them?

Alt, easiest way can be: load font-awesome using CDN link

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/fontawesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/brands.min.css">

milinddethe15 avatar Apr 09 '25 09:04 milinddethe15

Thanks @milinddethe15, The PR history is messed up. I will recreate this PR.

jaiakash avatar Apr 10 '25 21:04 jaiakash