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

KBHBIB-24 Share buttons on material #1587

Open
wants to merge 8 commits into
base: develop
Choose a base branch
from

Conversation

JacobArrow
Copy link
Contributor

@JacobArrow JacobArrow commented Dec 9, 2024

Link to issue

https://reload.atlassian.net/browse/KBHBIB-24

Description

  • Added new share button component with link to Facebook sharer and copy to clipboard buttons
  • Added share component to material description

Screenshot of the result

image
image

Test

https://varnish.pr-1851.dpl-cms.dplplat01.dpl.reload.dk/

To leverage the advantages of ´svg´ in the DOM and to change the color on hover, we need to have it as a component. This would not be possible with an `img` tag
@JacobArrow JacobArrow changed the title KBHBIB-24-material-share-buttons KBHBIB-24 Share buttons on material Dec 10, 2024
@JacobArrow JacobArrow marked this pull request as ready for review December 10, 2024 15:52
Copy link
Contributor

@kasperbirch1 kasperbirch1 left a comment

Choose a reason for hiding this comment

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

Great work on this feature! I have a few comments for you to consider.

I also agree with you that it’s important to make a ticket for how our “cards” appear when shared on platforms like Facebook.

https://orcascan.com/tools/open-graph-validator?url=https%3A%2F%2Fbibliotek.kk.dk%2Fwork%2Fwork-of%3A870970-basis%3A25245784%3Ftype%3Dbog

src/components/button-share/button-share.tsx Outdated Show resolved Hide resolved
src/components/button-share/button-share.tsx Show resolved Hide resolved
src/components/button-share/facebook-icon.tsx Show resolved Hide resolved
@@ -0,0 +1,23 @@
import React from "react";
Copy link
Contributor

Choose a reason for hiding this comment

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

Icons should live in the design system and be used like this:
import ExpandMoreIcon from "@danskernesdigitalebibliotek/dpl-design-system/build/icons/collection/ExpandMore.svg";

Copy link
Contributor Author

@JacobArrow JacobArrow Dec 13, 2024

Choose a reason for hiding this comment

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

How would you go around rendering an SVG without an img tag this way?

JacobArrow and others added 3 commits December 11, 2024 13:29
…hen the user has scrolled past the share buttons.

This is because we don't want to show the fixed share buttons in the footer
@JacobArrow JacobArrow force-pushed the KBHBIB-24-material-share-buttons branch from 6ac1175 to 230f95d Compare December 12, 2024 15:35
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.

3 participants