Skip to content

Tooltip component#18

Closed
lusimeon wants to merge 2 commits into
developfrom
feature/tooltip-component
Closed

Tooltip component#18
lusimeon wants to merge 2 commits into
developfrom
feature/tooltip-component

Conversation

@lusimeon
Copy link
Copy Markdown

@lusimeon lusimeon commented Jun 10, 2020 •
edited
Loading

Create a Tooltip component based on this pen.

  • Add $refs CSS pseudo-element.
  • Write documentation.

@lusimeon
Copy link
Copy Markdown
Author

lusimeon commented Jun 12, 2020

Hey @studiometa/js, I need to find a way to set pseudo-element (to generate tooltip triangles) without the use of CSS. Do you have any idea?

There is this way but don't like it.

@titouanmathis titouanmathis added the enhancement New feature or request label Jun 12, 2020
titouanmathis
titouanmathis requested changes Jun 12, 2020
View reviewed changes
Copy link
Copy Markdown
Contributor

@titouanmathis titouanmathis left a comment

Choose a reason for hiding this comment

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

Nice work! 🙂

Comment thread .babelrc.js Outdated
Comment thread src/components/Tooltip.js Outdated
Comment thread src/components/Tooltip.js Outdated
@titouanmathis
Copy link
Copy Markdown
Contributor

titouanmathis commented Jun 12, 2020

Hey @studiometa/js, I need to find a way to set pseudo-element (to generate tooltip triangles) without the use of CSS. Do you have any idea?

There is this way but don't like it.

@lusimeon I think of 2 solutions:

  • Use a dynamically inserted SVG
  • Let the user decide if he wants a triangle or not by using the tooltip classes to add custom styles

The code for a SVG triangle is quite small:

<svg width="30" height="15" viewBox="0 0 30 15" xmlns="http://www.w3.org/2000/svg">
  <path d="M29.1 15L15 0.9 0.9 15H29.1Z"/>
</svg>

titouanmathis
titouanmathis requested changes Jun 12, 2020
View reviewed changes
Comment thread src/components/Tooltip.js Outdated
@titouanmathis titouanmathis mentioned this pull request Jun 18, 2020
Merged
Add tooltip component
dd99f51 
commit 2099093
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Mon Nov 30 11:41:52 2020 +0100

    Add build files

commit 7faea4a
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Mon Nov 30 11:41:34 2020 +0100

    Fix Tooltip component test

commit d3a8fec
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Mon Nov 30 11:01:33 2020 +0100

    Add an offset example and fix tooltip load.

    Fix opened tooltip on load

    Add an example with offset in doc

    Add dist files

commit ea0ab59
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Mon Nov 16 11:44:58 2020 +0100

    Refactor tooltip component based on latest js-toolkit version

commit 381df43
Merge: 8129e35 7413456
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Mon Nov 16 11:21:38 2020 +0100

    Merge branch 'develop' into feature/tooltip-component

commit 8129e35
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 10 13:49:02 2020 +0200

    Fix prettier lint errors

commit c5fe937
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 10 13:48:38 2020 +0200

    Add tooltip to components test

commit f6fd207
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 10 13:47:58 2020 +0200

    Add tooltip demo

commit 776b095
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 3 12:07:46 2020 +0200

    Add Tooltip component

commit 8c3d888
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 3 12:06:58 2020 +0200

    Fix docblock typo in service 'key'

commit 765adfb
Author: Lucas Simeon <lu.simeon@gmail.com>
Date:   Wed Jun 3 12:05:29 2020 +0200

    Fix babel duplicate plugin declaration

commit c5c1c85
Author: Titouan Mathis <titouan@studiometa.fr>
Date:   Sat May 30 14:28:52 2020 +0200

    Add public access config for the package

commit f39a7d5
Author: Titouan Mathis <titouan@studiometa.fr>
Date:   Sat May 30 14:24:46 2020 +0200

    Create npm-publish.yml
@lusimeon lusimeon closed this Nov 30, 2020
@lusimeon lusimeon force-pushed the feature/tooltip-component branch from 2099093 to 7413456 Compare November 30, 2020 10:50
@lusimeon lusimeon reopened this Nov 30, 2020
@lusimeon lusimeon marked this pull request as ready for review November 30, 2020 10:57
@lusimeon
Copy link
Copy Markdown
Author

lusimeon commented Nov 30, 2020

Hey @studiometa/js, I've updated this PR based on last develop version so feel free to review :)

perruche
perruche reviewed Nov 30, 2020
View reviewed changes
Copy link
Copy Markdown
Contributor

@perruche perruche left a comment

Choose a reason for hiding this comment

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

Can't wait to use it !

Comment thread docs/components/Tooltip.md Outdated
Comment thread docs/components/Tooltip.md Outdated
Comment thread docs/components/Tooltip.md Outdated
Comment thread docs/components/Tooltip.md Outdated
Comment thread docs/components/Tooltip.md Outdated
Comment thread src/components/Tooltip.js
@lusimeon
Copy link
Copy Markdown
Author

lusimeon commented Nov 30, 2020

Unfortunaly there's still had a bug on hover triggers sometimes, see this video (test here).
I think I need to implement a debounce or equivalent but I don't know where, @studiometa/js could you help?

@titouanmathis
Copy link
Copy Markdown
Contributor

titouanmathis commented Nov 30, 2020

Unfortunaly there's still had a bug on hover triggers sometimes, see this video (test here).
I think I need to implement a debounce or equivalent but I don't know where, @studiometa/js could you help?

I saw this bug too, we can check together next monday 😉

@titouanmathis titouanmathis force-pushed the develop branch 3 times, most recently from cc59775 to 88504c6 Compare May 28, 2021 09:44
@titouanmathis
Copy link
Copy Markdown
Contributor

titouanmathis commented Oct 25, 2021

Closing as this should be added to https://github.com/studiometa/ui.

@titouanmathis titouanmathis deleted the feature/tooltip-component branch October 25, 2022 12:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@titouanmathis titouanmathis titouanmathis requested changes

@perruche perruche perruche left review comments

Assignees

@lusimeon lusimeon

Labels

enhancement New feature or request

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@lusimeon @titouanmathis @perruche