Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • August 25, 2017 at 10:55 pm #844234
    Trent Dyrsmid

    Hi, the table is located on this page: http://brightideas.co/amazon-business-systems-scale/

    Currently, both columns have blue header rows. I would like to be able to replace all the blue in the first column with a ligher shade of blue.

    August 26, 2017 at 10:06 pm #844449
    Mike

    Hey Trent,
    Try this code in the General Styling > Quick CSS field:

    .avia-highlight-col li.avia-heading-row, .avia-highlight-col .pricing-extra, .avia-highlight-col  li.avia-pricing-row {background-color: #3e6d99!important; }

    This changes the background-color of the second column to the color it is now, this will allow you to first change the color of both columns to the lighter color you want for the first column in the editor, then use this code.
    The second column has additional class called “avia-highlight-col” so we could target it, while targeting the first column changed the colors of both.

    Best regards,
    Mike

    August 28, 2017 at 7:00 pm #844974
    Trent Dyrsmid

    Mike,

    Thanks for sending the code. I copied it into the Quick CSS spot and nothing changed. Both columns remain the same color of blue that there were before I inserted the code snippet you provided.

    Perhaps you think I know how to write CSS? I don’t. My skills are limited to copy/paste and perhaps changing a color code number.

    I need instructions that are: step 1: do this, step 2: do this, etc…

    Thanks,
    Trent

    August 30, 2017 at 3:44 pm #845845
    Victoria

    Hi Trent,

    The code Mike gave you is applied, it’s just that there is not a huge difference in color, so it might seem, like nothing has changed.
    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
.main_color .pricing-table li.avia-heading-row,
.main_color .avia-highlight-col li.avia-heading-row, 
.main_color .avia-highlight-col .pricing-extra, 
.main_color .avia-highlight-col  li.avia-pricing-row {background-color: #3e6d99 !important; }

    To test this code, you can write “red” instead of hex color and you will see that it gets applied.
    If you need further assistance please let us know.
    Best regards,
    Victoria

    August 30, 2017 at 9:22 pm #845966
    Trent Dyrsmid
    This reply has been marked as private.
    August 31, 2017 at 5:12 pm #846404
    Sarah

    Hi Trent,

    Please you try this code instead:

    .main_color .pricing-table-wrap:first-child .pricing-table li.avia-heading-row,
.main_color .pricing-table-wrap:first-child .pricing-table li.avia-heading-row .pricing-extra
.main_color .pricing-table-wrap:first-child .pricing-table li.avia-pricing-row {background-color:#578adb !important;}

    This should change the background colors of the header and pricing rows of the first column to #578adb, the color of your button.

    If that doesn’t work either, we may need temporary admin access into your website so that we can take a closer look.

    Best regards,
    Sarah

    September 1, 2017 at 7:56 pm #846971
    Trent Dyrsmid

    Hi Sarah,

    That didn’t work. temp login details are in the private content area of the original ticket.

    September 2, 2017 at 6:00 am #847062
    John Torvik

    Hi,

    Try this code:

    
.main_color .pricing-table-wrap:first-child .pricing-table li.avia-heading-row,
.main_color .pricing-table-wrap:first-child .pricing-table li.avia-heading-row .pricing-extra,
.main_color .pricing-table-wrap:first-child .pricing-table li.avia-pricing-row {background-color:#578adb !important;}

    I added the “,” in the second rule.

    Best regards,
    John Torvik

    September 4, 2017 at 10:32 pm #847921
    Trent Dyrsmid

    Still no change. Both columns are the same color.

    September 5, 2017 at 11:06 am #848038
    Mike

    Hi,
    I was unable to login, please check user & password

    Best regards,
    Mike

    September 5, 2017 at 10:32 pm #848354
    Trent Dyrsmid

    Add credentials to Private Content

    September 6, 2017 at 11:13 am #848539
    Mike

    Hi,
    OK, I have checked your Quick CSS and found you have javascript mixed in braking the css rules. I moved the css above the javascript and it works fine now. Please see screenshot in private content area. Please clear your cache.

    Best regards,
    Mike

    September 6, 2017 at 6:58 pm #848804
    Trent Dyrsmid

    That worked. Thanks so much!

    September 7, 2017 at 2:32 am #848900
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Need to change the color column 1 of the pricing table’ is closed to new replies.