Arrow customization

[rannyeli]

Hey! I'm trying to add a shadow to the tooltip arrow but can't find any option to customize this element except from changing it's color. Is there any option to do some customizations for the arrow element?

[OlegGulevskyy]

Hey @rannyeli what worked for me is adding my own custom class and over writing the styles of the component like so

.customArrow::after {
    border-top: 20px solid transparent !important;
    border-bottom: 20px solid transparent !important;
    right: -19px !important;
    top: 40% !important;
    margin-top: -4px !important;
    border-left-color: #ffffff !important;
    border-left-style: solid !important;
    border-left-width: 19px !important;
    filter: drop-shadow(2px 2px 2px rgba(172, 170, 170, 0.08));
}

Very hacky, but I am not sure what's a better way there is..

[ZsuzsaMano]

Hey, I have a similar issue. but I would like to replace the arrow with my custom arrow. Any tips on this? With a thicker border the original arrow looks quite bad.