style improve

google · Jan 16, 2025 · b8a4d9a · b8a4d9a
1 parent 0aed890
commit b8a4d9a
Show file tree

Hide file tree

Showing 7 changed files with 54 additions and 32 deletions.
diff --git a/internal/output/html/base_image_template.gohtml b/internal/output/html/base_image_template.gohtml
@@ -45,14 +45,14 @@
           {{ $commandDetail := index $commandSet 1 }}
           {{ $diffID := .LayerMetadata.DiffID }}
           {{ $longCommand := false }}
-          {{ if gt (len $command) 100 }}
+          {{ if gt (len $command) 109 }}
             {{ $longCommand = true }}
           {{ end }}
           {{ $hasVuln := false }}
           {{ if gt .Count.AnalysisCount.Regular 0 }}
           {{ $hasVuln = true }}
           {{ end }}
-          <div title="{{ $diffID }}" class="layer-entry {{ if $hasVuln }}clickable{{ end }}" {{ if $hasVuln }}onclick="quickFilterByLayer('{{ $diffID }}', {{ $command }})"{{ end }}>
+          <div title="{{ $diffID }}" class="layer-entry {{ if $hasVuln }}clickable clickable-layer{{ end }}" {{ if $hasVuln }}onclick="quickFilterByLayer('{{ $diffID }}', {{ $command }})"{{ end }}>
             <div {{ if $longCommand }} class="tooltip" {{ end }}>
               <p class="layer-command"><span class="base-image-title">{{ .Index }}</span> {{ $command }}</p>
                 {{ if $longCommand }}

diff --git a/internal/output/html/filter_template.gohtml b/internal/output/html/filter_template.gohtml
@@ -23,7 +23,7 @@
         {{ $commandDetail := index $commandSet 1 }}
         {{ $diffID := .LayerMetadata.DiffID }}
         {{ $longCommand := false }}
-        {{ if gt (len $command) 100 }}
+        {{ if gt (len $command) 109 }}
           {{ $longCommand = true }}
         {{ end }}
 

diff --git a/internal/output/html/package_table_template.gohtml b/internal/output/html/package_table_template.gohtml
@@ -64,28 +64,39 @@
         {{ $command := index $commandSet 0 }}
         {{ $commandDetail := index $commandSet 1 }}
         {{ $longCommand := false }}
-        {{ if gt (len $command) 100 }}
-          {{ $longCommand = true }}
+        {{ if gt (len $command) 109 }}
+        {{ $longCommand = true }}
         {{ end }}
-        <p><span class="package-detail-title">Installed binaries:</span> {{ formatSlice $element.OSPackageNames }}</p>
+        {{ $binaries := formatSlice $element.OSPackageNames }}
+        {{ if not (eq $binaries "") }}
+        <p><span class="package-detail-title">Installed binaries:</span> {{ $binaries }}</p>
+        {{ end }}
+        <div class="layer-command-container">
+          <p><span class="package-detail-title">Layer introduced in:&nbsp;</span></p>
+          <div class="tooltip">
+            <p># {{ $index }} layer</p>
+            <span class="tooltiptext">Diff ID: {{ $diffID }}</span>
+          </div>
+        </div>
         <div class="layer-command-container">
           {{ if $longCommand }}
-          <p class="package-detail-title">Layer introduced in:&nbsp;</p>
+          <p class="package-detail-title">Layer command:&nbsp;</p>
           <div class="tooltip">
-            <p class="layer-command">{{ $index }} {{ $command }}</p>
+            <p class="layer-command">{{ $command }}</p>
             <span class="tooltiptext layer-tooltiptext">{{ $originalCommand }}</span>
           </div>
           {{ else if ne $commandDetail "" }}
+          <p class="package-detail-title">Layer command:&nbsp;</p>
           <div class="tooltip">
-            <span class="layer-command"><span class="package-detail-title">Layer introduced in:</span> {{ $index }} {{ $command }}</span>
+            <p class="layer-command">{{ $command }}</p>
             <span class="tooltiptext">{{ $commandDetail }}</span>
           </div>
           {{ else }}
-          <div class="layer-command"><span class="package-detail-title">Layer introduced in:</span> {{ $index }} {{ $command }}</div>
+          <p class="package-detail-title">Layer command:&nbsp;</p>
+          <p class="layer-command">{{ $command }}</p>
           {{ end }}
         </div>
