Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 29, 2022 at 4:34 am #1366825
    navindesigns

    HI,

    I am trying to make my progress bar look like my mockup.

    Mockup
    Screen-Shot-2022-09-28-at-10-31-46-PM

    Dev Site
    https://gideonfranchise.flywheelsites.com/ (see login below)

    How can I

    1- Make the text go into the progress bar
    2- How can I make it solid colors like my mockup instead of stripes?

    Thanks

    • This topic was modified 2 years, 2 months ago by navindesigns.
    September 29, 2022 at 10:04 am #1366864
    Ismael

    Hey navindesigns,

    Thank you for the inquiry.

    What is the other bar beside the title inside the progress bar? You can adjust the position of the title with this css code.

    .avia-progress-bar .progressbar-title-wrap {
    left: 78%;
}

    The value of the left position will be based on the value of the Content > Progress in % settings. This will have to be adjusted for each progress bar, so applying a custom css class name or ID to the element might be necessary.

    Best regards,
    Ismael

    September 29, 2022 at 3:53 pm #1366930
    navindesigns

    That did not work

    it moved the text to the right side
    I added the correct login below for you to see the preview on the dev site

    September 30, 2022 at 12:37 pm #1367087
    Mike

    Hi,
    Thanks for the mockup and link to your site, please try this css instead:

    #av_section_2 .avia-progress-bar .progressbar-title-wrap {
    left: 70%;
    top: 7px;
    position: absolute;
}

    expected results:
    2022-09-30_001.jpg

    Best regards,
    Mike

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