Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-31470

Fix topNav Bar alignment and usability issues

    XMLWordPrintable

    Details

    • Type: (Deprecated) Contributed Patch
    • Status: Verified
    • Priority: Major
    • Resolution: Fixed
    • Affects Version/s: 11.0
    • Fix Version/s: 11.1, 12.0
    • Component/s: Reference
    • 11 status:
      Resolved

      Description

      There are a number of issues with the alignment and positioning of the items in the top bar. They should be vertically centred across the bar to present balance. Some examples of the issues that existed before my patch include:

      On mobile:

      Top Bar:

      Account Menu:

      Account Menu with Profile disabled:

      There are also issues with the colours that have been used, especially when the Home site isn't included as a site like the others, but is still represented in the top corner. For example, in the following screenshot, how will a user know which site is selected?

      Please see the Attachments section for all of my Before and After screenshots.

        Gliffy Diagrams

          Attachments

          1. 01-gateway-before.png
            01-gateway-before.png
            58 kB
          2. 02-gateway-after.png
            02-gateway-after.png
            60 kB
          3. 03-gatewayMobile-before.png
            03-gatewayMobile-before.png
            17 kB
          4. 04-gatewayMobile-after.png
            04-gatewayMobile-after.png
            17 kB
          5. 05-topNav-before.png
            05-topNav-before.png
            20 kB
          6. 06-topNav-after.png
            06-topNav-after.png
            19 kB
          7. 07-topNavInSite-before.png
            07-topNavInSite-before.png
            19 kB
          8. 08-topNavInSite-after.png
            08-topNavInSite-after.png
            21 kB
          9. 09-accountMenu-before.png
            09-accountMenu-before.png
            94 kB
          10. 10-accountMenu-after.png
            10-accountMenu-after.png
            98 kB
          11. 11-sitesMenu-before.png
            11-sitesMenu-before.png
            35 kB
          12. 12-sitesMenu-after.png
            12-sitesMenu-after.png
            40 kB
          13. 13-selectedSiteQuickToolsMenu-before.png
            13-selectedSiteQuickToolsMenu-before.png
            32 kB
          14. 14-selectedSiteQuickToolsMenu-after.png
            14-selectedSiteQuickToolsMenu-after.png
            36 kB
          15. 15-otherSiteQuickToolsMenu-before.png
            15-otherSiteQuickToolsMenu-before.png
            38 kB
          16. 16-otherSiteQuickToolsMenu-after.png
            16-otherSiteQuickToolsMenu-after.png
            40 kB
          17. 17-accountMenuWithProfileMobile-before.png
            17-accountMenuWithProfileMobile-before.png
            48 kB
          18. 18-accountMenuWithProfileMobile-after.png
            18-accountMenuWithProfileMobile-after.png
            45 kB
          19. 19-toolsMenuMobile-before.png
            19-toolsMenuMobile-before.png
            25 kB
          20. 20-toolsMenuMobile-after.png
            20-toolsMenuMobile-after.png
            26 kB
          21. 21-sitesMenuMobile-before.png
            21-sitesMenuMobile-before.png
            23 kB
          22. 22-sitesMenuMobile-after.png
            22-sitesMenuMobile-after.png
            25 kB
          23. 23-mobileNoProfile-before.png
            23-mobileNoProfile-before.png
            20 kB
          24. 24-mobileNoProfile-after.png
            24-mobileNoProfile-after.png
            22 kB
          25. 25-accountMenuNoProfileMobile-before.png
            25-accountMenuNoProfileMobile-before.png
            38 kB
          26. 26-accountMenuNoProfileMobile-after.png
            26-accountMenuNoProfileMobile-after.png
            39 kB
          27. 27-accountMenuNoProfile-before.png
            27-accountMenuNoProfile-before.png
            74 kB
          28. 28-accountMenuNoProfile-after.png
            28-accountMenuNoProfile-after.png
            75 kB

            Issue Links

            depends on

            Feature Request - Functionality that you would like to see in Sakai. SAK-31402 Provide more finer grained variables to ease custom skin development

            • Major - Major loss of function or need for functionality in production in the near future.
            • Verified
            is depended on by

            Bug - A problem which impairs or prevents functionality of the product. SAK-31482 Height difference of a selected site

            • Minor - Minor loss of function, problem where easy workaround is present, or functionality which would be nice to have.
            • Verified
            is related to

            Bug - A problem which impairs or prevents functionality of the product. SAK-31678 Reload message is displayed on 2 lines

            • Major - Major loss of function or need for functionality in production in the near future.
            • CLOSED
            relates to

            Bug - A problem which impairs or prevents functionality of the product. SAK-31655 $logo-width is no longer respected in skins

            • Critical - Crashes, loss of data, severe memory leak, need functionality ASAP in production.
            • CLOSED

              Activity

                People

                • Assignee:
                  Gnapika Reddy Kudumula Gnapika Reddy Kudumula
                  Reporter:
                  sfoster9 Shawn Foster
                • Votes:
                  1 Vote for this issue
                  Watchers:
                  4 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved:

                    Git Source Code