-        <p><span class="package-detail-title">Layer ID:</span> {{ $diffID }}</p>
-        <p><span class="package-detail-title">In base image:</span> {{ if eq $baseImageIndex 0}} False {{ else }} True ({{ getBaseImageNames $element.LayerDetail.BaseImageInfo }}){{ end }}</p>
+        <p><span class="package-detail-title">In base image:</span> {{ if eq $baseImageIndex 0 }} False {{ else }} True: {{ getBaseImageNames $element.LayerDetail.BaseImageInfo }}{{ end }}</p>
         {{ end }}
         {{ template "vuln_table_template.gohtml" $element }}
       </div>

diff --git a/internal/output/html/style.html b/internal/output/html/style.html
@@ -115,6 +115,11 @@
     overflow: auto;
   }
 
+  .package-details p {
+    margin-bottom: 10px;
+    margin-top: 10px;
+  }
+
   .table-tr:hover .open-in-tab-tag {
     display: inline;
   }
@@ -408,7 +413,7 @@
     width: 100%;
     border: 1px solid #fff;
     background-color: transparent;
-    border-radius: 4px;
+    border-radius: 8px;
     margin-top: 30px;
   }
 
@@ -493,7 +498,7 @@
     width: 1000px !important;
     max-height: 200px;
     overflow-x: hidden;
-    overflow-y: scroll;
+    overflow-y: auto;
   }
 
   .tooltip:hover .tooltiptext {
@@ -551,7 +556,7 @@
   .layer-entry {
     display: flex;
     justify-content: space-between;
-    margin: 0 10px;
+    padding: 0 10px;
     border-bottom: 1px dotted #666666;
   }
 
@@ -580,4 +585,9 @@
   .clickable {
     cursor: pointer;
   }
+
+  .clickable-layer:hover {
+    background-color: rgba(255, 255, 255, 0.04);
+  }
+
 </style>
diff --git a/internal/output/html/vuln_table_template.gohtml b/internal/output/html/vuln_table_template.gohtml
@@ -14,7 +14,7 @@
       {{ $element.ID }}
       {{ else }}
       <div class="tooltip">
-        {{ $element.ID }}
+        <div class="clickable" onclick="openVulnInNewTab('{{ $element.ID }}')">{{ $element.ID }}</div>
         <span class="tooltiptext">Group IDs: {{ join $element.GroupIDs ", " }}</span>
       </div>
       {{ end }}

diff --git a/internal/output/output_result.go b/internal/output/output_result.go
@@ -281,21 +281,6 @@ func populateImageMetadata(result *Result, imageMetadata models.ImageMetadata) {
 		allBaseImages[i].AllLayers = baseImageMap[i]
 	}
 
-	// Display base images in a reverse order
-	slices.SortFunc(allBaseImages, func(a, b BaseImageGroupInfo) int {
-		return cmp.Compare(b.Index, a.Index)
-	})
-
-	result.ImageInfo = ImageInfo{
-		OS:            imageMetadata.OS,
-		AllLayers:     allLayers,
-		AllBaseImages: allBaseImages,
-	}
-
-	if len(allLayers) != 0 {
-		result.IsContainerScanning = true
-	}
-
 	// Fill up Layer info for each package
 	for i := range result.Ecosystems {
 		for j := range result.Ecosystems[i].Sources {
@@ -311,6 +296,22 @@ func populateImageMetadata(result *Result, imageMetadata models.ImageMetadata) {
 			}
 		}
 	}
+
+	// Display base images in a reverse order
+	slices.SortFunc(allBaseImages, func(a, b BaseImageGroupInfo) int {
+		return cmp.Compare(b.Index, a.Index)
+	})
+
+	result.ImageInfo = ImageInfo{
+		OS:            imageMetadata.OS,
+		AllLayers:     allLayers,
+		AllBaseImages: allBaseImages,
+	}
+
+	if len(allLayers) != 0 {
+		result.IsContainerScanning = true
+	}
+
 }
 
 func getAllBaseImages(baseImages [][]models.BaseImageDetails) []BaseImageGroupInfo {

diff --git a/pkg/osvscanner/osvscanner.go b/pkg/osvscanner/osvscanner.go
@@ -317,7 +317,7 @@ func DoContainerScan(actions ScannerActions, r reporter.Reporter) (models.Vulner
 		m, err := osrelease.GetOSRelease(chainLayers[len(chainLayers)-1].FS())
 		OS := "Unknown"
 		if err == nil {
-			OS = m["OSID"]
+			OS = m["PRETTY_NAME"]
 		}
 
 		scanResult.PackageScanResults = make([]imodels.PackageScanResult, len(scalibrSR.Inventories))