Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-53698

Progress percent sign not showing when the progress bar's width is shorter than the percent text

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 3.1
    • Fix Version/s: 3.1
    • Component/s: Competencies
    • Labels:
    • Testing Instructions:
      Hide
      • Go to the learning plan template page and check that the progress bars and texts are displayed correctly
      • Go to the course competencies page and check that the progress bar and text are displayed correctly
      • Go to the plan detail page and check that the progress bar and text are displayed correctly
      Show
      Go to the learning plan template page and check that the progress bars and texts are displayed correctly Go to the course competencies page and check that the progress bar and text are displayed correctly Go to the plan detail page and check that the progress bar and text are displayed correctly
    • Affected Branches:
      MOODLE_31_STABLE
    • Fixed Branches:
      MOODLE_31_STABLE
    • Pull Master Branch:
      MDL-53698_master

      Description

      The percent sign in the percent text is not being displayed when the bar's width is shorter than the text.

      For example, for a progress bar with 0 percent progress, the percent text shows 0.0 only. If the progress bar's progress is 20% it shows 20.0 only. Setting the overflow property of the progress div to auto, we'll see that the % sign is moved to another line.

      Some solutions that I can think of are as follows:

      1. Quick hack: Remove space between the number and the percent sign.
      2. Overlay the text on top of the bar div. (Then perhaps align it in the middle of the progress bar)

        Attachments

        1. example2.PNG
          example2.PNG
          36 kB
        2. example3.PNG
          example3.PNG
          34 kB
        3. example4.PNG
          example4.PNG
          35 kB
        4. exapmle1.PNG
          exapmle1.PNG
          43 kB

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                4 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  23/May/16