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

Credentials icon using wrong size and class name

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Minor Minor
    • credentials-plugin

      The HTML for the credentials configuration link displayed in the sidebar is using the wrong image size - all the rest of the icons are 24x24, but credentials is using 48x48 and the wrong class name (plus multiple size attributes that contradict each other).

      <img src="/static/1b3f74d9/plugin/credentials/images/48x48/credentials.png" style="width: 48px; height: 48px; width: 24px; height: 24px; margin: 2px;" class="icon-credentials-credentials icon-xlg">

      In the above HTML, the source image is 48x48, the class name is icon-xlg, and there are two sets if width and height attributes, one for the correct 24px and one for 48px

      For reference, I included the img tag for the Manage link

      <img src="/static/1b3f74d9/images/24x24/setting.png" style="width: 24px; height: 24px; width: 24px; height: 24px; margin: 2px;" class="icon-setting icon-md">

      For whatever odd reason this to duplicates the width and height attributes, but the source image and all attributes are correctly 24px and the class is icon-md

      Now this actually looks fine in the default Jenkins view, however when using third party themes (in my case the Jenkins Material Theme) it causes a double size credentials icon.

      menu.png

        1. menu2.png
          menu2.png
          52 kB
        2. menu.png
          menu.png
          6 kB

          [JENKINS-33191] Credentials icon using wrong size and class name

          Richard Moss created issue -
          Richard Moss made changes -
          Description Original: The HTML for the credentials configuration link displayed in the sidebar is using the wrong image size - all the reset of the icons are 24x24, but credentials is using 48x48 and the wrong class name (plus multiple size attributes that contradict each other).

          {noformat}<img src="/static/1b3f74d9/plugin/credentials/images/48x48/credentials.png" style="width: 48px; height: 48px; width: 24px; height: 24px; margin: 2px;" class="icon-credentials-credentials icon-xlg">{noformat}

          In the above HTML, the source image is 48x48, the class name is {{icon-xlg}}, and there are two sets if {{width}} and {{height}} attributes, one for the correct {{24px}} and one for {{48px}}

          For reference, I included the img tag for the Manage link

          {noformat}<img src="/static/1b3f74d9/images/24x24/setting.png" style="width: 24px; height: 24px; width: 24px; height: 24px; margin: 2px;" class="icon-setting icon-md">{noformat}

          For whatever odd reason this too duplicates the {{width}} and {{height}} attributes, but the source image and all attributes are correctly {{24px}} and the class is {{icon-md}}

          Now this actually looks fine in the default Jenkins view, however when using third party themes (in my case the [Jenkins Material Theme|https://github.com/jenkins-contrib-themes/jenkins-material-theme/]) it causes a double size credentials icon.

          [^menu.png]
          New: The HTML for the credentials configuration link displayed in the sidebar is using the wrong image size - all the rest of the icons are 24x24, but credentials is using 48x48 and the wrong class name (plus multiple size attributes that contradict each other).

          {noformat}<img src="/static/1b3f74d9/plugin/credentials/images/48x48/credentials.png" style="width: 48px; height: 48px; width: 24px; height: 24px; margin: 2px;" class="icon-credentials-credentials icon-xlg">{noformat}

          In the above HTML, the source image is 48x48, the class name is {{icon-xlg}}, and there are two sets if {{width}} and {{height}} attributes, one for the correct {{24px}} and one for {{48px}}

          For reference, I included the img tag for the Manage link

          {noformat}<img src="/static/1b3f74d9/images/24x24/setting.png" style="width: 24px; height: 24px; width: 24px; height: 24px; margin: 2px;" class="icon-setting icon-md">{noformat}

          For whatever odd reason this to duplicates the {{width}} and {{height}} attributes, but the source image and all attributes are correctly {{24px}} and the class is {{icon-md}}

          Now this actually looks fine in the default Jenkins view, however when using third party themes (in my case the [Jenkins Material Theme|https://github.com/jenkins-contrib-themes/jenkins-material-theme/]) it causes a double size credentials icon.

          [^menu.png]
          Richard Moss made changes -
          Attachment New: menu2.png [ 32061 ]

          Richard Moss added a comment -

          Not sure if this should be in a separate issue, but the Credentials icon is broken on the little menu that appears from the breadcrumb trail as the img src URL is wrong:

          <img src="/static/1b3f74d9/images/48x48/icon-credentials-credentials" width="24" height="24" style="margin: 2px;" alt="">

          menu2.png

          Richard Moss added a comment - Not sure if this should be in a separate issue, but the Credentials icon is broken on the little menu that appears from the breadcrumb trail as the img src URL is wrong: <img src="/static/1b3f74d9/images/48x48/icon-credentials-credentials" width="24" height="24" style="margin: 2px;" alt=""> menu2.png
          Richard Moss made changes -
          Summary Original: Credentials icon using wrong sizes and class name New: Credentials icon using wrong size and class name

          I can confirm the issue and it is related to the class of the image.

           icon-md 

          fixes the issue.

          Christoph Seitz added a comment - I can confirm the issue and it is related to the class of the image. icon-md fixes the issue.

          OK, will fix... unsure where the 48x48 started, but on a retina MBP the 48x48 icons look much better than the 24x24 ones

          Stephen Connolly added a comment - OK, will fix... unsure where the 48x48 started, but on a retina MBP the 48x48 icons look much better than the 24x24 ones
          Stephen Connolly made changes -
          Status Original: Open [ 1 ] New: In Progress [ 3 ]

          Code changed in jenkins
          User: Stephen Connolly
          Path:
          src/main/java/com/cloudbees/plugins/credentials/CredentialsStoreAction.java
          src/main/java/com/cloudbees/plugins/credentials/GlobalCredentialsConfiguration.java
          src/main/java/com/cloudbees/plugins/credentials/SystemCredentialsProvider.java
          src/main/java/com/cloudbees/plugins/credentials/UserCredentialsProvider.java
          src/main/java/com/cloudbees/plugins/credentials/ViewCredentialsAction.java
          src/main/resources/com/cloudbees/plugins/credentials/GlobalCredentialsConfiguration/index.jelly
          http://jenkins-ci.org/commit/credentials-plugin/da3149fbaa6f3b9dd0604a3e03341ce45e240e26
          Log:
          [FIXED JENKINS-33191] Switch Action Icons to icon-md

          • Had some fun with the context menu and management link icons needing to be 48x48

          SCM/JIRA link daemon added a comment - Code changed in jenkins User: Stephen Connolly Path: src/main/java/com/cloudbees/plugins/credentials/CredentialsStoreAction.java src/main/java/com/cloudbees/plugins/credentials/GlobalCredentialsConfiguration.java src/main/java/com/cloudbees/plugins/credentials/SystemCredentialsProvider.java src/main/java/com/cloudbees/plugins/credentials/UserCredentialsProvider.java src/main/java/com/cloudbees/plugins/credentials/ViewCredentialsAction.java src/main/resources/com/cloudbees/plugins/credentials/GlobalCredentialsConfiguration/index.jelly http://jenkins-ci.org/commit/credentials-plugin/da3149fbaa6f3b9dd0604a3e03341ce45e240e26 Log: [FIXED JENKINS-33191] Switch Action Icons to icon-md Had some fun with the context menu and management link icons needing to be 48x48
          SCM/JIRA link daemon made changes -
          Resolution New: Fixed [ 1 ]
          Status Original: In Progress [ 3 ] New: Resolved [ 5 ]

            stephenconnolly Stephen Connolly
            richardmoss Richard Moss
            Votes:
            2 Vote for this issue
            Watchers:
            5 Start watching this issue

              Created:
              Updated:
              Resolved: