Hello, I was working on with Laravel integration, I am using the git repo then modified it to display my contents, I was able to make it run but seems like some of the pages are not rendering properly. I dont see any console error and all assets are loaded status 200
here's a sample screenshot
this is resolved, i was able to fix my issue
hello,
I have approved the share request, I was able to fix the styling issue, but what I'm having right now is they are not working, when I click the drop down it does not show the available options, I am using the HTML template with Data Table template.
Hi Ryann
Could you please enable the drive link share permission?
Thanks
Me too, I have the same problem with laravel livewire 9.2.8. need help
Im using metronic v9 tailwind latest build, ktui is not working not sure why.
for some reason these codes below located in app.js doesn't work, dropdowns loads but when you click them nothing happens.
// Metronic Core JavaScript functionality
document.addEventListener('DOMContentLoaded', function() {
setTimeout(() => {
// Initialize drawer functionality
initDrawers();
// Initialize menu functionality
initMenus();
// Initialize sticky headers
initStickyHeaders();
// Initialize modal functionality
initModals();
console.log('â
KTMenu initialized');
}, 100);
});
// Drawer functionality
function initDrawers() {
const drawers = document.querySelectorAll('[data-kt-drawer]');
drawers.forEach(drawer => {
const toggles = document.querySelectorAll(`[data-kt-drawer-toggle="#${drawer.id}"]`);
toggles.forEach(toggle => {
toggle.addEventListener('click', function(e) {
e.preventDefault();
drawer.classList.toggle('hidden');
drawer.classList.toggle('block');
});
});
});
}
// Menu functionality
function initMenus() {
const menus = document.querySelectorAll('[data-kt-menu="true"]');
menus.forEach(menu => {
const items = menu.querySelectorAll('[data-kt-menu-item-toggle="dropdown"]');
items.forEach(item => {
const trigger = item.querySelector('[data-kt-menu-item-trigger="click"], [data-kt-menu-item-trigger="click|lg:hover"]');
const dropdown = item.querySelector('.kt-menu-dropdown');
if (trigger && dropdown) {
trigger.addEventListener('click', function(e) {
e.preventDefault();
dropdown.classList.toggle('hidden');
});
}
});
});
}
// Sticky header functionality
function initStickyHeaders() {
const stickyElements = document.querySelectorAll('[data-kt-sticky="true"]');
stickyElements.forEach(element => {
const stickyClass = element.getAttribute('data-kt-sticky-class') || 'kt-sticky';
const offset = parseInt(element.getAttribute('data-kt-sticky-offset')) || 0;
window.addEventListener('scroll', function() {
if (window.scrollY > offset) {
element.classList.add(...stickyClass.split(' '));
} else {
element.classList.remove(...stickyClass.split(' '));
}
});
});
}
// Modal functionality
function initModals() {
const modalToggles = document.querySelectorAll('[data-kt-modal-toggle]');
modalToggles.forEach(toggle => {
toggle.addEventListener('click', function(e) {
e.preventDefault();
const modalId = this.getAttribute('data-kt-modal-toggle');
const modal = document.querySelector(modalId);
if (modal) {
modal.classList.toggle('hidden');
modal.classList.toggle('flex');
}
});
});
}
// Close modals when clicking outside
document.addEventListener('click', function(e) {
const modals = document.querySelectorAll('.kt-modal');
modals.forEach(modal => {
if (e.target === modal) {
modal.classList.add('hidden');
modal.classList.remove('flex');
}
});
});
// Export functions for use in other modules
window.MetronicCore = {
initDrawers,
initMenus,
initStickyHeaders,
initModals
};
Ok so I was able to check what's happening, seems like metronic js is overriding tailwind classes, that's why when i add postcss.js both metronic theme and tailwind style clash making some elements like toggle buttons break. yes I'm using v9
Hi,
Can you please confirm your Metronic 9 Version ?
Also could you please send us your screenshots via support@keenthemes.com ? We will check it there.
Regards,
Sean
I added the user profile html template as my blade and modified it to work, now toggles does not render properly it looks like a broken checkbox its like css does not work
https://github.com/SummerRijndael/metronic-tailwind-laravel
well seems like I cannot attach screenshots here as well as google drive share links