From 2638cfd2c8e2925f47c4d082f2813c0990c71a9a Mon Sep 17 00:00:00 2001 From: Jamon Camisso Date: Wed, 23 Aug 2023 10:32:34 -0400 Subject: [PATCH] Add dynamic vulnerability and image comparison pages (#943) Signed-off-by: ltagliaferri Signed-off-by: Jamon Camisso Co-authored-by: ltagliaferri --- assets/js/rumble.js | 13 - assets/js/rumble/base.js | 44 +++ assets/js/rumble/comparison.js | 146 ++++++++ assets/js/rumble/vulnerability.js | 118 +++++++ assets/scss/common/_mobile.scss | 15 +- assets/scss/common/_theming.scss | 313 +++++++++-------- assets/scss/rumble.scss | 318 ++++++++++++++++++ .../debugging-distroless-images.md | 5 +- content/chainguard/chainguard-images/faq.md | 7 +- .../chainguard-images/images-compared.md | 4 +- .../chainguard-images/network-requirements.md | 4 +- .../chainguard-images/reference/_index.md | 5 +- .../using-the-tag-history-api.md | 4 +- .../chainguard-images/videos/_index.md | 10 +- .../vuln-comparison/_index.md | 48 +++ .../chainguard-images/vuln-comparison/bash.md | 13 + .../vuln-comparison/busybox.md | 13 + .../chainguard-images/vuln-comparison/deno.md | 13 + .../chainguard-images/vuln-comparison/git.md | 13 + .../chainguard-images/vuln-comparison/go.md | 13 + .../vuln-comparison/gradle.md | 13 + .../vuln-comparison/jenkins.md | 13 + .../vuln-comparison/kube-state-metrics.md | 13 + .../vuln-comparison/mariadb.md | 13 + .../vuln-comparison/maven.md | 13 + .../vuln-comparison/minio-client.md | 13 + .../vuln-comparison/minio.md | 13 + .../vuln-comparison/nginx.md | 13 + .../chainguard-images/vuln-comparison/node.md | 13 + .../chainguard-images/vuln-comparison/php.md | 13 + .../vuln-comparison/python.md | 13 + .../vuln-comparison/rabbitmq.md | 13 + .../chainguard-images/vuln-comparison/ruby.md | 13 + .../chainguard-images/vuln-comparison/rust.md | 13 + .../vuln-comparison/wait-for-it.md | 13 + .../vuln-comparison/wolfi-base.md | 13 + content/vulnerabilities/index.md | 12 + data/rumble.json | 2 + layouts/_default/list.html | 6 +- layouts/article/single.html | 3 +- layouts/partials/head/script-header.html | 6 +- layouts/partials/rumble-comparison.html | 80 +++++ layouts/partials/rumble-vuln.html | 36 ++ layouts/shortcodes/rumble.html | 9 +- nginx.conf | 6 +- static/go-logo-white.svg | 1 + 46 files changed, 1299 insertions(+), 189 deletions(-) delete mode 100644 assets/js/rumble.js create mode 100644 assets/js/rumble/base.js create mode 100644 assets/js/rumble/comparison.js create mode 100644 assets/js/rumble/vulnerability.js create mode 100644 assets/scss/rumble.scss create mode 100644 content/chainguard/chainguard-images/vuln-comparison/_index.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/bash.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/busybox.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/deno.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/git.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/go.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/gradle.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/jenkins.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/kube-state-metrics.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/mariadb.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/maven.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/minio-client.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/minio.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/nginx.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/node.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/php.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/python.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/rabbitmq.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/ruby.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/rust.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/wait-for-it.md create mode 100644 content/chainguard/chainguard-images/vuln-comparison/wolfi-base.md create mode 100644 content/vulnerabilities/index.md create mode 100644 layouts/partials/rumble-comparison.html create mode 100644 layouts/partials/rumble-vuln.html create mode 100644 static/go-logo-white.svg diff --git a/assets/js/rumble.js b/assets/js/rumble.js deleted file mode 100644 index a40667b0f1..0000000000 --- a/assets/js/rumble.js +++ /dev/null @@ -1,13 +0,0 @@ -document.addEventListener("DOMContentLoaded", function(event){ - moveRumble(); -}); - -function moveRumble() { - let getIt = document.querySelector('#get-it'); - let rumble = document.querySelector('#rumble'); - let newRumble = rumble.cloneNode(true); - if (getIt !== null) { - rumble.remove(); - getIt.insertAdjacentElement('beforebegin', newRumble); - } -}; diff --git a/assets/js/rumble/base.js b/assets/js/rumble/base.js new file mode 100644 index 0000000000..0f6c9f3c85 --- /dev/null +++ b/assets/js/rumble/base.js @@ -0,0 +1,44 @@ +import * as d3 from "https://cdn.jsdelivr.net/npm/d3@7/+esm"; + +// colour coding for sevrity on vulnerabilty info pages +const severityColours = { + Critical: "#F236F6", + High: "#3443F4", + Medium: "#1F2892", + Low: "#16C0D7", + Negligible: "#C5C5C5", + Unknown: "#8C8C8C" +} + +// used on image comparison and vulnerability info page search fields +const searchFilter = document.querySelector("#filterInput"); +const severityPicker = document.querySelector("#severity-picker"); +if (searchFilter !== null) { + searchFilter.value = null; + searchFilter.addEventListener("keyup", () => { + let filter = document.getElementById("filterInput").value.toLowerCase(); + filterTable("rumble-images-external", filter); + filterTable("rumble-images-chainguard", filter); + if (severityPicker != null) { + severityPicker.querySelector("label span").innerHTML = `Severity`; + } + }); +} + +// taken from https://www.delftstack.com/howto/javascript/javascript-filter-table/ +function filterTable(tableId, filter) { + var table, tr, i, j; + table = document.getElementById(tableId); + tr = table.getElementsByTagName("tr"); + for (i = 1; i < tr.length; i++) { + tr[i].style.display = "none"; + const tdArray = tr[i].getElementsByTagName("td"); + for (var j = 0; j < tdArray.length; j++) { + const cellValue = tdArray[j]; + if (cellValue && cellValue.innerHTML.toLowerCase().indexOf(filter) > -1) { + tr[i].style.display = ""; + break; + } + } + } +} \ No newline at end of file diff --git a/assets/js/rumble/comparison.js b/assets/js/rumble/comparison.js new file mode 100644 index 0000000000..a7765804df --- /dev/null +++ b/assets/js/rumble/comparison.js @@ -0,0 +1,146 @@ +// used on an image's vulnerability comparison page + +const image = document.location.pathname.replace(/\/$/, "").split("/").pop(); +console.log(image); +const data = await d3.csv(`https://storage.googleapis.com/chainguard-academy/cve-data/${image}.csv`); +const displayColumns = ["Package", "Version", "Vulnerability", "Severity"]; +const dataColumns = ["package", "version", "vulnerability", "s"]; +const dataSorted = sortData(); + +makeTable("#rumble-images-external", dataSorted.theirs, dataSorted.theirVulns); +makeTable("#rumble-images-chainguard", dataSorted.ours, dataSorted.ourVulns); + +function sortData() { + let theirs = [], + ours = []; + + data.forEach(function (row) { + if (row.image.startsWith("cgr.dev")) { + ours.push(row); + } else { + theirs.push(row); + } + }); + + let theirVulns = []; + let ourVulns = []; + + theirs.forEach(function (row) { + if (!(theirVulns.includes(row.vulnerability, 0))) { + theirVulns.push(row.vulnerability) + } + }) + + ours.forEach(function (row) { + if (!(ourVulns.includes(row.vulnerability, 0))) { + ourVulns.push(row.vulnerability) + } + }) + + return { "theirs": theirs, "ours": ours, "theirVulns": theirVulns, "ourVulns": ourVulns } +}; + +function makeTable(id, sortedData, vulnIDs) { + var table = d3.select(id).append("table"), + thead = table.append("thead"), + tbody = table.append("tbody"); + + // append the header row + thead.append("tr") + .selectAll("th") + .data(function () { + return displayColumns.map(function (column) { + if (column == "Vulnerability") { + let count = vulnIDs.length; + column = `ID [${count} unique]` + } + return column; + }) + }) + .enter() + .append("th") + .text(function (column) { return column; }); + + + + // create a row for each object in the data + var rows = tbody.selectAll("tr") + .data(sortedData) + .enter() + .append("tr"); + + // create a cell in each row for each column + rows.selectAll("td") + .data(function (row) { + return dataColumns.map(function (column) { + let val = row[column]; + if (column == "vulnerability") { + let isProd = getEnvUrl(); + if (isProd) { + val = `${val}` + } else { + val = `${val}` + } + } + if (column == "s") { + val = `⬤${val}` + } + return { column: column, value: val }; + }); + }) + .enter() + .append("td") + .html(function (d) { return d.value; }); + + if (vulnIDs.length == 0) { + document.querySelector(id).insertAdjacentHTML("beforeend", `

No vulnerabilities detected

`); + return; + } +}; + +// toggles between absolute and ?id= URLs for each page when rendering table links +function getEnvUrl() { + let host = document.location.host; + if (host.match(`.+netlify.com.+`)) { + return false + } else if (host.match(`localhost:1313`)) { + return false + } else { + return true + } +}; + +severityPicker.addEventListener("click", function (event) { + if (event.target.tagName == "INPUT" || event.target.tagName == "LABEL") { + return; + } + severityPicker.querySelector(".dropdown-content").visiblity = "hidden"; + severityPicker.querySelector('input[type = "checkbox"]').checked = false; + + let filter = event.target.dataset.severity.toLowerCase(); + filterTable("rumble-images-external", filter); + filterTable("rumble-images-chainguard", filter); + + if (event.target.dataset.severity == "") { + severityPicker.querySelector("label span").innerHTML = `Severity`; + return; + } + + severityPicker.querySelector("label span").innerHTML = `⬤${event.target.dataset.severity}`; + searchFilter.value = null; +}); +severityPicker.addEventListener("mouseleave", function (event) { + // severityPicker.querySelector(".dropdown-content").visiblity = "hidden"; + severityPicker.querySelector('input[type = "checkbox"]').checked = false; +}); + +const tds = document.querySelectorAll("#rumble .tables table tbody tr td"); +tds.forEach(function (td) { + let href = td.parentNode.childNodes[2].childNodes[0].href; + + td.addEventListener("click", function () { + document.location = href; + }); + +}) diff --git a/assets/js/rumble/vulnerability.js b/assets/js/rumble/vulnerability.js new file mode 100644 index 0000000000..c93a035c4b --- /dev/null +++ b/assets/js/rumble/vulnerability.js @@ -0,0 +1,118 @@ +// fetches and renders information about individual vulnerabilities + +const displayColumns = ["Image", "First Detected", "Last Detected", "Days Vulnerable"]; +const dataColumns = ["image", "first_seen", "last_seen", "duration"]; +const id = getVulnID(); + +const data = await getData(`https://storage.googleapis.com/chainguard-academy/vulnerability-info/${id}.json`); + +showTitle(); +showVuln(); + +function getVulnID() { + let id = ""; + let host = document.location.host; + if (host.match(`.+netlify.app:443`) || host == "localhost:1313") { + id = new URLSearchParams(document.location.search).get("id"); + } else { + id = document.location.pathname.split("/").pop(); + } + return id; +} + +async function getData(url) { + let res = await fetch(url); + if (res.ok) { + return await res.json(); + } else { + return null; + } +} + +function showTitle() { + let vuln = data; + const title = document.querySelector("#rumble-vuln h2#id"); + title.innerHTML = `${id} ⬤${vuln.severity}`; + title.hidden = false; +} + +function showVuln() { + const div = document.querySelector("#vuln-details"); + let vuln = data; + + let desc = document.createElement("p"); + desc.innerHTML = `

${vuln.description}

` + + let sourceUrl = document.createElement("p"); + sourceUrl.innerHTML = `Source: ${vuln.url}` + + div.insertAdjacentElement("beforeEnd", desc); + div.insertAdjacentElement("beforeEnd", sourceUrl); +} + +makeTable("#rumble-images-external", data.external_images); +makeTable("#rumble-images-chainguard", data.chainguard_images); + +function makeTable(id, images) { + + // sort alphabetically by image name + if (images !== null) { + images.sort(function (a, b) { + var keyA = a.image; + var keyB = b.image; + if (keyA < keyB) return -1; + if (keyA > keyB) return 1; + return 0; + }); + } else { + document.querySelector(id).innerHTML = `

No vulnerabilities detected

`; + return; + } + + // assemble the table + var table = d3.select(id).append("table") + .attr("id", `${id}-1`), + thead = table.append("thead"), + tbody = table.append("tbody"); + + // append the header row + thead.append("tr") + .selectAll("th") + .data(displayColumns) + .enter() + .append("th") + .text(function (column) { return column; }); + + if (images === null) { + return; + } + // create a row for each object in the data + var rows = tbody.selectAll("tr") + .data(images) + .enter() + .append("tr"); + + // create a cell in each row for each column + rows.selectAll("td") + .data(function (row) { + return dataColumns.map(function (column) { + let val = row[column]; + if (column == "first_seen") { + val = row.dates[0]; + val = val.split("T", 1)[0]; + } + if (column == "last_seen") { + val = row.dates[row.dates.length - 1]; + val = val.split("T", 1)[0] // get rid of timestamps + } + if (column == "duration") { + val = row.dates.length; + } + return { column: column, value: val }; + }); + }) + .enter() + .append("td") + .html(function (d) { return d.value; }); +}; + diff --git a/assets/scss/common/_mobile.scss b/assets/scss/common/_mobile.scss index 44e9777c4a..e789dc7f32 100644 --- a/assets/scss/common/_mobile.scss +++ b/assets/scss/common/_mobile.scss @@ -53,7 +53,7 @@ display: none; } - #sidebar-default > div { + #sidebar-default>div { margin-top: 0 !important; width: 100%; } @@ -78,6 +78,7 @@ } @media (max-width: $MobileLayoutWidth) { + // Collapse leftnav on mobile width .leftnav-container { display: none; @@ -119,9 +120,9 @@ display: none; } - .content > .row, - .content > .row > .row, - .content > .row > .row > .col-md-12 { + .content>.row, + .content>.row>.row, + .content>.row>.row>.col-md-12 { margin: 0 !important; padding: 0 !important; } @@ -217,4 +218,8 @@ .sidebar-bottom { background: inherit; } -} + + #severity-picker { + display: none; + } +} \ No newline at end of file diff --git a/assets/scss/common/_theming.scss b/assets/scss/common/_theming.scss index caf608080e..e5bf4690c2 100644 --- a/assets/scss/common/_theming.scss +++ b/assets/scss/common/_theming.scss @@ -1,100 +1,114 @@ @mixin light-mode { color-scheme: light; - --docs-navigation-border: #e9ecef; - --docs-navigation-color: inherit; - --docs-navigation-button-border: #dcdcdc; - --docs-navigation-button-color: #1c1c1c; + --a-original-color: inherit; + --active-element-background: #f3f3f3; + --active-element-shadow: #3443f4; + --active-link-color: #000000; + --article-link-color: #3443f4; + --basics-card-background: inherit; + --basics-card-border: #dcdcdc; --blockquote-background: #f3f3f3; --blockquote-border: #1c1c1c; --blockquote-color: #4d4d4d; --board-background-color: #f9f9f9; - --form-check-input-background: #ebecfe; - --form-check-input-color: #3443f4; - --form-check-input-checked-background: inherit; - --form-check-input-checked-border: inherit; - --form-check-input-focus-border: inherit; - --note-deprecated: lightyellow; - --note-notice: lightblue; - --note-warning: darkorange; --body-background: #ffffff; --body-color: #1c1c1c; --body-table-color: inherit; --bs-table-bg: inherit; - --footer-title-color: inherit; - --footer-item-color: #545454; - --footer-item-hover-color: #3443f4; - --pills-icon-background: #f3f3f3; - --watch-btn-color: #1c1c1c; - --watch-btn-hover-background: #f5f0f0; - --watch-btn-border: #dcdcdc; - --tutorial-hover-color: #3443f4; --caption-color: #545454; --caption-title-color: #1c1c1c; - --tag-background: #f5f0f0; - --sidebar-item-top-color: #1c1c1c; - --sidebar-item-color: #545454; - --sidebar-item-active-color: #1c1c1c; - --navbar-contact-border: #c2c7fc; - --navbar-contact-color: #3443f4; - --a-original-color: inherit; - --toggle-icon-color: inherit; + --card-background-0: #3443f4; + --card-background-1: #f99afb; --center-title-color: inherit; - --suggestions-border: #e9ecef; - --suggestions-background: #f9f9f9; - --suggestions-hover-background: #e9ecef; - --suggestion-title-color: inherit; - --suggestion-description-color: inherit; - --search-box-background: inherit; - --topic-card-hover: #f5f0f0; - --leftnav-border: #dcdcdc; - --tab-active-color: #1c1c1c; - --tag-color: #f3f3f3; - --tooltip-container-color: inherit; - --sidebar-item-list-item-selected-background: #eeeeee; - --search-background: #eeeeee; - --basics-card-background: inherit; - --basics-card-border: #dcdcdc; - --index-logo-color: #eeeeee; - --tutorial-divider-color: #dcdcdc; - --placeholder-color: #8c8c8c; - --search-slash-border: #dcdcdc; - --sidebar-category-color: #1c1c1c; - --sidebar-bottom-item-color: #1c1c1c; - --sidebar-bottom-item-hover-color: #3443f4; --code-color: #f3f3f3; - --contact-us-button-color: #ffffff; --contact-us-button-background: #3443f4; + --contact-us-button-color: #ffffff; + --docs-navigation-border: #e9ecef; + --docs-navigation-button-border: #dcdcdc; + --docs-navigation-button-color: #1c1c1c; + --docs-navigation-color: inherit; + --expand-button-background: #f3f3f3; + --expand-button-border: inherit; + --expand-button-color: #000000; + --footer-item-color: #545454; + --footer-item-hover-color: #3443f4; + --footer-title-color: inherit; + --form-check-input-background: #ebecfe; + --form-check-input-checked-background: inherit; + --form-check-input-checked-border: inherit; + --form-check-input-color: #3443f4; + --form-check-input-focus-border: inherit; + --header-background: #f9f9f9; + --home-background: #ffffff; + --index-logo-color: #eeeeee; + --language-selector-color: #000000; + --leftnav-border: #dcdcdc; + --navbar-contact-border: #c2c7fc; + --navbar-contact-color: #3443f4; + --note-deprecated: lightyellow; + --note-notice: lightblue; + --note-warning: darkorange; --notification-background: #0e0e0e; --notification-color: #c5c5c5; - --home-background: #ffffff; - --step-background: #f3f3f3; - --header-background: #f9f9f9; - --page-link-color: #545454; + --offcanvas-close-color: #545454; --page-link-active-color: #1c1c1c; - --active-element-background: #f3f3f3; - --active-element-shadow: #3443f4; - --active-link-color: #000000; + --page-link-color: #545454; + --pills-icon-background: #f3f3f3; + --placeholder-color: #8c8c8c; + --pre-container-background: #ffffff; + --pre-container-border: #dcdcdc; --righthand-title-color: #1c1c1c; - --tabs-color: #1c1c1c; + --search-background: #eeeeee; + --search-box-background: inherit; + --search-slash-border: #dcdcdc; + --segmented-button-background: #F3F3F3; + --segmented-button-checked: #3443F4; + --segmented-button-color: #8C8C8C; + --severity-background: #fff; + --severity-border: #DCDCDC; + --severity-color: #1C1C1C; + --severity-hover-background: #EBECFE; + --severity-search-background: #F3F3F3; + --severity-search-border: #3443f4; + --sidebar-bottom-item-color: #1c1c1c; + --sidebar-bottom-item-hover-color: #3443f4; + --sidebar-category-color: #1c1c1c; + --sidebar-item-active-color: #1c1c1c; + --sidebar-item-color: #545454; + --sidebar-item-list-item-selected-background: #eeeeee; + --sidebar-item-top-color: #1c1c1c; + --step-background: #f3f3f3; + --suggestion-description-color: inherit; + --suggestion-title-color: inherit; + --suggestions-background: #f9f9f9; + --suggestions-border: #e9ecef; + --suggestions-hover-background: #e9ecef; + --tab-active-color: #1c1c1c; + --table-header-background: #F3F3F3; + --table-row-hover-background: #F3F3F3; + --table-row-background: #FFF; + --table-row-border-color: #DCDCDC; + --table-vulnerability-color: #1C1C1C; --tabs-active-color: #3443f4; - --card-background-0: #3443f4; - --card-background-1: #f99afb; - --tooltip-color: #ffffff; - --tooltip-background: #232323; - --pre-container-border: #dcdcdc; - --pre-container-background: #ffffff; - --expand-button-color: #000000; - --expand-button-background: #f3f3f3; - --expand-button-border: inherit; - --language-selector-color: #000000; - --terminal-border: #e9ecef; + --tabs-color: #1c1c1c; + --tag-background: #f5f0f0; + --tag-color: #f3f3f3; --terminal-background: #ffffff; + --terminal-border: #e9ecef; --terminal-color: #545454; --terminal-handle: #dcdcdc; --terminal-title-color: #1c1c1c; - --offcanvas-close-color: #545454; - --article-link-color: #3443f4; + --toggle-icon-color: inherit; + --tooltip-background: #232323; + --tooltip-color: #ffffff; + --tooltip-container-color: inherit; + --topic-card-hover: #f5f0f0; + --tutorial-divider-color: #dcdcdc; + --tutorial-hover-color: #3443f4; + --watch-btn-border: #dcdcdc; + --watch-btn-color: #1c1c1c; + --watch-btn-hover-background: #f5f0f0; --info-icon-url: url("/info.svg"); --chevron-icon-url: url("/chevron.svg"); @@ -107,99 +121,112 @@ @mixin dark-mode { color-scheme: dark; - --docs-navigation-border: #4d4d4d; - --docs-navigation-color: #ffffff; - --docs-navigation-button-border: #383838; - --docs-navigation-button-color: #ffffff; + --a-original-color: #c5c5c5; + --active-element-background: #0e0e0e; + --active-element-shadow: #99a1f9; + --active-link-color: #ffffff; + --article-link-color: #99a1f9; + --basics-card-background: #0e0e0e; + --basics-card-border: #4d4d4d; --blockquote-background: #232323; --blockquote-border: #c5c5c5; --blockquote-color: #eeeeee; --board-background-color: #0e0e0e; - --form-check-input-background: #383838; - --form-check-input-checked-background: #383838; - --form-check-input-color: #ffffff; - --form-check-input-checked-border: #383838; - --form-check-input-focus-border: #383838; - --note-deprecated: yellowgreen; - --note-notice: darkcyan; - --note-warning: darkorchid; --body-background: #040404; --body-color: #dee2e6; --body-table-color: inherit; --bs-table-bg: inherit; - --footer-title-color: #ffffff; - --footer-item-color: #ffffff; - --pills-icon-background: #232323; - --watch-btn-color: #ffffff; - --watch-btn-hover-background: #232323; - --watch-btn-border: #4d4d4d; - --tutorial-hover-color: #ffffff; --caption-color: #c5c5c5; --caption-title-color: #ffffff; - --tag-background: #232323; - --sidebar-item-top-color: #c5c5c5; - --sidebar-item-color: #8c8c8c; - --sidebar-item-active-color: #ffffff; - --navbar-contact-border: #4d4d4d; - --navbar-contact-color: #ffffff; - --a-original-color: #c5c5c5; - --toggle-icon-color: #c5c5c5; + --card-background-0: #3443f4; + --card-background-1: #f99afb; --center-title-color: #ffffff; - --suggestions-border: #4d4d4d; - --suggestions-background: #0e0e0e; - --suggestions-hover-background: #232323; - --suggestion-title-color: #ffffff; - --suggestion-description-color: #8c8c8c; - --search-box-background: #232323; - --topic-card-hover: #232323; - --leftnav-border: #4d4d4d; - --tab-active-color: #ffffff; - --tag-color: #232323; - --tooltip-container-color: #ffffff; - --sidebar-item-list-item-selected-background: #232323; - --search-background: #232323; - --basics-card-background: #0e0e0e; - --basics-card-border: #4d4d4d; - --index-logo-color: #4d4d4d; - --tutorial-divider-color: inherit; - --placeholder-color: #c5c5c5; - --search-slash-border: #4d4d4d; - --sidebar-category-color: #8c8c8c; - --sidebar-bottom-item-color: #c5c5c5; - --sidebar-bottom-item-hover-color: #99a1f9; --code-color: #232323; - --contact-us-button-color: #ffffff; --contact-us-button-background: #6772f7; + --contact-us-button-color: #ffffff; + --docs-navigation-border: #4d4d4d; + --docs-navigation-button-border: #383838; + --docs-navigation-button-color: #ffffff; + --docs-navigation-color: #ffffff; + --expand-button-background: #232323; + --expand-button-border: transparent; + --expand-button-color: #ffffff; + --footer-item-color: #ffffff; + --footer-title-color: #ffffff; + --form-check-input-background: #383838; + --form-check-input-checked-background: #383838; + --form-check-input-checked-border: #383838; + --form-check-input-color: #ffffff; + --form-check-input-focus-border: #383838; + --header-background: #0e0e0e; + --home-background: #040404; + --index-logo-color: #4d4d4d; + --language-selector-color: #ffffff; + --leftnav-border: #4d4d4d; + --navbar-contact-border: #4d4d4d; + --navbar-contact-color: #ffffff; + --note-deprecated: yellowgreen; + --note-notice: darkcyan; + --note-warning: darkorchid; --notification-background: #f9f9f9; --notification-color: #1c1c1c; - --home-background: #040404; - --step-background: #232323; - --header-background: #0e0e0e; - --page-link-color: #c5c5c5; + --offcanvas-close-color: #c5c5c5; --page-link-active-color: #ffffff; - --active-element-background: #0e0e0e; - --active-element-shadow: #99a1f9; - --active-link-color: #ffffff; + --page-link-color: #c5c5c5; + --pills-icon-background: #232323; + --placeholder-color: #c5c5c5; + --pre-container-background: #0e0e0e; + --pre-container-border: #383838; --righthand-title-color: #8c8c8c; - --tabs-color: #8c8c8c; + --search-background: #232323; + --search-box-background: #232323; + --search-slash-border: #4d4d4d; + --segmented-button-background: #232323; + --segmented-button-checked: #3443F4; + --segmented-button-color: #8C8C8C; + --severity-background: #0E0E0E; + --severity-border: #4D4D4D; + --severity-color: #FFF; + --severity-hover-background: #0E0E0E; + --severity-search-background: #232323; + --sidebar-bottom-item-color: #c5c5c5; + --sidebar-bottom-item-hover-color: #99a1f9; + --sidebar-category-color: #8c8c8c; + --sidebar-item-active-color: #ffffff; + --sidebar-item-color: #8c8c8c; + --sidebar-item-list-item-selected-background: #232323; + --sidebar-item-top-color: #c5c5c5; + --step-background: #232323; + --suggestion-description-color: #8c8c8c; + --suggestion-title-color: #ffffff; + --suggestions-background: #0e0e0e; + --suggestions-border: #4d4d4d; + --suggestions-hover-background: #232323; + --tab-active-color: #ffffff; + --table-header-background: #0E0E0E; + --table-row-border-color: #4d4d4d; + --table-row-background: #040404; + --table-row-hover-background: #0E0E0E; + --table-vulnerability-color: #fff; --tabs-active-color: #99a1f9; - --card-background-0: #3443f4; - --card-background-1: #f99afb; - --tooltip-color: #ffffff; - --tooltip-background: #232323; - --pre-container-border: #383838; - --pre-container-background: #0e0e0e; - --expand-button-color: #ffffff; - --expand-button-background: #232323; - --expand-button-border: transparent; - --language-selector-color: #ffffff; - --terminal-border: #4d4d4d; + --tabs-color: #8c8c8c; + --tag-background: #232323; + --tag-color: #232323; --terminal-background: #0e0e0e; + --terminal-border: #4d4d4d; --terminal-color: #ffffff; --terminal-handle: #d9d9d9; --terminal-title-color: #ffffff; - --offcanvas-close-color: #c5c5c5; - --article-link-color: #99a1f9; + --toggle-icon-color: #c5c5c5; + --tooltip-background: #232323; + --tooltip-color: #ffffff; + --tooltip-container-color: #ffffff; + --topic-card-hover: #232323; + --tutorial-divider-color: inherit; + --tutorial-hover-color: #ffffff; + --watch-btn-border: #4d4d4d; + --watch-btn-color: #ffffff; + --watch-btn-hover-background: #232323; --info-icon-url: url("/info-dark.svg"); --chevron-icon-url: url("/chevron-dark.svg"); diff --git a/assets/scss/rumble.scss b/assets/scss/rumble.scss new file mode 100644 index 0000000000..f32f155e47 --- /dev/null +++ b/assets/scss/rumble.scss @@ -0,0 +1,318 @@ +// colours for severity circle/blobs +$sev-critical: #F236F6; +$sev-high: #3443F4; +$sev-medium: #1F2892; +$sev-low: #16C0D7; +$sev-negligible: #C5C5C5; +$sev-unknown: #8C8C8C; + +// [id^="rumble"] matches across comparison and vulnerability pages. +// e.g. id="rumble" and id="rumble-vuln" both match the selector, +// which makes these styles work for both pages + +[id^="rumble"] iframe { + margin: 32px 0 4px 0; +} + +[id^="rumble"] .search { + order: 5; + flex: 1; +} + +[id^="rumble"] .search ul { + list-style: none; + height: 1rem; + float: right; + margin: 0; +} + +[id^="rumble"] .search ul li { + display: inline-flex; +} + +[id^="rumble"] .search ul li input { + margin: 0; + min-width: 160px; + height: 48px !important; + vertical-align: middle; + font-size: 16px; + padding: 0 1rem 0 2rem; + + background: var(--search-icon-url) !important; + background-repeat: no-repeat !important; + background-color: var(--severity-search-background) !important; + background-position: 12px 16px !important; + border: 1px solid var(--search-background); + + &:focus { + border: 1px solid var(--severity-search-border); + } +} + +.tables { + display: flex; + flex-wrap: wrap; + margin-top: 42px; +} + +// empty span, used as the background for segmented button +.tables #segmentBackground { + position: absolute; + background: var(--segmented-button-background); + width: 222px; + height: 48px; + z-index: -1; + border-radius: 100px; +} + +.tables label { + order: 0; // Put the labels first + padding: 9px 16px 7px 16px; + background: none; + cursor: pointer; + border: none; + border-radius: 100px; + font-family: Inter; + font-size: 16px; + font-weight: 500; + line-height: 24px; + letter-spacing: 0em; + text-align: left; + height: 42px; + color: var(--segmented-button-color); + margin: 3px -4px 0 4px; +} + +// needed since tables and labels are intermixed in the DOM +// must make tables last for segmented selector to work +.tables .tab-content { + order: 99; // Put the tabs last + width: 100%; + display: none; + background: none; + table-layout: fixed; + margin: 42px 0 0 0 !important; // +} + +// make table headings stick when scrolling +.tables table th { + font-weight: 500 !important; + position: sticky; + top: 0; + background: var(--table-row-background); +} + +.tables table thead, +tbody, +tr, +td, +th { + border-bottom: 1px solid var(--table-row-border-color) !important; + width: 25%; + padding: 24px 12px; +} + +.tables table tbody tr:hover { + background: var(--table-row-hover-background); +} + +.tables input[type="radio"] { + display: none; +} + +.tables input[type="radio"]:checked+label { + background: var(--segmented-button-checked); + color: white; +} + +// show table when its radio is checked, default is display: none +.tables input[type="radio"]:checked+label+.tab-content { + display: block; + + table { + --bs-table-bg: none; + border-collapse: separate; + border-spacing: 0px; + margin: 0 !important; + + tbody { + border-top: none !important; + + tr { + color: var(--table-vulnerability-color); + + &:hover { + background: var(--table-row-hover-background); + } + + td { + font-family: Inter; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 22px; + } + + td a { + color: var(--table-vulnerability-color); + } + } + } + } +} + +// only comparison page table rows are links +#rumble .tables table tbody tr:hover { + cursor: pointer; +} + +// remove info icon on vulnerability info pages +blockquote::before { + content: none; +} + +// Severity dropdown container +#severity-picker { + padding: 0 0 0 1rem !important; + height: 48px !important; + width: 130px; + background: var(--severity-background); + border: 1px solid var(--severity-border); + position: relative; + border-radius: 8px; + margin: 0 0 0 1.5rem !important; + top: -2px; + + .bi-chevron-down { + position: absolute; + right: 1rem; + } + + // severity dropdown span + .severity { + padding: 0 0.5rem 0 0; + font-size: 0.75rem; + vertical-align: top; + } + + // coloured circles in dropdown menu + .sev-critical { + color: $sev-critical; + font-size: 8px; + } + + .sev-high { + color: $sev-high; + font-size: 8px; + } + + .sev-medium { + color: $sev-medium; + font-size: 8px; + } + + .sev-low { + color: $sev-low; + font-size: 8px; + } + + .sev-negligible { + color: $sev-negligible; + font-size: 8px; + } + + .sev-unknown { + color: $sev-unknown; + font-size: 8px; + } + + // severity dropdown button + .dropdown-btn { + width: 130px; + border: none; + color: var(--severity-color); + display: flex; + justify-content: space-between; + align-items: center; + cursor: pointer; + padding: 0 !important; + margin: 0; + + span { + margin: 0 0 0 0; + font-weight: normal; + + &::selection { + background: none; + } + } + } + + // container for dropdown items + .dropdown-content { + list-style: none; + position: absolute; + //top: 3em; + width: 130px; + visibility: hidden; + z-index: 100; + margin: -3px 0 0 0; + left: -1px; + padding: 0; + border-radius: 8px 8px 0 0; + } + + // severity dropdown items + .dropdown-content li { + background: var(--severity-background); + display: block; + width: 130px; + float: left; + padding: 8px 12px; + cursor: pointer; + box-shadow: 0px 8px 16px 0px #3443F41F; + + &:first-child { + border-radius: 8px 8px 0 0; + } + + // need a bottom border for the dropdown + &:last-child { + border-radius: 0 0 8px 8px; + } + } + + .dropdown-content li:hover { + background: var(--severity-background); + border-radius: 4px; + background: var(--severity-hover-background); + } + + .dropdown-content li span { + + // don't show highlighted text selections + &::selection { + background: none; + } + } + + .dropdown:focus-within .dropdown-content li { + left: 0; + } + + .dropdown:focus-within .dropdown-content { + visibility: visible; + //box-shadow: 0px 8px 16px 0px #3443F41F; + } + + // used to toggle dropdown menu + input[type="checkbox"] { + opacity: 0; + position: absolute; + } + + input[type="checkbox"]:checked~.dropdown-content { + visibility: visible; + } + +} \ No newline at end of file diff --git a/content/chainguard/chainguard-images/debugging-distroless-images.md b/content/chainguard/chainguard-images/debugging-distroless-images.md index b40392e0b2..dfc49ce039 100644 --- a/content/chainguard/chainguard-images/debugging-distroless-images.md +++ b/content/chainguard/chainguard-images/debugging-distroless-images.md @@ -1,16 +1,17 @@ --- title: "Debugging Distroless Images" +linktitle: "Debugging" type: "article" description: "In this article, we'll discuss a few different strategies to debug distroless images, considering these images typically don't include a shell or package managers." date: 2023-05-18T08:49:31+00:00 -lastmod: 2023-05-18T08:49:31+00:00 +lastmod: 2023-08-22T08:49:31+00:00 draft: false tags: ["Chainguard Images", "Product"] images: [] menu: docs: parent: "chainguard-images" -weight: 590 +weight: 800 toc: true --- diff --git a/content/chainguard/chainguard-images/faq.md b/content/chainguard/chainguard-images/faq.md index 17b5c0f173..85dce31d1f 100644 --- a/content/chainguard/chainguard-images/faq.md +++ b/content/chainguard/chainguard-images/faq.md @@ -1,16 +1,17 @@ --- title: "Chainguard Images FAQs" +linktitle: "FAQs" type: "article" description: "Frequently asked questions about Chainguard Images" date: 2022-09-01T08:49:31+00:00 -lastmod: 2023-08-16T08:49:31+00:00 +lastmod: 2023-08-22T08:49:31+00:00 draft: false tags: ["Chainguard Images", "FAQ", "Product"] images: [] menu: docs: parent: "chainguard-images" -weight: 600 +weight: 500 toc: true --- @@ -87,4 +88,4 @@ As of August 16, 2023, all other tags for Chainguard Images in the Public catalo There are benefits for all users who authenticate to the Chainguard Registry, as Chainguard provides notifications of version updates, breaking changes, or critical security updates. However, users can continue to pull Images by digest or Images tagged `:latest` anonymously. -To learn how to authenticate into the Chainguard Registry, you can review our [authentication documentation](/chainguard/chainguard-images/registry/authenticating/). You can read more about our Images catalogs and some of the thought process behind authentication in our blog post, [Scaling Chainguard Images with a growing catalog and proactive security updates](https://www.chainguard.dev/unchained/scaling-chainguard-images-with-a-growing-catalog-and-proactive-security-updates). You can read about the August 16, 2023 changes in the [Important updates for Chainguard Images public catalog users](https://www.chainguard.dev/unchained/important-updates-for-chainguard-images-public-catalog-users) blog post. \ No newline at end of file +To learn how to authenticate into the Chainguard Registry, you can review our [authentication documentation](/chainguard/chainguard-images/registry/authenticating/). You can read more about our Images catalogs and some of the thought process behind authentication in our blog post, [Scaling Chainguard Images with a growing catalog and proactive security updates](https://www.chainguard.dev/unchained/scaling-chainguard-images-with-a-growing-catalog-and-proactive-security-updates). You can read about the August 16, 2023 changes in the [Important updates for Chainguard Images public catalog users](https://www.chainguard.dev/unchained/important-updates-for-chainguard-images-public-catalog-users) blog post. diff --git a/content/chainguard/chainguard-images/images-compared.md b/content/chainguard/chainguard-images/images-compared.md index 6da19c8711..68feadbf2e 100644 --- a/content/chainguard/chainguard-images/images-compared.md +++ b/content/chainguard/chainguard-images/images-compared.md @@ -5,14 +5,14 @@ lead: "Detected CVEs Over Time" type: "article" description: "Comparing popular base images with Chainguard Images in number of CVEs detected over time" date: 2022-09-15T08:49:31+00:00 -lastmod: 2022-09-15T08:49:31+00:00 +lastmod: 2023-08-22T08:49:31+00:00 draft: false tags: ["Chainguard Images", "Product"] images: [] menu: docs: parent: "chainguard-images" -weight: 400 +weight: 700 toc: true --- diff --git a/content/chainguard/chainguard-images/network-requirements.md b/content/chainguard/chainguard-images/network-requirements.md index 0a940bb2e9..0d63eea367 100644 --- a/content/chainguard/chainguard-images/network-requirements.md +++ b/content/chainguard/chainguard-images/network-requirements.md @@ -5,14 +5,14 @@ lead: "Using Chainguard Images with firewalls, access control lists, and proxies type: "article" description: "Using Chainguard Images with firewalls, access control lists, and proxies" date: 2023-05-15T08:49:31+00:00 -lastmod: 2023-05-15T08:49:31+00:00 +lastmod: 2023-08-22T08:49:31+00:00 draft: false tags: ["Chainguard Images", "Product", "Reference"] images: [] menu: docs: parent: "chainguard-images" -weight: 500 +weight: 400 toc: true --- diff --git a/content/chainguard/chainguard-images/reference/_index.md b/content/chainguard/chainguard-images/reference/_index.md index 4ac2257b78..33bf2f5c9a 100644 --- a/content/chainguard/chainguard-images/reference/_index.md +++ b/content/chainguard/chainguard-images/reference/_index.md @@ -1,11 +1,14 @@ --- title: "Chainguard Images Reference" +linktitle: "Images Reference" description: "Chainguard Images Reference Docs" type: "article" date: 2022-11-28T08:49:15+00:00 -lastmod: 2022-11-28T08:49:15+00:00 +lastmod: 2023-08-22T08:49:15+00:00 draft: false images: [] +weight: 950 +toc: true --- Reference docs for Chainguard Images diff --git a/content/chainguard/chainguard-images/using-the-tag-history-api.md b/content/chainguard/chainguard-images/using-the-tag-history-api.md index 537406af63..5c4b72dea8 100644 --- a/content/chainguard/chainguard-images/using-the-tag-history-api.md +++ b/content/chainguard/chainguard-images/using-the-tag-history-api.md @@ -3,14 +3,14 @@ title: "Using the Tag History API" type: "article" description: "Learn how to use the Chainguard Images Tag History API to fetch the tag history of image variants." date: 2023-05-26T08:49:31+00:00 -lastmod: 2023-08-09T08:49:31+00:00 +lastmod: 2023-08-22T08:49:31+00:00 draft: false tags: ["Chainguard Images", "Product"] images: [] menu: docs: parent: "chainguard-images" -weight: 590 +weight: 900 toc: true --- diff --git a/content/chainguard/chainguard-images/videos/_index.md b/content/chainguard/chainguard-images/videos/_index.md index b12fef029e..ec3ff73a05 100644 --- a/content/chainguard/chainguard-images/videos/_index.md +++ b/content/chainguard/chainguard-images/videos/_index.md @@ -1,10 +1,12 @@ --- -title: "Videos" -lead: "" -description: "Chainguard Images Videos" +title: "Chainguard Images Videos" +linktitle: "Videos" +description: "Video tutorials" type: "article" date: 2023-07-07T08:48:45+00:00 -lastmod: 2023-07-07T08:48:45+00:00 +lastmod: 2023-08-22T08:48:45+00:00 draft: false images: [] +weight: 975 +toc: true --- \ No newline at end of file diff --git a/content/chainguard/chainguard-images/vuln-comparison/_index.md b/content/chainguard/chainguard-images/vuln-comparison/_index.md new file mode 100644 index 0000000000..8c8a81b8b7 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/_index.md @@ -0,0 +1,48 @@ +--- +title: "Vulnerability Comparisons" +description: "CVEs in popular external images compared to Chainguard Images" +type: "article" +date: 2023-08-22T08:49:15+00:00 +lastmod: 2023-08-22T08:49:15+00:00 +draft: false +images: [] +weight: 925 +topic: true +banner: { + image: "/go-logo-white.svg", + title: "Vulnerability Comparison in Go Images", + subtitle: "Comparing the external Golang image to the latest Go Chainguard Image", + cta: "Compare images", + link: "/chainguard/chainguard-images/vuln-comparison/go/" +} +sectiontitle: "Compare Popular Images" +tutorials: [ + { + title: "Node", + url: "/chainguard/chainguard-images/vuln-comparison/node/" + }, + { + title: "Python", + url: "/chainguard/chainguard-images/vuln-comparison/python/" + }, + { + title: "Rust", + url: "/chainguard/chainguard-images/vuln-comparison/rust/" + }, + { + title: "NGINX", + url: "/chainguard/chainguard-images/vuln-comparison/nginx/" + }, + { + title: "Git", + description: "", + url: "/chainguard/chainguard-images/vuln-comparison/git/" + }, + { + title: "MariaDB", + description: "", + url: "/chainguard/chainguard-images/vuln-comparison/mariadb" + }, +] + +--- diff --git a/content/chainguard/chainguard-images/vuln-comparison/bash.md b/content/chainguard/chainguard-images/vuln-comparison/bash.md new file mode 100644 index 0000000000..1a89a6608b --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/bash.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: bash" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: bash +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/busybox.md b/content/chainguard/chainguard-images/vuln-comparison/busybox.md new file mode 100644 index 0000000000..b8fa4eace6 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/busybox.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: busybox" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: busybox +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/deno.md b/content/chainguard/chainguard-images/vuln-comparison/deno.md new file mode 100644 index 0000000000..05eaadb8b0 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/deno.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: deno" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: deno +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/git.md b/content/chainguard/chainguard-images/vuln-comparison/git.md new file mode 100644 index 0000000000..8574c33560 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/git.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: git" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: git +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/go.md b/content/chainguard/chainguard-images/vuln-comparison/go.md new file mode 100644 index 0000000000..6abd77029a --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/go.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: go" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: go +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/gradle.md b/content/chainguard/chainguard-images/vuln-comparison/gradle.md new file mode 100644 index 0000000000..d029cb5055 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/gradle.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: gradle" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: gradle +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/jenkins.md b/content/chainguard/chainguard-images/vuln-comparison/jenkins.md new file mode 100644 index 0000000000..6be87671da --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/jenkins.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: jenkins" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: jenkins +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/kube-state-metrics.md b/content/chainguard/chainguard-images/vuln-comparison/kube-state-metrics.md new file mode 100644 index 0000000000..64990314d9 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/kube-state-metrics.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: kube-state-metrics" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: kube-state-metrics +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/mariadb.md b/content/chainguard/chainguard-images/vuln-comparison/mariadb.md new file mode 100644 index 0000000000..e5be596041 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/mariadb.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: mariadb" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: mariadb +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/maven.md b/content/chainguard/chainguard-images/vuln-comparison/maven.md new file mode 100644 index 0000000000..e5ec090bea --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/maven.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: maven" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: maven +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/minio-client.md b/content/chainguard/chainguard-images/vuln-comparison/minio-client.md new file mode 100644 index 0000000000..3a5649a981 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/minio-client.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: minio-client" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: minio-client +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/minio.md b/content/chainguard/chainguard-images/vuln-comparison/minio.md new file mode 100644 index 0000000000..9f6e298a2b --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/minio.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: minio" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: minio +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/nginx.md b/content/chainguard/chainguard-images/vuln-comparison/nginx.md new file mode 100644 index 0000000000..7366b4400f --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/nginx.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: nginx" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: nginx +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/node.md b/content/chainguard/chainguard-images/vuln-comparison/node.md new file mode 100644 index 0000000000..0098cec5f3 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/node.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: node" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: node +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/php.md b/content/chainguard/chainguard-images/vuln-comparison/php.md new file mode 100644 index 0000000000..6c260b2a51 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/php.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: php" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: php +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/python.md b/content/chainguard/chainguard-images/vuln-comparison/python.md new file mode 100644 index 0000000000..f0bdcfdb3d --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/python.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: python" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: python +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/rabbitmq.md b/content/chainguard/chainguard-images/vuln-comparison/rabbitmq.md new file mode 100644 index 0000000000..14691cad84 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/rabbitmq.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: rabbitmq" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: rabbitmq +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/ruby.md b/content/chainguard/chainguard-images/vuln-comparison/ruby.md new file mode 100644 index 0000000000..f6979ad847 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/ruby.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: ruby" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: ruby +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/rust.md b/content/chainguard/chainguard-images/vuln-comparison/rust.md new file mode 100644 index 0000000000..d0d8fdd90c --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/rust.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: rust" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: rust +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/wait-for-it.md b/content/chainguard/chainguard-images/vuln-comparison/wait-for-it.md new file mode 100644 index 0000000000..01e4e64bc4 --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/wait-for-it.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: wait-for-it" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: wait-for-it +--- + diff --git a/content/chainguard/chainguard-images/vuln-comparison/wolfi-base.md b/content/chainguard/chainguard-images/vuln-comparison/wolfi-base.md new file mode 100644 index 0000000000..d1eea0a9ff --- /dev/null +++ b/content/chainguard/chainguard-images/vuln-comparison/wolfi-base.md @@ -0,0 +1,13 @@ +--- +title: "Vulnerability Comparison: wolfi-base" +type: "article" +date: 2022-11-01T11:07:52+02:00 +lastmod: 2022-11-01T11:07:52+02:00 +draft: false +tags: ["Reference", "Chainguard Images", "Product"] +images: [] +weight: 600 +toc: false +linktitle: wolfi-base +--- + diff --git a/content/vulnerabilities/index.md b/content/vulnerabilities/index.md new file mode 100644 index 0000000000..25c6509578 --- /dev/null +++ b/content/vulnerabilities/index.md @@ -0,0 +1,12 @@ +--- +title : "Vulnerability Information" +type: "article" +date: 2020-10-06T08:48:23+00:00 +lastmod: 2022-10-06T08:48:23+00:00 +draft: false +images: [] +weight: 2 +weight: 100 +toc: false +--- + diff --git a/data/rumble.json b/data/rumble.json index 72d41f604f..fb1e2f4c4f 100644 --- a/data/rumble.json +++ b/data/rumble.json @@ -4,6 +4,8 @@ {"image":"deno","left":"deno:latest","right":"cgr.dev/chainguard/deno:latest"}, {"image":"git","left":"bitnami/git:latest","right":"cgr.dev/chainguard/git:latest"}, {"image":"go","left":"golang:latest","right":"cgr.dev/chainguard/go:latest"}, + {"image":"gradle","left":"gradle:latest","right":"cgr.dev/chainguard/gradle:latest"}, + {"image":"jenkins","left":"jenkins/jenkins:lts","right":"cgr.dev/chainguard/jenkins:latest"}, {"image":"kube-state-metrics","left":"bitnami/kube-state-metrics:latest","right":"cgr.dev/chainguard/kube-state-metrics:latest"}, {"image":"mariadb","left":"mariadb:latest","right":"cgr.dev/chainguard/mariadb:latest"}, {"image":"maven","left":"maven:latest","right":"cgr.dev/chainguard/maven:latest"}, diff --git a/layouts/_default/list.html b/layouts/_default/list.html index a28c159d71..e3aa2e3b55 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -75,7 +75,8 @@

Recent Tutorials

{{ range $index, $page := and $listed_pages $tutorials }} {{ if le $index 5 }}
- {{ .Params.title | title }} + {{ $title := replace .Params.title "Vulnerability Comparison: " "" }} + {{ $title }}
{{ end }} {{ end }} @@ -94,7 +95,8 @@

Featured Tutorials

{{ range $index, $page := and $listed_pages $tutorials }} {{ if le $index 5 }}
- {{ .Params.title | title }} + {{ $title := replace .Params.title "Vulnerability Comparison: " "" }} + {{ $title }}
{{ end }} {{ end }} diff --git a/layouts/article/single.html b/layouts/article/single.html index 4ba0c4deba..2e5dba76f3 100644 --- a/layouts/article/single.html +++ b/layouts/article/single.html @@ -83,7 +83,8 @@

{{ .Title }}

{{ end -}} --> {{ partial "notice.html" . }} - {{ partial "rumble.html" . }} + {{ partial "rumble-comparison.html" . }} + {{ partial "rumble-vuln.html" . }}
{{ .Content }} diff --git a/layouts/partials/head/script-header.html b/layouts/partials/head/script-header.html index 0b61b92dcc..89313d2fa9 100644 --- a/layouts/partials/head/script-header.html +++ b/layouts/partials/head/script-header.html @@ -2,10 +2,10 @@ content=" default-src 'self'; frame-src 'self' edu.chainguard.dev https://player.vimeo.com https://www.youtube.com https://www.youtube-nocookie.com https://platform.twitter.com https://syndication.twitter.com https://visualization-ui.chainguard.app https://terminal.inky.wtf; - style-src 'self' edu.chainguard.dev 'unsafe-inline' cdn.jsdelivr.net https://fonts.googleapis.com https://unpkg.com; + style-src 'self' edu.chainguard.dev 'unsafe-inline' cdn.jsdelivr.net https://fonts.googleapis.com https://unpkg.com https://use.fontawesome.com; form-action 'self'; - font-src 'self' edu.chainguard.dev https://fonts.googleapis.com https://fonts.gstatic.com https://cdn.jsdelivr.net; - script-src 'self' edu.chainguard.dev *.googleapis.com cdn.jsdelivr.net *.googletagmanager.com 'sha256-vOgyKS2vkH4n5TxBJpeh9SgzrE6LVGsAeOAvEST6oCc=' 'sha256-R2OmoLN/NlJovrWBYuTwjPfAD+YHvBVdudGDjY2VLmI=' https://unpkg.com; + font-src 'self' edu.chainguard.dev https://fonts.googleapis.com https://fonts.gstatic.com https://cdn.jsdelivr.net https://use.fontawesome.com; + script-src 'self' edu.chainguard.dev *.googleapis.com cdn.jsdelivr.net *.googletagmanager.com 'sha256-vOgyKS2vkH4n5TxBJpeh9SgzrE6LVGsAeOAvEST6oCc=' 'sha256-R2OmoLN/NlJovrWBYuTwjPfAD+YHvBVdudGDjY2VLmI=' https://unpkg.com http://localhost:1313 http://localhost:8080 'unsafe-eval'; connect-src 'self' *.google-analytics.com https://storage.googleapis.com; img-src 'self' edu.chainguard.dev data:; base-uri 'self'; diff --git a/layouts/partials/rumble-comparison.html b/layouts/partials/rumble-comparison.html new file mode 100644 index 0000000000..53740d69a9 --- /dev/null +++ b/layouts/partials/rumble-comparison.html @@ -0,0 +1,80 @@ +{{ range $i := $.Site.Data.rumble }} +{{ $title := print "Vulnerability Comparison: " $i.image }} +{{ if eq $title $.Params.Title }} + +
+

Comparison chart for {{ $i.image }} images

+

The following chart shows the past 30 days of Grype scans against the {{ $i.left}} image, and the + {{$i.right}} Chainguard Image. +

+
+ +
+ +

Vulnerability Details for {{ $i.image }} images

+

The following tables of vulnerabilities include the total number of unique vulnerabilities detected in the last 30 + days in + the refereced external {{ $i.left}} image, and the {{$i.right}} Chainguard Image. The + totals include patched, withdrawn, or contested vulnerabilites within the 30 day window. Refer to the individual + vulnerabilities for more + date information and extended + descriptions.

+ +
+ + + +
+ + + +
+ +
+
    +
  • + +
    • +
  • + + + +
      +
    • View all
      • +
    • ⬤Critical
      • +
    • ⬤High
      • +
    • ⬤Medium
      • +
    • ⬤Low
      • +
    • ⬤Negligible
      • +
    • ⬤Unknown
      • +
    +
    • +
+
+ +
+ +
+ +{{ $rumbleBase := resources.Get "js/rumble/base.js" }} +{{ $rumbleComparison := resources.Get "js/rumble/comparison.js" }} +{{ $rumble := slice $rumbleBase $rumbleComparison | resources.Concat "js/rumble-comparison.js" }} + + +{{ $scss := resources.Get "scss/rumble.scss" }} +{{ $rumble_style := $scss | resources.ToCSS }} + + +{{ end }} +{{ end }} \ No newline at end of file diff --git a/layouts/partials/rumble-vuln.html b/layouts/partials/rumble-vuln.html new file mode 100644 index 0000000000..3cd3b35b3d --- /dev/null +++ b/layouts/partials/rumble-vuln.html @@ -0,0 +1,36 @@ +{{ if eq "Vulnerability Information" .Title }} +
+ +
+ +
+ + + +
+ + + +
+ +
+
    +
  • + +
    • +
+
+
+ +
+ +{{ $rumbleBase := resources.Get "js/rumble/base.js" }} +{{ $rumbleVulnerability := resources.Get "/js/rumble/vulnerability.js" }} +{{ $rumble := slice $rumbleBase $rumbleVulnerability | resources.Concat "js/rumble-vulnerability.js" }} + + +{{ $scss := resources.Get "/scss/rumble.scss" }} +{{ $rumble_style := $scss | resources.ToCSS }} + + +{{ end }} \ No newline at end of file diff --git a/layouts/shortcodes/rumble.html b/layouts/shortcodes/rumble.html index f7e39e63fe..3ffa23ca19 100644 --- a/layouts/shortcodes/rumble.html +++ b/layouts/shortcodes/rumble.html @@ -1,9 +1,8 @@ {{ if isset .Params "title"}}

{{ .Get "title"}}

{{ end }} {{ if isset .Params "description"}}

{{ .Get "description"}}

{{ end }} - -{{- $rumble := resources.Get "js/rumble.js" -}} - +{{ $rumble := resources.Get "js/rumble/base.js" }} + diff --git a/nginx.conf b/nginx.conf index 354ee1fe82..bcdf135781 100644 --- a/nginx.conf +++ b/nginx.conf @@ -47,6 +47,7 @@ http { server { listen 8080; server_name localhost; + root /usr/share/nginx/html/; # process $request_uri -> $redirect_url, preserving https, and ensure URLs don't have any ports in them if ($redirect_url != "") { @@ -54,11 +55,14 @@ http { } location / { - root /usr/share/nginx/html/; index index.html index.htm; try_files $uri $uri/index.html =404; } + location ~ /vulnerabilities/ { + rewrite ^ /vulnerabilities/index.html break; + } + # use hugo's built in 404 page for now error_page 404 /404.html; diff --git a/static/go-logo-white.svg b/static/go-logo-white.svg new file mode 100644 index 0000000000..727a62ee69 --- /dev/null +++ b/static/go-logo-white.svg @@ -0,0 +1 @@ + \ No newline at end of file