Multi step sign-in
Hi,
I'm using Metronic 8.1.7 with ASP.NET MVC application.
I'm trying to implement Multi Sign-in like in demo1\dist\authentication\extended\multi-steps-sign-up.html but I can't get quite the same appearance as in sample.
What css and js files must be included beside mandatory global files and Assets/js/custom/utilities/modals/create-account.js?
Best Wishes,
Valentin Faganel
Replies (4)
Hi,
I removed create-account.js and add js code from Stepper documentation (https://preview.keenthemes.com/html/metronic/docs/general/stepper).
Console errors are gone and stepper works fine.
Appearence problem still exists in stepper nav part, where colors of titles are not consistent with dark theme: for example current stepper item title should be white but in my app is grey. Non chosen items also are in wrong colors.
Is there any other css to include or code init to run?
Best Wishes,
Valentin Faganel
Hi,
Have you tried the latest Metronic v8.1.8 update?
As you can check the original template's code here
the required CSS code is included via the global styles.bundle.css and it should work as expected you are including the mandatory css/js bundles.
If you could deploy your developing page in your staging server we could quickly check your code and find the issue. Most probably some styles related code missing in your code.
Regards.
Hi,
I took original multi-steps-sign-up.html to adapt it to my needs. I included mandatory global files and create-account.js.
There is actually an error in console. Here is state of error before my adaptation of the page:
classSet.js:6
Uncaught TypeError: Cannot read properties of null (reading 'classList')
at classSet.js:6:1
at Array.forEach (<anonymous>)
at addClass (classSet.js:5:1)
at classSet.js:30:43
at Array.forEach (<anonymous>)
at classSet (classSet.js:30:1)
at __webpack_modules__.../src/plugins/formvalidation/dist/amd/plugins/Framework.js.Framework.install (Framework.js:46:1)
at __webpack_modules__.../src/plugins/formvalidation/dist/amd/plugins/Bootstrap5.js.Bootstrap5.install (Bootstrap5.js:35:1)
at l.registerPlugin (FormValidation.full.min.js:1:94942)
at FormValidation.full.min.js:1:105826
(anonymous)@classSet.js:6
addClass@classSet.js:5
(anonymous)@classSet.js:30
classSet@classSet.js:30
__webpack_modules__.../src/plugins/formvalidation/dist/amd/plugins/Framework.js.Framework.install@Framework.js:46
__webpack_modules__.../src/plugins/formvalidation/dist/amd/plugins/Bootstrap5.js.Bootstrap5.install@Bootstrap5.js:35
registerPlugin@FormValidation.full.min.js:1
(anonymous)@FormValidation.full.min.js:1
r@FormValidation.full.min.js:1
initValidation@create-account.js:150
init@create-account.js:348
(anonymous)
Best Wishes,
Valentin Faganel
Hi,
Sorry for the late reply.
Yes, multi-steps-sign-up.html uses custom/utilities/modals/create-account.js. Do you have any JS error in your console ?
Have you used the HTML code of this page as per the original multi-steps-sign-up.html?
Regards.
