• Icon: Story Story
    • Resolution: Fixed
    • Icon: Minor Minor
    • core
    • None
    • Jenkins 2.248

      Goals of this task

      • Revamp tables and tab styles according to the discovery work performed by the UX SIG.
      • Add a proper suite of CSS variables to improve the themeability of the tabs and tables.

      Design brief

      The design documents are attached to this issue

       

          [JENKINS-63002] Restyle tables and tabs

          The PR has been merged. I have created 2 follow up PRs to improve the looks:

          Félix Queiruga Balado added a comment - The PR has been merged. I have created 2 follow up PRs to improve the looks: Add a compact variant for the tables  https://github.com/jenkinsci/jenkins/pull/4855 Restyle sortable headers  https://github.com/jenkinsci/jenkins/pull/4853

          Oleg Nenashev added a comment -

          Released in Jenkins 2.248

          Oleg Nenashev added a comment - Released in Jenkins 2.248

          Bruce Coveny added a comment -

          The new layout for tabs does not look very good.  With longer tab names in our system they change the height of every tab.  With large number of tabs it adds a scroll bar under the tabs so now to get to a later tab you have to scroll over and do not get to see all tabs when loading the UI.

           

          Bruce Coveny added a comment - The new layout for tabs does not look very good.  With longer tab names in our system they change the height of every tab.  With large number of tabs it adds a scroll bar under the tabs so now to get to a later tab you have to scroll over and do not get to see all tabs when loading the UI.  

          bcoveny can you please raise a bug so it can be backported if needed? 

          The height change looks weird. About the scrollbar, what was the previous behaviour? 

          Félix Queiruga Balado added a comment - bcoveny can you please raise a bug so it can be backported if needed?  The height change looks weird. About the scrollbar, what was the previous behaviour? 

          Playing around with this a bit this would be the easiest solution:

           

          This is also consistent with what Bootstrap does:

          Would this solution be similar to the previous behaviour?

          Félix Queiruga Balado added a comment - Playing around with this a bit this would be the easiest solution:   This is also consistent with what Bootstrap does: Would this solution be similar to the previous behaviour?

          Bruce Coveny added a comment -

          fqueiruga

          Yes the previous look was like you showed.

           

          That would look better for the image that you displayed and be consistent with the feel that Jenkins has been at.

          Do you still want me to create a new Jira issue?

           

           

          Bruce Coveny added a comment - fqueiruga Yes the previous look was like you showed.   That would look better for the image that you displayed and be consistent with the feel that Jenkins has been at. Do you still want me to create a new Jira issue?    

          Great. Yes, please create the Jira bug and link it to this one. The reason is that it will be needed for the fix to be backported into a stable release.

          Félix Queiruga Balado added a comment - Great. Yes, please create the Jira bug and link it to this one. The reason is that it will be needed for the fix to be backported into a stable release.

          Bruce Coveny added a comment -

          fqueiruga I have created and linked JENKINS-63180, let me know if anything further necessary.  THANKS!!

          Bruce Coveny added a comment - fqueiruga I have created and linked JENKINS-63180 , let me know if anything further necessary.  THANKS!!

          No problem, we'll look at it!

          Félix Queiruga Balado added a comment - No problem, we'll look at it!

            Unassigned Unassigned
            fqueiruga Félix Queiruga Balado
            Votes:
            0 Vote for this issue
            Watchers:
            5 Start watching this issue

              Created:
              Updated:
              Resolved: