Shop Categories

X

Reply To: different size of tablet

Home Forums Agama Pro different size of tablet Reply To: different size of tablet

#24194
Zex
Moderator

Hello, Anton!

You have not written whether you want to change it on larger screens or smaller ones.

In any case, I do not recommend changing it on smaller screens then 992px, as your menu will be difficult to read.

If you would like to display your mobile menu earlier than 992 px, insert the following codes into
Customizing->General->Additional CSS:

@media screen and (max-width: 1100px){
#site-navigation, #top-bar-wrap, .sticky-header nav {
    display: none!important;
}
.mobile-menu-icons {
    display: block!important;
    line-height: 87px;
}
    .mobile-menu-icons li {
    display: inline-block!important;
}
    .mobile-menu-icons .cart_count:before {
    border-color: transparent #a2c605 transparent;
    border-style: solid solid solid none;
    border-width: 5px 5px 5px medium;
    content: "";
    height: 0;
    left: -3px;
    margin-top: 5px;
    position: absolute;
    top: 0;
    width: 0;
}
    .mobile-menu-icons .cart_count {
    display: inline-block!important;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
    position: relative;
    font-weight: 600;
    right: 0;
    background: #a2c605;
    width: 20px;
    height: 20px;
    color: #fff;
    z-index: 10000;
    border-radius: 2px;
    top: -3px;
}
    mobile-menu-icons li {
    padding-right: 5px;
}
    .mobile-menu-icons .shopping_cart:before {
    font-family: 'FontAwesome';
    font-size: 19px !important;
    content: '\f291';
    position: relative;
    right: 5px;
}
}

Change the max-width value in the very top line according to your needs.

Greetings