Uploaded image for project: 'Jenkins'
  1. Jenkins
  2. JENKINS-44522

Top-level navigation does not show selected state

    XMLWordPrintable

Details

    • Blue Ocean 1.2-beta1, Blue Ocean 1.2-beta2

    Description

      The Blue Ocean interface does not display a selected state for the top-level navigation. This is especially problematic when plugins add additional top-level links to the interface. Because react renders so quickly it can create a usability problem where the user does not recognize that they have navigated to a new page because the links to do not transition to a "selected" state.

      The correct selected state is pictured in the attached screenshot (navigation-selected-state.png) and is already present in the CSS. In fact it's used for run result pages already. We just need to teach React about it for the top links.

       

       

      Attachments

        Issue Links

          Activity

            jlong John Long created issue -
            jlong John Long made changes -
            Field Original Value New Value
            Labels cloudbees-internal-steel
            jlong John Long made changes -
            Labels cloudbees-internal-steel blueocean cloudbees-internal-steel
            jamesdumay James Dumay made changes -
            Epic Link JENKINS-43955 [ 181487 ]
            jlong John Long made changes -
            Description The Blue Ocean interface does not display a selected state for the top-level navigation. This is especially problematic when plugins add additional top-level links to the interface. Because react renders so quickly it can create a usability problem where the user does not recognize that they have navigated to a new page because the links to do not transition to a different state.

            The correct selected state is pictured in the attached screenshot (navigation-selected-state.png) and is already present in the CSS. In fact it's used for [run result pages|https://ci.blueocean.io/blue/organizations/jenkins/admin%2Fdocker-gc/detail/docker-gc/10/pipeline] already. We just need to teach React about it for the top links.

             

             
            The Blue Ocean interface does not display a selected state for the top-level navigation. This is especially problematic when plugins add additional top-level links to the interface. Because react renders so quickly it can create a usability problem where the user does not recognize that they have navigated to a new page because the links to do not transition to a "selected" state.

            The correct selected state is pictured in the attached screenshot (navigation-selected-state.png) and is already present in the CSS. In fact it's used for [run result pages|https://ci.blueocean.io/blue/organizations/jenkins/admin%2Fdocker-gc/detail/docker-gc/10/pipeline] already. We just need to teach React about it for the top links.

             

             
            michaelneale Michael Neale made changes -
            Epic Link JENKINS-43955 [ 181487 ] JENKINS-35761 [ 171656 ]
            michaelneale Michael Neale made changes -
            Assignee Cliff Meyers [ cliffmeyers ]
            cliffmeyers Cliff Meyers made changes -
            Remote Link This issue links to "PR#1157 (Web Link)" [ 17144 ]
            cliffmeyers Cliff Meyers made changes -
            Sprint Blue Ocean 1.2-beta1 [ 336 ]
            cliffmeyers Cliff Meyers made changes -
            Status Open [ 1 ] In Progress [ 3 ]
            cliffmeyers Cliff Meyers made changes -
            Status In Progress [ 3 ] In Review [ 10005 ]
            cliffmeyers Cliff Meyers made changes -
            Remote Link This issue links to "PR#1157 (Web Link)" [ 17146 ]
            cliffmeyers Cliff Meyers made changes -
            Remote Link This issue links to "PR#1157 (Web Link)" [ 17146 ]
            jamesdumay James Dumay made changes -
            Sprint Blue Ocean 1.2-beta1 [ 336 ] Blue Ocean 1.2-beta1, Blue Ocean 1.2-beta2 [ 336, 341 ]
            cliffmeyers Cliff Meyers made changes -
            Resolution Fixed [ 1 ]
            Status In Review [ 10005 ] Resolved [ 5 ]
            jbriden Jenn Briden made changes -
            Status Resolved [ 5 ] Closed [ 6 ]

            People

              cliffmeyers Cliff Meyers
              jlong John Long
              Votes:
              0 Vote for this issue
              Watchers:
              4 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved: