Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Make TintableSvg links behave like normal image links #1611

Merged
merged 6 commits into from
Nov 15, 2017

Conversation

rxl881
Copy link
Contributor

@rxl881 rxl881 commented Nov 15, 2017

Currently, tintableSvg links behave differently from normal image links / buttons - No alt / title text, cursor pointer styling not inherited etc.

  • Add a TintableSvgButton wrapper to enable tintable SVGs to behave in the same way as images with onClick handlers.

  • Modify Tinter.js to invert black SVG "lowlights" in a similar fashion to white "highlights", if needed by the current theme.

Depends upon - element-hq/element-web#5605

<TintableSvg
src={this.props.src}
></TintableSvg>
<span
Copy link
Member

Choose a reason for hiding this comment

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

How come we need another span here? Can't we put this in the parent span?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

The child span needs to float over the top of the SVG in order to display the tooltip on hover.

@rxl881
Copy link
Contributor Author

rxl881 commented Nov 15, 2017

@ara4n LGTMed. Merging.

@rxl881 rxl881 merged commit 5104ebf into develop Nov 15, 2017
@rxl881 rxl881 deleted the rxl881/invertOutlineColour branch November 15, 2017 18:34
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants