CSS:
@media screen and (min-width: 768px) { /* stop subcategory depth at 2 for desktop, but allow mobile to expand accordingly */
.top-menu[data-depth="2"]{
display:none!important;
}
}
.top-menu .sub-menu ul[data-depth="1"]>li{float:none;}
.top-menu .sub-menu {width: auto; min-width: auto;}
.popover {left: unset;}
.block-categories .collapse-icons {right: -30px;}
/* Main Menu Settings 2 ---------------------------- */
/* Menü ana kapsayıcısını ortalamak için */
.menu.js-top-menu {
display: flex;
justify-content: center; /* Ortalamak için */
align-items: center; /* Dikey olarak ortalamak için */
width: 100%; /* Tüm genişliği kaplaması için */
}
/* Menü öğelerini yatay olarak sıralamak için */
.menu.js-top-menu .top-menu {
display: flex;
justify-content: center; /* Menü öğelerini ortalamak için */
}Yukarıdaki kodlardan "Main Menu Settings" isimli kodun amacı alt kategorilerin dikey olarak açılmasını sağlamak.
"Main Menu Settings 2" isimli kodun amacı ise kategori modülünü sayfaya ortalamak.
Bu iki kodu aynı anda çalıştırınca ilk kod çalışmıyor.
Bahsi geçen olay aşağıdaki gibi olacak.
1. kodun amacı alt kategorileri dikey olarak aşağıya doğru açmak
2. kodun amacı ise menüyü ortalamak.
2. kod çalışır hâle gelince menü ortalanıyor fakat alt kategoriler dikey olarak aşağıya doğru açılmıyor. Yatay olarak açılıyor. (2. görseldeki gibi)
