Hello Everyone,
We just moved from trial version to licensed version. we need to import sass files and add our custom theme. when using sass files, i face many issues:
1_ math.div() has been deprecated and gives error had to change it in all files with calc().
2_ all fonts are not included in sass file, had to copy it from CSS files.
3_ after fixing fonts and deprecated parts, i now can't see icons used in calendar it just show me the CSS content code instead of icons.
4_ another toolbar appear at the end of the page, look at the second picture?
I was not able to solve this part and i didn't expect these sass files to have this many problems, i need a solution. thanks!
I also wonder what would happen if we upgrade our bryntum version then i have to do all this process again. it is so unusual. please tell me a solution that i can prevent this process each time that we upgrade our bryntum.
Support Forum
- Attachments
-
- What is this toolbar here?
- Screenshot 2022-10-24 171503.png (107.83 KiB) Viewed 401 times
-
- You can see that. but other icons have been fixed since i added fa-solid-900.woff2 font file and load it.
- Screenshot 2022-10-24 155207.png (121.93 KiB) Viewed 406 times
This all seems like the CSS is not properly built.
The toolbar at the bottom of the sidebar should be hidden by this rule:
How are you building the CSS? SASS recommends using math.div
: https://sass-lang.com/documentation/breaking-changes/slash-div
There is other CSS in your page which seems to have global effects. Your toolbar buttons look misaligned. They do not looks like that with no other CSS in the page.
This icons should be styled using rules like this:
Is some part if the build quoting that character \f101
so that the content ends up as \\f101
? Take a look at the DOM
Hey Animal,
Thank you for replying. We are using node-sass for processing sass files. Unfortunately Math.Div gives me an error. i tried to use SASS npm package but it was giving me a warning that Math.div is deprecated. I ended up replacing it with Calc() in all SASS files manually.
I was able to remove the bottom of sidebar by adding this part in config file.
sidebar:{
bbar:false,
}
Icons content were ended up as \\f101. I solved it by changing
"#{$fa-var-times}"
to
#{'"' + $fa-var-times + '"'}
everywhere in sass files.
I am not sure if this is the ideal we it should be done. Also, i hope removing bottom of sidebar doesn't effect on responsiveness. Is there an easier way to prevent all this process or i have to do it every time i install/upgrade bryntum?