Our pure JavaScript Scheduler component


Post by kguernsey »

There seems to be a Css conflict with the Vuetify library. I've created a new Vue project using the latest Cli and added the Vuetify plugin. I then added the Scheduler inside a v-content tag.

The Scheduler code is based on the Simple Vue demo.

The issue is that the vertical lines do not appear in the Scheduler, all other functionally seems to be working.

I've attached an image and a test project.

We're currently using the trial version, and this is the only issue preventing us from making a purchase.

Thanks
Attachments
BryntumSchedulerTest.zip
(3.18 MiB) Downloaded 259 times
BryntumScheduler.png
BryntumScheduler.png (41.53 KiB) Viewed 2342 times
Last edited by kguernsey on Mon Jul 15, 2019 8:07 pm, edited 2 times in total.

Post by mats »

Can you please upload a test case or make your POC available to us online?

Post by pmiklashevich »

Vuetify sets `background-repeat` to `no-repeat` for all elements:
* {
  background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements */
  padding: 0; /* Reset `padding` and `margin` of all elements */
  margin: 0;
}
To make background of the timeline work again please override the rule back for scheduler's elements:
<style lang="scss">
    .b-scheduler-container {
        * {
            background-repeat: repeat; // to fix timeline background when vuetify styles are used
        }
    }
</style>
Cheers,
Pavel

Pavlo Miklashevych
Sr. Frontend Developer


Post by pmiklashevich »

P.S. Will be fixed on our end in the future releases!

Pavlo Miklashevych
Sr. Frontend Developer


Post by kguernsey »

The fit worked! Thanks for the help.

Post by ice.bob »

I am also using the current version of scheduler with the current version of vuetify. It does not render properly. In fact every column is shown in a separate row. And the console says: "Grid element not sized correctly, please check your CSS styles and review how you size the widget"

The css fix does not work. Has anybody an idea how to fix this?

P.S.: I have the same problem with Grid as well.

Post by mats »

@ice.bob: Please always upload a simple test case so we can see what you see. The console statement pretty much sums it up, you have not told our component how it should be sized. Please review your CSS.

Post by ice.bob »

After migration of my app it somehow did not imported the styles. I fixed this know and it works as before. Thank you anyway.

Post Reply