Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Visual issues with output results #77

Open
a-poluyanov opened this issue Sep 14, 2024 · 0 comments
Open

Visual issues with output results #77

a-poluyanov opened this issue Sep 14, 2024 · 0 comments

Comments

@a-poluyanov
Copy link

a-poluyanov commented Sep 14, 2024

I actively use your extension for my Azure DevOps server and I ask you to answer, do you want to improve its visual part?

  1. For example, I have 12 services being collected for my release, here are my test screenshots, note that there are 12 scans. At first, everything looks normal enough?
img1
  1. But as soon as we want to look at all these 12 scans - real hell begins!
img2
  1. My first suggestion: Give the ability to rewrite the names of the tabs, so that it is clearer, since the name of the image that we are scanning is already on every corner and it would be convenient if the tabs reflected the short name of the service - which we are scanning. Look, this already makes the view more compact, you can simply add a variable tabName
- task: AquaSecurityOfficial.trivy-official.custom-build-release-task.trivy@1
    displayName: 'Scan all vulnerabilitie1s'
    inputs:
      version: $(TrivyVersion)
      docker: $(InDocker)
      image: 'docker-registry.my-company.io/projects/test/superset-superset:2.1.0-test'
      tabName: 'superset-superset:2.1.0-test' #This
      ignoreUnfixed: true
      exitCode: 0
      options: '--scanners vuln --cache-dir /tmp/trivy-cache --report all'
img3
  1. But that's not all, it doesn't solve the problem that the tabs go to the right endlessly, I suggest doing it this way
    I solved it by changing
<div aria-posinset="1" aria-selected="true" aria-setsize="12" class="bolt-tab focus-treatment flex-noshrink selected" data-focuszone="focuszone-2" id="__bolt-tab-0" role="tab" tabindex="0"></div>

Here you need to remove class flex-noshrink and add this style to your Tabs.css on line 123

.bolt-tabbar-tabs.tall .bolt-tab {
    # Your other parameters
    flex-shrink: 2;
}
img4
  1. And I also don't understand why you're making an indent here? We don't have that much space to just take it away.
img5 I suggest changing this value from `100px` to `20px`

The final version looks like this and it becomes much more convenient, what do you think? If you need help with the finalization and you are ready to accept it, I can create a Pull Request to your repository.

img6
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant