diff --git a/src/components/dashboard/dashboard.js b/src/components/dashboard/dashboard.js index 8b28721..5465326 100644 --- a/src/components/dashboard/dashboard.js +++ b/src/components/dashboard/dashboard.js @@ -25,7 +25,7 @@ class Dashboard extends Component { ) } - + const severityHexColors = [ '#D22B2B', // Critical '#FF7E62', // High @@ -49,8 +49,6 @@ class Dashboard extends Component { '#1F5F8B' ]; - - return (
diff --git a/src/components/grid/vulnerability-report.scss b/src/components/grid/vulnerability-report.scss index 26bb5de..a36d0bf 100644 --- a/src/components/grid/vulnerability-report.scss +++ b/src/components/grid/vulnerability-report.scss @@ -1,5 +1,4 @@ -.vulnerability-report -{ +.vulnerability-report { border-radius: 7px; padding: 0px 4px; @@ -7,7 +6,7 @@ background-color: #FF3838; color: white; } - + &__sev_high { background-color: #FFB302; } @@ -22,18 +21,16 @@ &__wrapper { color: #363c4a; - margin-top:10px; + margin-top: 10px; background: white; border: 1px solid #dee6eb; padding: 10px; - border-radius: 7px; - box-shadow: 1px 2px 3px rgba(0,0,0,.1) + border-radius: 7px; + box-shadow: 1px 2px 3px rgba(0, 0, 0, .1) } } - - -.gridjs-sort{ +.gridjs-sort { background-color: initial; background-position-x: center; background-repeat: no-repeat; @@ -58,7 +55,7 @@ background-position-y: 35%; background-size: 10px; } - + &-desc { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOTIuMzYyIiBoZWlnaHQ9IjI5Mi4zNjIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI5Mi4zNjIgMjkyLjM2MiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTI4Ni45MzUgNjkuMzc3Yy0zLjYxNC0zLjYxNy03Ljg5OC01LjQyNC0xMi44NDgtNS40MjRIMTguMjc0Yy00Ljk1MiAwLTkuMjMzIDEuODA3LTEyLjg1IDUuNDI0QzEuODA3IDcyLjk5OCAwIDc3LjI3OSAwIDgyLjIyOGMwIDQuOTQ4IDEuODA3IDkuMjI5IDUuNDI0IDEyLjg0N2wxMjcuOTA3IDEyNy45MDdjMy42MjEgMy42MTcgNy45MDIgNS40MjggMTIuODUgNS40MjhzOS4yMzMtMS44MTEgMTIuODQ3LTUuNDI4TDI4Ni45MzUgOTUuMDc0YzMuNjEzLTMuNjE3IDUuNDI3LTcuODk4IDUuNDI3LTEyLjg0NyAwLTQuOTQ4LTEuODE0LTkuMjI5LTUuNDI3LTEyLjg1eiIvPjwvc3ZnPg==); background-position-y: 65%; @@ -66,26 +63,23 @@ } } -.gridjs-search -{ +.gridjs-search { &-input { border: 1px solid darkgrey; border-radius: 4px; - height:33px; + height: 33px; width: 270px; margin-bottom: 10px; margin-top: 10px; } } -.gridjs-pagination .gridjs-pages button.gridjs-currentPage -{ +.gridjs-pagination .gridjs-pages button.gridjs-currentPage { background-color: #f7f7f7; font-weight: 700; } -.gridjs-pagination .gridjs-pages button -{ +.gridjs-pagination .gridjs-pages button { padding: 0px 3px; } @@ -99,15 +93,19 @@ tr { border-bottom: 1px solid #dee6eb; } -.DocSearch-Container,.DocSearch-Container *,th.gridjs-th { +.DocSearch-Container, +.DocSearch-Container *, +th.gridjs-th { box-sizing: border-box } -td.gridjs-td:first-child,th.gridjs-th:first-child { +td.gridjs-td:first-child, +th.gridjs-th:first-child { border-left: none } -td.gridjs-td:last-child,th.gridjs-th:last-child { +td.gridjs-td:last-child, +th.gridjs-th:last-child { border-right: none } @@ -136,7 +134,8 @@ th.gridjs-th-sort .gridjs-th-content { width: calc(100% - 15px) } -th.gridjs-th-sort:focus,th.gridjs-th-sort:hover { +th.gridjs-th-sort:focus, +th.gridjs-th-sort:hover { background-color: #e5e7eb } @@ -144,4 +143,4 @@ th.gridjs-th-fixed { box-shadow: 0 1px 0 0 #e5e7eb; position: -webkit-sticky; position: sticky -} +} \ No newline at end of file diff --git a/src/index.js b/src/index.js index fb90283..b0099cd 100644 --- a/src/index.js +++ b/src/index.js @@ -1,7 +1,7 @@ -import React, { useState } from 'react'; // import ReactDOM from 'react-dom/client'; -import './index.css'; // import App from './App'; +import React, { useState } from 'react'; +import './index.css'; import { Tab, Tabs } from "@mui/material"; import DataGrid from './components/grid/vulnerability-report'; import Dashboard from './components/dashboard/dashboard'; diff --git a/src/utils/data.js b/src/utils/data.js index b82d5d4..db10094 100644 --- a/src/utils/data.js +++ b/src/utils/data.js @@ -5,11 +5,9 @@ var vulnerabilityData = {} async function GetVulnerabilityData(reportUrl) { const response = await axios.get(reportUrl) .catch(function (error) { - // TODO: log something // console.log(`No vulnerability report found matching: ${reportUrl}`) }) - // Empty or errored response if (response === undefined) { return [] }