I'm trying to create a custom theme and add it to my project. The problem is that I need to compile the sass files inside of our project as we can't have an external dedicated css file for scheduler pro. Therefor I moved all the files from the resources folder inside my scss vendor folder and import eg
@import "assets/scss/vendors/scheduler-pro/sass/themes/classic-dark.scss"; to my scss file. But this doesn't work due to the import structure of the theme. For example the scheduler sass files try to find the fontawesome webfonts via
/assets/scss/fonts/fa-solid-900.ttf which for sure doesn't exist. To make it short: is it even possible to import/compile the sass files inside a project or do they need to be compiled on its own and you have to load the output css externally?
This is not related to the setup of my project, because if I copy and paste the compiled css to a sass file in my project and import that one the scheduler is styled and everything works fine.
Its just that I would like to have the scss part of scheduler pro insider my project and maybe resue sass variables in my theme.
You can check this guide to understand how to set up a custom theme for components https://bryntum.com/docs/grid/guide/Grid/customization/styling#creating-a-theme
I believe that as you mentioned, the best way to handle this would be to compile the custom theme on its own and then load the CSS output externally.
thanks for your reply. I just found a solution for the issue a few minutes ago. I had to rework a bit the imports.
But now the styles work. The only issue I'm having that I still see the "Bryntum trial version" background image in my scheduler component. Which is weird because I use:
"@bryntum/schedulerpro": "5.1.1", "@bryntum/schedulerpro-react": "5.1.1"
and the scss files from the resources folder schedulerpro-5.1.1 I downloaded