How to add a ℹ next to a Title entry

Hi, is there a CSS trick to display a text field under an “information” little bubble, associated/close to an other component?

image

Thanks

Can you specify what exactly component you need to remove/include it, plz?

Sorry, it was not clear.

I am trying to provide guidelines per entry fields.
Currently, I am using a show/hide rich text (cf. “Tips on capability”), but it would be much more UI friendly with the ability to add a little (:information_source:) just above the entry field.
I was wondering if it existed a CSS trick to do this.

image

1 Like

@AyS_0908 a suggestion is use the Action Text now we can add icons for it, leaving the entry component with no Title.

:star: No CSS required.

What do you think? You chose the best action you wanna do when the user click on it.

3 Likes

Bah, if no CSS, I don’t take it :slight_smile:

Fantastic, thanks @Lucas_Pires

1 Like

Glad the team added this! It’s simply fantastic!

:star: Feature requests to improve it:

  • Left/Right icon option (example :point_right:t3:) image

  • Design feature as Text component (bold, centered, left side, etc…)

(@Mark @Jason @tristan)

2 Likes

And, if we want to use it as an “information/guidelines” icon with the Show Notif action, I would add the ability to set a length to display the notification (3 seconds is a little bit short to read 10 lines !)

Why not a Link to Screen action? Wouldn’t it be better?

It obliges the user to go back; but you’re right, setting the time for the notif is not interesting.
Maybe would the best be a notification that can be closed by the user? We therefore could have the option to let notification disappear or enable the user to close it.

@AyS_0908 I dont think so, take a look.

1 Like

Or, just toggle a hidden hint component…

That example uses a floating button, but of course it could be anything.

2 Likes