Hi sfmy,

We just replied to your previous email, kindly check it..

Best regards, Left4code Team

Hi inviz,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

Some animations are directly attached to the SASS file due to complexity and other reasons. For example. Menus, Wrappers.

To find it easily, you can search through this directory ”/resources/sass/components” with keyword ”@keyframes ” and remove all of them from search results.

Let me know if that still doesn’t work.

Best regards, Left4code Team

Hello. Thank you and yes, I found them. for future reference if someone else is having the same issues, I also had to change the opactiy for the css class .wrapper-box to 1, after removing the main content animations.

I changed the following line: @apply flex bg-theme-1 dark:bg-dark-8 opacity-80; to @apply flex bg-theme-1 dark:bg-dark-8 opacity-100; after removing the @keyframe at the bottom in this file: /resources/sass/components/_wrapper.scss

Hi inviz,

Thanks for your reply,

Thank you also for the comments will be very helpful..

Best regards, Left4code Team

how to update the version? $ yarn run prod $ npm run production > rubick@3.0.4 production > mix --production

2nd question: both of these not work .catch(error => { // reset to default button cash('#btn-updateProfile').html('<i data-feather="save" class="w-4 h-4 mr-2" /> Save').svgLoader() ----------------------------- // reset to default button cash('#btn-updateProfile').html('<i data-loading-icon="save" data-color="white" class="w-4 h-4 mr-2" /> Save').svgLoader() })

Hi sunnguon,

Unfortunately, since it’s just a template there’s no way to update the version by command.

So we need to replace the assets or dependencies manually to update the theme.

For the 2nd question, you need to use the feather js built-in function to initiate the SVG icon.

What you do above is a function for loading animation icons, not feather icons.

You can use the following code for feather icon: cash('#btn-updateProfile').html('<i data-feather="save" class="w-4 h-4 mr-2" /> Save') // Initiate feather icon plugin feather.replace({ "stroke-width": 1.5, });

Hope this helps.

Best regards, Left4code Team

Hi zamcedi,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

Can you send the error message? Screenshots would be great.

Best regards, Left4code Team

Hi brenoglima,

Sorry for the late reply,

It’s actually an expected behavior since the plugin is initialized on the first page load.

So the simplest way to solve this is to re-initialize the plugin after you make the ajax call.

Please check the following example: <script> @section(‘script’) <script> cash(function () { axios.get(`/example`).then(res => { // Re-init Feather Icons feather.replace({ “stroke-width”: 1.5, }); @endsection </script>

// Re-init Tail Select
            cash(".tail-select").each(function () {
                tail(this, {});
            });
        })
    })
</script>

You may need to make used plugins globally accessible by attaching them to the window object.

For example the TailSelect plugin above. You can modify this file ”/resources/js/bootstrap.js” and add tail-select plugin like below. https://prnt.sc/13l08ls

Hope this helps.

Best regards, Left4code Team

Hi xwiz,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

You can follow the steps below to change the color.

Select the elements. https://prnt.sc/11ou5hj

Look for the background-color property. https://prnt.sc/11oubwn

Hover over the property and click the little arrow behind the value. https://prnt.sc/11ouha7

Then we will be directed to the elements. https://prnt.sc/11ouleg

Since tailwind converts the colors from HEX to RGBA we have to change the “var(—tw-bg-opacity)” string to “1” like below. https://prnt.sc/11ouvsv

https://prnt.sc/11ouy8n Open the color picker and change the RGBA color to HEX by clicking on the little arrow next to the box.

Then you can copy the HEX color, find and replace it in the “tailwind.config.js”.

Don’t forget to recompile the assets after making a change.

Best regards, Left4code Team

Hi Angra-Mainyu974,

Thank you for reaching out to us..

Unfortunately, we still don’t have plan to work with alpine.js.

Best regards, Left4code Team

Hi DmElectronics,

Is there any errors in the console? Maybe we can find the issue from there.

Best regards, Left4code Team

I have no mistakes. cash (’# confirmationModal’). modal (‘hide’); does not work.

https://prnt.sc/13uxvht

HI DmElectronics,

Thank you for your reply,

Can you try placing the code below just before closing the modal? so it will look somtehing like this:

// Add this line console.log(cash("#confirmationModal")[0]) cash("#confirmationModal").modal("hide");

Let me know the result in console.

Best regards, Left4code Team

Hi futureweb2,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

You can check an example of the Tabulator data format at the following link: http://tabulator.info/docs/4.9/data#ajax-progressive

Hope this helps.

Best regards, Left4code Team

Hi rama_euiinn,

Thank you for your reply,

We’ve found the problem you’re experiencing.

As the warning appears, the tiny-slider plugin uses a script that will be deprecated in the next version of dart-sass.

For now, you can ignore the message as it is only a warning and does not affect the compilation process.

You can check if we are currently using the latest version of tiny-slider so we will wait for the next version until the issue is patched.

https://github.com/ganlanyuan/tiny-slider

Or if you’re bothered by the warning, you can temporarily replace the tiny-slider plugin with another slider plugin.

Best regards, Left4cod Team

Okay thank you very much

You’re very welcome..

Best regards, Left4code Team

Hi brenoglima,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

Yes, it’s possible, you can show the modal programmatically and set the data-route property to define your route. Please check the following code.

// Show confirmation modal cash('#show-modal').on('click', function() { cash('#confirmation-modal').modal('show') // Set the data-route here, try to attach it somewhere on the modal element cash('#confirmation-modal').find('.modal-body').attr('data-route', 'http://example.com') }) // And when clicking on confirm button you can close the modal programmatically and get the data route defined before cash('#confirm-modal').on('click', function() { cash('#confirmation-modal').modal('hide') // Get the data-route here let dataRoute = cash('#confirmation-modal').find('.modal-body').data('route') // Redirect the page here })

Hope this helps.

Best regards, Left4code Team

Does it have some price that integration?

Hi cesarcruzc,

Sorry for the late reply,

Unfortunately, we don’t use inertia on this template and we are currently unable to provide template customization at this time.

Best regards, Left4code Team

Hi paperasse,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

Can you try to update your Node & NPM version?

Then remove the “node_modules” directory and reinstall the dependencies.

Best regards, Left4code Team

Hi DmElectronics,

I’ve never experienced that. Can you send a screenshot of the compilation result?

I’m sorry. Everything works. My mistake.

You’re very welcome..

Best regards, Left4code Team

Hi iisoft,

Sorry for the late reply,

You can update the litepicker plugin by reinstall it. Just run “yarn add litepicker”.

Then replace this file ”/resources/sass/components/_litepicker.scss” from the latest download package.

Hope this helps.

Best regards, Left4code Team

I have updated the litepicker but I still had the same error.

After executing litepicker in modal, litepicker is fixed when scrolling.

https://prnt.sc/135uhl6

Hi iisoft,

Looking at your problem, it doesn’t seem like it’s a litepicker problem. This is the expected behavior because when using modal, the scrolling content is not in the body element but in the ”.modal” class inside the modal component.

A simple way to get around this is to hide the litepicker plugin when scrolling modal content. You can change this file ”/resources/js/datepicker.js” by adding the code below.

document.querySelectorAll(".modal").forEach(function (e) { e.addEventListener("scroll", function () { litepicker.hide(); }); }); https://prnt.sc/13alpjm

Hope this helps.

Best regards, Left4code Team

Hi jed1knyt,

Sorry for the late reply,

That’s a good idea, we will try to add this in the next release..

Best regards, Left4code Team

Great to hear! Thanks

You’re very welcome..

Best regards, Left4code Team

HI DmElectronics,

Thank you for taking the time to contact us, I’ll be more than happy to help you..

You can comment the line below: https://prnt.sc/10luqxr

From ”/src/sass/app.scss” to remove the animation.

Hope this helps.

Best regards, Left4code Team

Hi patrykpilek,

Thank you for taking the time to contact us, I’ll be more than happy to help you.

We found that there were problems with the current compiler version and some dependencies, especially with NPM.

https://github.com/JeffreyWay/laravel-mix/issues/2633

But it should work out well with Yarn.

However, we can still use NPM with the following steps.

- Add “webpack”: “^5.23.0” in package.json devDependencies

- rm -rf package-lock.json

- rm -rf node_modules

- npm install—force

Then run the compiler again with “npm run watch”.

Hope this helps.

Best regards, Left4code Team

Hi kolesnikof,

Thank you for reaching out to us,

Unfortunately, we don’t have a plan to release Laravel + Vue version.

But if you need it you can use the vuejs version and we will help you to integrate it to a fresh laravel project.

It’s really simple (maybe less than 10 steps).

Hope this helps.

Best regards, Left4code Team

Ok, thanks

You’re very welcome..

Hi CptChaos,

We have already download the file and found out the problems, it’s because the postcss config here: https://prnt.sc/12zaqw6

At “resources/admin/webpack.mix.js” is not loaded. The configuration has been overridden with global postcss config from “postcss.config.js”.

So to fix the problem just remove the tailwindcss object from “postcss.config.js” like below. https://prnt.sc/12zavaz

Hope this helps.

Best regards, Left4code Team

Hi Left4Code!

Thank you so much for all your help! It’s working now! Much appreciated!

Kind regards, CptChaos

You’re very welcome, glad to help..

Best regards, Left4code Team