SALE! Get up to -50% off on our Grand Spa Theme limited time offer will be ended on 29 June so hurry up!

Okay
  Public Ticket #1203620
Theme Customization
Open

Comments

  • Shlomi Butansky started the conversation

    Hi, 

    Few questions to the experts... :-)

    1. I would like to reduce the spacing between the menu items of the mobile menu. How can I do that? (see image001.jpg)

    2. I would like to reduce the space between the images on gallery (see image002.jpg)

    3. How can I cancel the effect on the gallery to show the image as it without having it a bit zoomed in while hovering it?

    Thanks

    Shlomi

    Attached files:  image001.jpg
      image002.jpg

  •  1,006
    Dake replied

    Hey Shlomi,

    Thank you for purchasing our Photography theme

    1. Please try inserting the below css into your custom css for desktop (theme settings>script>custom css for desktop):

    .mobile_main_nav li a {
        line-height: 2.5em !important;
    }

    2. Please also insert the below:

    .three_cols.gallery .element {
        width: 32.2% !important;
        margin-right: 1% !important;
    }

    3. Please also insert the below:

    .three_cols.gallery .element:hover img {
        -ms-transform: scale(1)!important;
        -moz-transform: scale(1)!important;
        -o-transform: scale(1)!important;
        -webkit-transform: scale(1)!important;
        transform: scale(1)!important;
        transition: all 4.5s ease-out!important;
        -webkit-transition: all 4.5s ease-out!important;
    }

    Kind regards,
    Dake

  • Shlomi Butansky replied

    Hi Dake, 

    Adding the below CSS code caused the gallery to not be shown correctly on mobile:

    .three_cols.gallery .element {
         width: 32.2% !important;    
         margin-right: 1% !important;
    }

    Do you have any idea how to make it shown good on mobile?

    Thanks,

    Shlomi

  •  1,006
    Dake replied

    Hey Shlomi,

    Thank you for keeping me posted

    Please replace the previous css with the below so it only affects desktop screens:

    @media only screen and (min-width: 1200px) {
    .three_cols.gallery .element {
         width: 32.2% !important;    
         margin-right: 1% !important;
    }
    }

    Kind regards,
    Dake