Issues with combination of arrow and directions options

[oliverfindl]

Hello @CreativeBulma,

huge thanks for this cool package for Bulma!

Unfortunately I'm encountering some issues when I want to use tooltip with arrow in combination with different directions for different breakpoints.

I'm using this class combination:

.has-tooltip-arrow.has-tooltip-right-touch.has-tooltip-bottom-desktop.has-tooltip-fade

As result, this correct rule for arrow:

@media screen and (min-width: 1024px) {
  [data-tooltip].has-tooltip-bottom-desktop.has-tooltip-arrow:after { /* ... */ }
}

Gets overwritten with this incorrect (more specific) rule:

[data-tooltip]:not(.is-disabled).has-tooltip-arrow.has-tooltip-arrow:after,
[data-tooltip]:not(.is-loading).has-tooltip-arrow.has-tooltip-arrow:after,
[data-tooltip]:not([disabled]).has-tooltip-arrow.has-tooltip-arrow:after { /* ... */ }

• result for touch breakpoint:

• result for desktop breakpoint:

---

And one request for bonus points. I would appreciate some classes for not displaying tooltip per different breakpoints. E.g.:

.has-tooltip-hidden-#{$breakpoint} { /* ... */ }

Thanks

[CreativeBulma]

Hi @oliverfindl,

Thanks for reporting this bug. I'll work on it. Good idea for

.has-tooltip-hidden-#{$breakpoint} { /* ... */ }

I'll try to integrate it too.