Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #978929

    I am using a pricing table on my home page and would like to give it certain styles.

    Every second row I would like to have the background colour gray (#f2f2f2)

    The bottom row (pricing row) needs to be a smaller text (but I can’t see where that is set)
    Is it possible to round the corners of the table?
    Is it possible to have the fullwidth easy slider bigger on the mobile version of the site? At the moment it is very narrow and the caption text is over lapping the images.

    Once again, I LOVE this theme and the support is top notch.
    Look forward to hearing from you
    Cheers
    Kim

    #979645

    Hey bauchope,
    When I look at your table the background color for all of the rows are #f2f2f2, so I wrote the css to make the other rows white.
    I was not sure what font size you wanted for the pricing row, so I made it half size, 30px, please feel free to adjust to suit.
    I also added a 8px border-radius, but again feel free to adjust to suit.
    This is the css I added to your WordPress > Customize > Additional CSS:

    #top.home .avia_pricing_minimal.avia-table-1 .pricing-table>li:nth-child(even) {
        background: #fff !important;
    }
    #top.home .avia_pricing_minimal.avia-table-1 .pricing-table li.avia-pricing-row {
        font-size: 30px !important; 
    }
    #top.home .avia_pricing_minimal.avia-table-1 .pricing-table>li {
        border-radius: 8px;
    }
    #top.home .avia_pricing_minimal.avia-table-1 .pricing-table {
        box-shadow: none !important; 
    }

    For your full width easy slider on mobile, I added this css to your WordPress > Customize > Additional CSS:

    @media only screen and (max-width: 480px) {
        ul.avia-slideshow-inner {
            min-height: 150px !important;
            height: 150px !important;
        }
    
        .av_slideshow_full li,
        .av_slideshow_full .avia-slide-wrap,
        .av_slideshow_full li img {
            height: 100% !important;
        }
    
    }

    Please clear your browser cache and check.

    Best regards,
    Mike

    #980043

    Morning Mike,
    thanks very much for this. The table looks much better. I’ll play around with the colurs etc once they have been agreed.

    The slider on the mobile id deeper but the images are now stretched and look odd. (only in portrait) I might have to just leave it as it was if that is the effect of making the slider deeper.

    Once again, many thanks for your help

    Kim

    #981369

    Hi,

    Yea unfortunately it would require to target all the views and it is a bit a lot of code and work to make it happen properly.

    Best regards,
    Basilis

    #981480

    Hi again,

    Have removed the css that changed the slider for mobile but now the images are still stretched and out of proportion. Can I get it to go back to what it was before?

    i have cleared my mobile cache and it still seems to be out of proportion.

    Your help would be appreciated.

    many thanks in advance
    Kim

    #981780

    Hi,
    I took a look and found that the code for the mobile view of the slider was still in place at WordPress > Customize > Additional CSS
    so I removed it. I then refreshed my browser and it seems that it is back to the way it was before.
    Please see screenshot in Private Content area, is this correct and how it looks for you?
    If not can you please post a screenshot.
    Also please try using an incognito or private window.

    Best regards,
    Mike

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.