Our pure JavaScript Scheduler component


Post by cokguzel »

How I can apply border-radius to the whole event tooltip?


Post by Animal »

As you might have discovered

.b-sch-event-tooltip {
    border-radius: 10px;
}

Won't fully work. The inner element overflows that element and it is still square, so obscures the rounded corners, you'll also need this:

// Make the inner element rounded so it stays inside the outermost element
.b-sch-event-tooltip .b-panel-body-wrap {
    border-radius: 10px;
}
// Make the body element rounded so it stays inside the outermost element
..b-sch-event-tooltip .b-tooltip-content{
    border-radius: 10px!important;
}

Post by cokguzel »

yeah actually I was trying the first option and id didn't work for me

adding additionally border-radius for .b-panel-body-wrap was enough for me like this

.b-sch-event-tooltip {
  border-radius: 20px !important;
}

// Make the inner element rounded so it stays inside the outermost element
.b-sch-event-tooltip .b-panel-body-wrap {
  border-radius: 20px !important;
}

thanks!


Post Reply