Topic: SCSS main file missing content?
Hello!
I'm working on an updated version of the MDB Free/Pro boilerplate I have published on GitHub here: MDB Boilerplate @ GitHub
I've got everything working with the latest version of Webpack and transpilers, however, when I add the main stylesheet for SCSS mdb.scss as an entry point, round buttons, the rounded social buttons, actually much of the content on this page https://mdbootstrap.com/docs/jquery/components/buttons-social/ doesn't render properly.
Rounded buttons become square, the icons seems fixed to the top left corner, using the included icon scales (fa-2x, fa-3x, fa-5x, etc) also seem to do nothing.
However, if I change the stylesheet entrypoint from /mdb/scss/mdb.scss to /mdb/css/mdb.css everything works correctly as it should.
I've unfortunately not had much time to debug the issue with the main SCSS file as work has been a little demanding lately.
If the need is there, I can setup a quick git repository to confirm this issue.
I'm sorry for the delay here @Piotr Glejzer@Marta Szymanska
My girlfriend works at a kindergarden and brings all kinds of germs home so I'm often knocked out my the flu or harsh colds.
I've setup a quick repository here: https://github.com/SpellCraft/mdb_test
Follow the steps in the readme to be able to reproduce the issue I'm looking at. Should be evident right away.
Here's a screenshot from my browser as well: https://i.imgur.com/ALlOPMU.png
Arnt Oddvar Pedersen pro commented 5 years ago
I fixed icons and icon scaling from Fontawesome 5 by using the Fontawesome 5 SCSS+Webfonts instead of the Fontawesome 5 all-in-one javascript file (recommended), though rounded buttons while having the HTML entity type="button" seems to always produce square buttons.
This is not the case with the CSS file, however.
I've yet to encounter any other issues so far with the latest MDB-Pro package
Piotr Glejzer staff commented 5 years ago
Ok, so you are saying that is a problem with FA5 all-in-one js file? Hmm, that's weird.
Arnt Oddvar Pedersen pro commented 5 years ago
Yes sir. This can easily be replicated in the repository I linked above by commenting out or remove these lines from webpack.config.js:
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'scss', 'fontawesome.scss'),
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'scss', 'regular.scss'),
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'scss', 'brands.scss'),
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'scss', 'solid.scss'),
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'scss', 'v4-shims.scss'),
Then add the following line to the entry points of webpack.config.js:
path.resolve(__dirname, 'node_modules', '@fortawesome', 'fontawesome-free', 'js', 'all.js'),
With these changes, if you launch the webpack development server: npm start or even build the website test: npm run build you'll notice that all the icons are of the wrong color (black) and horribly maligned.
I've not heard back in a while so I guess you guys are still looking into this?
Piotr Glejzer staff commented 5 years ago
Yes, we still looking into this. We are not using js version of FA5 so we can't remove 'scss' globally, but we have a task for that to take a look at this. If you are using js FA5 with webpack , did you download FA5 svg version of CSS to webpack?
Hi,
for issues connected to purchasing our products or premium support, please contact our marketing team. You can write to Mateusz, here is his email address: m.leciejewski@mdbootstrap.com
Best, Marta
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.7.3
- Device: Android, iOS
- Browser: Chrome, Firefox
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes
Piotr Glejzer staff commented 5 years ago
If you will have time for setup a quick git repository for that that it will be cool.
Arnt Oddvar Pedersen pro commented 5 years ago
Hey, Piotr!
Saw you just pushed an update from 4.7.3 to 4.7.4 along with the comment you posted. I'll setup the environment and update from .3 to .4 to see if it changes anything. Give me a couple of hours.
While we're at it; I see that my premium support has run out; I checked up on the MDB products page but I couldn't find a purchase option for extended premium support or similar, is something like this available?