Topic: Buggy Skin function
Expected behavior Skins template should work properly Actual behavior As most MDB stuff it does not
I want to create custom skins. I extracted the tar file added my custom skin like this
"yellow-skin": (
"skin-primary-color": #fff,
"skin-navbar": #f1c40f,
"skin-footer-color": #f1c40f,
"skin-flat": #fadd67,
"skin-accent": #fadd67,
"skin-sidenav-item": #f1c40f,
"skin-sidenav-item-hover": #fadd67,
"skin-gradient-start": #f1c40f,
"skin-gradient-end": #e67e22,
"skin-mask-slight": #fff,
"skin-mask-light": #fadd67,
"skin-mask-strong": #fff,
"skin-sn-child": #fff,
"skin-btn-primary": #f1c40f,
"skin-btn-secondary": #f39c12,
"skin-btn-default": #f1c40f,
"skin-text": #fff
)
And you know what? Only the background changes but i never specified a background.. No buttons change, no btn-primary/secondary works. It is not the same as the provided skins! this is so annoying, if you do something productive, you are just lost if you use mdb! every free ui (semantic ui, grommet, primeng) is good and works and mdb is just a hell of bugged stuff..
I saw on your main site you are referring yahoo, ikea, sony, airbus, amazon as your customers.. Trusted by 1 000 000 + developers & designers this is all scam
I noticed so many bugs here, im wondering what you are doing? - you didn't build bootstrap - you didn't build react
**So as a pro User, send me the fix and a working skinning function quickly and fast with all required instructions. i followed all your last instructions! (extracting the mdb package, editing _custom_skin.scss and repackage as tgz) **
I need this function quick! Provide your existing skin's classes as templates!
Hi @xzesstence,
Are you sure you check documentation page for react, not for jQuery?
For now, if you want to add your custom skins class for your project you have to follow this instruction:
- go to path
node_modules/mdbreact/dist/ - copy:
scssfolders to your./srcfolder. - copy:
font, img, typesfolders to./src/scssfolder. - run
npm install node-sass -S - in your index.js file paste
import './scss/mdb.scss';and save file. - in
.src/scss/mdb.scssfile please comment lightbox, like this:// @import "pro/modules/lightbox/module"; then you can save data in your `src/scss/_custom-skin.css' something like this:
// Your custom skin // Skins $skins: () !default; $skins: map-merge(( "tested": ( "skin-primary-color": #f0f, "skin-navbar": #000, "skin-footer-color": #00f, "skin-flat": #f00, "skin-accent": rgb(70, 70, 0), "skin-sidenav-item": #0ff, "skin-sidenav-item-hover": #0f0, "skin-gradient-start": #f0f, "skin-gradient-end": #000, "skin-mask-slight": #00f, "skin-mask-light": #f00, "skin-mask-strong": rgb(97, 97, 0), "skin-sn-child": #0ff, "skin-btn-primary": #0f0, "skin-btn-secondary": #00f, "skin-btn-default": #f00, "skin-text": #fff ) ), $skins);
There is no direct instruction for mdbreact how to do it yet, so I present it in this way.
If you still the problem I will try to help you.
Of course, we apologise for problems.
Best regards, Konrad.
xzesstence pro commented a year ago
Hi Konrad, first off all: thanks for your response!
Hi @xzesstence,
Are you sure you check documentation page for react, not for jQuery?
jQuery Skins
react Skins
Nope! First of all the links you provided are known and they are not relevant for my post as your documentation lacks of clear instructions how to create those skins. It is obviously that this post is related to custom skins only and your provided links are only for specific predefined skins and no custom skins! if you only read the topic of this post you should know what is asked here!
Why do you ask if i looked in the wrong paper? I only use react and angular and i know mdb very good since im using it several years now (so i know also the dirty stuff) especially how this site works!If you've read my post carefully it should be obvious that this is not the problem here!
Another point (which is the most important one): i asked a question you seemed to miss in your response maybe because it was no direct question:
When i setup my skin using your earlier instructions, why does only the background change?I never specified a background color in my skin!Why does it not reflect the result like the provided skins? -> btn_primary should change the specific primary color which it does not!All these bugs only occure if you create a custom skin.The provided skins of the skin page work!
Since your instructions are different than those your staff told me before and seem to be logical since it recompiles them, it would make sense that the results are not reflected.I will try that out and let you know!
I don't want to sound rude, im sorry for that but as a customer your point is you want to save time, but MDB only takes all your time because its very nonprofessional done at its state and it really lacks on correct documentation. (for a long time now so im wondering like many people what are you guys doing all of your time.. you are trying to do commercial business here! but this is another story not relevant for this post and im not here to discuss that) On the other hand there are so many open source / free ui frameworks which are not buggy, are well documented etc..
if you work productive in a professional way you don't expect this kind of level for premium / commercial / payed products! Please fix your documentation lacks soon!! Thanks!
Konrad Stępień staff commented a year ago
Hi @xzesstence,
Are you sure you check documentation page for react, not for jQuery?
I asked about it because React has a different way to import styles and that's why I asked if you were browsing the right page because on the react documentation, it was not included a tutorial about making new skin and it surprised me a bit that someone wants to use the scss function, in the case where the user should not have access to this function (at least by default) .Creating new skins is not properly explained in React technology because it has a different structure from jQuery and it is difficult.
...as your documentation lacks of clear instructions how to create those skins. ...Why do you ask if i looked in the wrong paper?
Of course, we will plan to add instruction how to add your own skin to project, but MDBreact technology is not as extensive as MDBjQuery technology and we're working to make it happen. It is not described because we have to test it properly how to do it.
It is obviously that this post is related to custom skins only and your provided links are only for specific predefined skins and no custom skins!
As I mentioned. Mdbreact technology is younger than its main jQuery technology.We will complete the documentation for the above problem. However, we need to work on what is associated with another style import system.
When i setup my skin using your earlier instructions, why does only the background change?
On my page, I did change my skin in random colours, and it seems all work correctly.
I copy the example from this and add for the wrapper, my own class.
Could you explain to me how you did it? If you send me more code of information about it I will try to help you. Unfortunately, I have received little information, especially since you are working more than documentation information.
From what I noticed, all data from the scss function should be set, because they have no replacement default colours. So if a variable is not set correctly, it can spoil the skin setting.
I never specified a background color in my skin!Why does it not reflect the result like the provided skins? -> btn_primary should change the specific primary color which it does not!All these bugs only occure if you create a custom skin.The provided skins of the skin page work!
I can explain it with the team of jQuery because all styles are copied from this technology.
Since your instructions are different than those your staff told me before and seem to be logical since it recompiles them, it would make sense that the results are not reflected.I will try that out and let you know!
Thank you so much for trying my way. Can you explain to me how you tried to change your skin? We will try to solve the problem. Can I also receive information about who you have contacted before? Maybe this person would also help in this matter.
I don't want to sound rude, im sorry for that but as a customer your point is you want to save time, but MDB only takes all your time because its very nonprofessional done at its state and it really lacks on correct documentation.
In the near future, we will check all our documentation and we try to fix all bugs. You can also rate the pages of our documentation, which helps us in debugging pages. If you find any errors please inform us. The next few days/weeks we will fix existing package errors reported by users. We are sorry for the existing problems and we are doing our best to fix this.
if you work productive in a professional way you don't expect this kind of level for premium / commercial / payed products! Please fix your documentation lacks soon!! Thanks!
Thank you very much for your feedback! This answer is really constructive for us.If you have problems, we are always happy to help.
Best regards, Konrad.
xzesstence pro commented a year ago
Thanks, that worked but you forgot to mention that you need to change paths in _variables.scss
line 35 from "../font/roboto/" to "./font/roboto" line 178 from "../img" to "./img"
Konrad Stępień staff commented a year ago
Hi @xzesstence,
I didn't change path because I moved folders to ./src/scss folder at point 3. But I meant move not copy, my bad.
I am very happy that everything works correctly.
If there is anything else I could do for you do not hesitate to ask me. I'll be happy to help you.
Best Regards, Konrad.
Resolved
- User: Pro
- Premium support: No
- Technology: React
- MDB Version: 4.21.1
- Device: Any
- Browser: Any
- OS: Any
- Provided sample code: No
- Provided link: No