[Feature request] Tooltip : left/right/bottom directions, dark colors, input elements

[KaKi87]

Hello,

Here are a few suggestions for Pico's tooltip.

Left/right/bottom/directions

Tooltip currently only shows on the element's top side, it would be nice to be able to make it show on every other side.

Example :

Dark colors

Every other element has dark colors when dark mode is enabled, it would be nice for the tooltip to have some.

Example : white on blue.

Input elements

In order to use less space, inputs could only have an icon and a tooltip as label, so it would be nice for this use case to be handled.

Example : https://jsitor.com/E3tSFVDOv

---

Thanks.

And thanks for making Pico CSS, the idea of a class-less semantic-first dark-featured framework is awesome.

[prikeshsavla]

@KaKi87

In order to use less space, inputs could only have an icon and a tooltip as label, so it would be nice for this use case to be handled.

That does not seem like a great approach for screen readers and accessibility. You don't always need very compact forms. This does work for login forms, but with placeholders and no labels.

I don't have much opinion on tooltips.

[KaKi87]

I understand, but I'm building a URL shortener, featuring dozens of possible configuration combinations, so I need to save as much space as I can, and this app is not the kind that disabled people would need or use.

[lucaslarroche]

@KaKi87 There is a pull request in progress by @wenkm with this feature: #180

[KaKi87]

data-placement works fine, thanks (I would have added tooltip though, e.g. data-tooltip-placement).

Any news on the last two requests ?

Thanks