2019-12-18 04:14:33 +03:00
|
|
|
<!-- Copyright (c) Microsoft Corporation. All rights reserved.
|
|
|
|
|
Licensed under the MIT License. -->
|
|
|
|
|
|
|
|
|
|
<!-- Only utilized for local development. -->
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en" class=""><!-- lang for WCAG 3.1.1 -->
|
|
|
|
|
<head>
|
|
|
|
|
<title>Sarif Viewer</title>
|
|
|
|
|
<meta charset="utf-8">
|
2021-05-05 09:19:56 +03:00
|
|
|
<link rel="stylesheet" href="node_modules/azure-devops-ui/Core/override.css" />
|
2019-12-18 04:14:33 +03:00
|
|
|
<style>
|
|
|
|
|
|
|
|
|
|
html {
|
|
|
|
|
--palette-primary-darken-6: 0, 103, 181;
|
|
|
|
|
--palette-primary-darken-10: 0, 91, 161;
|
|
|
|
|
--palette-primary-shade-30: 0, 69, 120;
|
|
|
|
|
--palette-primary-shade-20: 0, 90, 158;
|
|
|
|
|
--palette-primary-shade-10: 16, 110, 190;
|
|
|
|
|
--palette-primary: 0, 120, 212;
|
|
|
|
|
--palette-primary-tint-10: 43, 136, 216;
|
|
|
|
|
--palette-primary-tint-20: 199, 224, 244;
|
|
|
|
|
--palette-primary-tint-30: 222, 236, 249;
|
|
|
|
|
--palette-primary-tint-40: 239, 246, 252;
|
|
|
|
|
--palette-neutral-100: 0, 0, 0;
|
|
|
|
|
--palette-neutral-80: 51, 51, 51;
|
|
|
|
|
--palette-neutral-70: 76, 76, 76;
|
|
|
|
|
--palette-neutral-60: 102, 102, 102;
|
|
|
|
|
--palette-neutral-30: 166, 166, 166;
|
|
|
|
|
--palette-neutral-20: 200, 200, 200;
|
|
|
|
|
--palette-neutral-10: 218, 218, 218;
|
|
|
|
|
--palette-neutral-8: 234, 234, 234;
|
|
|
|
|
--palette-neutral-6: 239, 239, 239;
|
|
|
|
|
--palette-neutral-4: 244, 244, 244;
|
|
|
|
|
--palette-neutral-2: 248, 248, 248;
|
|
|
|
|
--palette-neutral-0: 255, 255, 255;
|
|
|
|
|
--palette-error: rgba(232, 17, 35, 1);
|
|
|
|
|
--palette-error-6: rgba(203, 15, 31, 1);
|
|
|
|
|
--palette-error-10: rgba(184, 14, 28, 1);
|
|
|
|
|
--palette-black-alpha-0: rgba(var(--palette-neutral-100), 0);
|
|
|
|
|
--palette-black-alpha-2: rgba(var(--palette-neutral-100), 0.02);
|
|
|
|
|
--palette-black-alpha-4: rgba(var(--palette-neutral-100), 0.04);
|
|
|
|
|
--palette-black-alpha-6: rgba(var(--palette-neutral-100), 0.06);
|
|
|
|
|
--palette-black-alpha-8: rgba(var(--palette-neutral-100), 0.08);
|
|
|
|
|
--palette-black-alpha-10: rgba(var(--palette-neutral-100), 0.10);
|
|
|
|
|
--palette-black-alpha-20: rgba(var(--palette-neutral-100), 0.20);
|
|
|
|
|
--palette-black-alpha-30: rgba(var(--palette-neutral-100), 0.30);
|
|
|
|
|
--palette-black-alpha-60: rgba(var(--palette-neutral-100), 0.60);
|
|
|
|
|
--palette-black-alpha-70: rgba(var(--palette-neutral-100), 0.70);
|
|
|
|
|
--palette-black-alpha-80: rgba(var(--palette-neutral-100), 0.80);
|
|
|
|
|
--palette-black-alpha-100: rgba(var(--palette-neutral-100), 1);
|
|
|
|
|
--palette-accent1-light: 249, 235, 235;
|
|
|
|
|
--palette-accent1: 218, 10, 0;
|
|
|
|
|
--palette-accent1-dark: 168, 0, 0;
|
|
|
|
|
--palette-accent2-light: 223, 246, 221;
|
|
|
|
|
--palette-accent2: 186, 216, 10;
|
|
|
|
|
--palette-accent2-dark: 16, 124, 16;
|
|
|
|
|
--palette-accent3-light: 255, 244, 206;
|
|
|
|
|
--palette-accent3: 248, 168, 0;
|
|
|
|
|
--palette-accent3-dark: 220, 182, 122;
|
|
|
|
|
--background-color: rgba(var(--palette-neutral-0), 1);
|
|
|
|
|
--communication-foreground: rgba(var(--palette-primary-shade-20), 1);
|
|
|
|
|
--communication-background: rgba(var(--palette-primary), 1);
|
|
|
|
|
--status-info-foreground: rgba(0, 120, 212, 1);
|
|
|
|
|
--status-info-background: rgba(0, 120, 212, 1);
|
|
|
|
|
--status-error-foreground: rgba(205, 74, 69, 1);
|
|
|
|
|
--status-error-background: rgba(var(--palette-accent1-light), 1);
|
|
|
|
|
--status-error-text: rgba(var(--palette-accent1), 1);
|
|
|
|
|
--status-error-strong: rgba(var(--palette-accent1-dark), 1);
|
|
|
|
|
--status-success-foreground: rgba(85, 163, 98, 1);
|
|
|
|
|
--status-success-background: rgba(var(--palette-accent2-light), 1);
|
|
|
|
|
--status-warning-foreground: rgba(250, 157, 45, 1);
|
|
|
|
|
--status-warning-background: rgba(var(--palette-accent3-light), 1);
|
|
|
|
|
--text-primary-color: rgba(var(--palette-neutral-100), .9);
|
|
|
|
|
--text-secondary-color: rgba(var(--palette-neutral-100), .55);
|
|
|
|
|
--text-disabled-color: rgba(var(--palette-neutral-100), .38);
|
|
|
|
|
--text-on-communication-background: var(--background-color);
|
|
|
|
|
--border-subtle-color: rgba(var(--palette-neutral-100), .08);
|
|
|
|
|
--callout-background-color: var(--background-color);
|
|
|
|
|
--callout-filtered-background-color: rgba(var(--palette-neutral-0), 0.86);
|
|
|
|
|
--callout-shadow-color: rgba(0, 0, 0, .132);
|
|
|
|
|
--callout-shadow-secondary-color: rgba(0, 0, 0, .108);
|
|
|
|
|
--panel-shadow-color: rgba(0, 0, 0, .22);
|
|
|
|
|
--panel-shadow-secondary-color: rgba(0, 0, 0, .18);
|
|
|
|
|
--focus-pulse-max-color: rgba(var(--palette-primary), 0.35);
|
|
|
|
|
--focus-pulse-min-color: rgba(var(--palette-primary), 0.15);
|
|
|
|
|
--third-party-icon-filter: none;
|
|
|
|
|
--component-status-success: rgba(85, 163, 98, 1);
|
|
|
|
|
--component-status-error: rgba(205, 74, 69, 1);
|
|
|
|
|
--component-status-warning: rgba(214, 127, 60, 1);
|
|
|
|
|
--component-status-info: rgba(0, 120, 212, 1);
|
|
|
|
|
--component-status-neutral: rgba(102, 102, 102, 1);
|
|
|
|
|
--component-grid-row-hover-color: rgba(var(--palette-neutral-2), 1);
|
|
|
|
|
--component-grid-selected-row-color: rgba(var(--palette-primary-tint-30), 1);
|
|
|
|
|
--component-grid-focus-border-color: rgba(var(--palette-primary), 1);
|
|
|
|
|
--component-grid-link-selected-row-color: rgba(var(--palette-primary-shade-10), 1);
|
|
|
|
|
--component-grid-link-hover-color: rgba(var(--palette-primary-shade-20), 1);
|
|
|
|
|
--component-grid-action-hover-color: rgba(var(--palette-neutral-8), 1);
|
|
|
|
|
--component-grid-action-selected-cell-hover-color: rgba(var(--palette-primary-tint-30), 1);
|
|
|
|
|
--component-grid-cell-bottom-border-color: rgba(var(--palette-neutral-8), 1);
|
|
|
|
|
--component-grid-drag-source-color: rgba(var(--palette-neutral-0), 0.40);
|
|
|
|
|
--component-label-default-colorr: rgba(var(--palette-neutral-6), 1);
|
|
|
|
|
--component-label-default-color-hover: rgba(var(--palette-neutral-10), 1);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
html.dark {
|
|
|
|
|
--palette-primary-darken-6: 0, 103, 181;
|
|
|
|
|
--palette-primary-darken-10: 0, 120, 212;
|
|
|
|
|
--palette-primary-shade-30: 184, 216, 255;
|
|
|
|
|
--palette-primary-shade-20: 152, 198, 255;
|
|
|
|
|
--palette-primary-shade-10: 121, 181, 255;
|
|
|
|
|
--palette-primary: 0, 91, 161;
|
|
|
|
|
--palette-primary-tint-10: 82, 143, 217;
|
|
|
|
|
--palette-primary-tint-20: 73, 126, 191;
|
|
|
|
|
--palette-primary-tint-30: 55, 96, 145;
|
|
|
|
|
--palette-primary-tint-40: 34, 59, 89;
|
|
|
|
|
--palette-neutral-100: 255, 255, 255;
|
|
|
|
|
--palette-neutral-80: 225, 223, 221;
|
|
|
|
|
--palette-neutral-70: 190, 187, 184;
|
|
|
|
|
--palette-neutral-60: 161, 159, 157;
|
|
|
|
|
--palette-neutral-30: 121, 119, 117;
|
|
|
|
|
--palette-neutral-20: 96, 94, 92;
|
|
|
|
|
--palette-neutral-10: 72, 70, 68;
|
|
|
|
|
--palette-neutral-8: 59, 58, 57;
|
|
|
|
|
--palette-neutral-6: 50, 49, 48;
|
|
|
|
|
--palette-neutral-4: 41, 40, 39;
|
|
|
|
|
--palette-neutral-2: 37, 36, 35;
|
|
|
|
|
--palette-neutral-0: 32, 31, 30;
|
|
|
|
|
--palette-error: rgba(184, 14, 28, 1);
|
|
|
|
|
--palette-error-6: rgba(203, 15, 31, 1);
|
|
|
|
|
--palette-error-10: rgba(232, 17, 35, 1);
|
|
|
|
|
--palette-black-alpha-0: rgba(var(--palette-neutral-100), 0);
|
|
|
|
|
--palette-black-alpha-2: rgba(var(--palette-neutral-100), 0.02);
|
|
|
|
|
--palette-black-alpha-4: rgba(var(--palette-neutral-100), 0.04);
|
|
|
|
|
--palette-black-alpha-6: rgba(var(--palette-neutral-100), 0.08);
|
|
|
|
|
--palette-black-alpha-8: rgba(var(--palette-neutral-100), 0.12);
|
|
|
|
|
--palette-black-alpha-10: rgba(var(--palette-neutral-100), 0.18);
|
|
|
|
|
--palette-black-alpha-20: rgba(var(--palette-neutral-100), 0.29);
|
|
|
|
|
--palette-black-alpha-30: rgba(var(--palette-neutral-100), 0.40);
|
|
|
|
|
--palette-black-alpha-60: rgba(var(--palette-neutral-100), 0.57);
|
|
|
|
|
--palette-black-alpha-70: rgba(var(--palette-neutral-100), 0.7);
|
|
|
|
|
--palette-black-alpha-80: rgba(var(--palette-neutral-100), 0.86);
|
|
|
|
|
--palette-black-alpha-100: rgba(var(--palette-neutral-100), 1);
|
|
|
|
|
--palette-accent1-light: 68, 39, 38;
|
|
|
|
|
--palette-accent1: 241, 112, 123;
|
|
|
|
|
--palette-accent1-dark: 241, 112, 123;
|
|
|
|
|
--palette-accent2-light: 57, 61, 27;
|
|
|
|
|
--palette-accent2: 146, 195, 83;
|
|
|
|
|
--palette-accent2-dark: 146, 195, 83;
|
|
|
|
|
--palette-accent3-light: 67, 53, 25;
|
|
|
|
|
--palette-accent3: 253, 185, 19;
|
|
|
|
|
--palette-accent3-dark: 253, 185, 19;
|
|
|
|
|
--background-color: rgba(var(--palette-neutral-0), 1);
|
|
|
|
|
--communication-foreground: rgba(var(--palette-primary-shade-20), 1);
|
|
|
|
|
--communication-background: rgba(var(--palette-primary), 1);
|
|
|
|
|
--status-info-foreground: rgba(97, 168, 255, 1);
|
|
|
|
|
--status-info-background: rgba(0, 120, 212, 1);
|
|
|
|
|
--status-error-foreground: rgba(var(--palette-accent1), 1);
|
|
|
|
|
--status-error-background: rgba(var(--palette-accent1-light), 1);
|
|
|
|
|
--status-error-text: rgba(var(--palette-accent1), 1);
|
|
|
|
|
--status-error-strong: rgba(var(--palette-accent1-dark), 1);
|
|
|
|
|
--status-success-foreground: rgba(var(--palette-accent2-dark), 1);
|
|
|
|
|
--status-success-background: rgba(var(--palette-accent2-light), 1);
|
|
|
|
|
--status-warning-foreground: rgba(var(--palette-accent3), 1);
|
|
|
|
|
--status-warning-background: rgba(var(--palette-accent3-light), 1);
|
|
|
|
|
--text-primary-color: rgba(var(--palette-neutral-100), .95);
|
|
|
|
|
--text-secondary-color: rgba(var(--palette-neutral-100), .80);
|
|
|
|
|
--text-disabled-color: rgba(var(--palette-neutral-100), .5);
|
|
|
|
|
--text-on-communication-background: var(--text-primary-color);
|
|
|
|
|
--border-subtle-color: rgba(var(--palette-neutral-100), .08);
|
|
|
|
|
--callout-background-color: rgba(var(--palette-neutral-6), 1);
|
|
|
|
|
--callout-filtered-background-color: rgba(var(--palette-neutral-0), 0.80);
|
|
|
|
|
--callout-shadow-color: rgba(0, 0, 0, .4);
|
|
|
|
|
--callout-shadow-secondary-color: rgba(0, 0, 0, .32);
|
|
|
|
|
--panel-shadow-color: rgba(0, 0, 0, .67);
|
|
|
|
|
--panel-shadow-secondary-color: rgba(0, 0, 0, .53);
|
|
|
|
|
--focus-pulse-max-color: rgba(var(--palette-primary), 0.35);
|
|
|
|
|
--focus-pulse-min-color: rgba(var(--palette-primary), 0.15);
|
|
|
|
|
--third-party-icon-filter: invert(100%);
|
|
|
|
|
--component-status-success: rgba(85, 163, 98, 1);
|
|
|
|
|
--component-status-error: rgba(205, 74, 69, 1);
|
|
|
|
|
--component-status-warning: rgba(214, 127, 60, 1);
|
|
|
|
|
--component-status-info: rgba(0, 120, 212, 1);
|
|
|
|
|
--component-status-neutral: rgba(102, 102, 102, 1);
|
|
|
|
|
--component-grid-row-hover-color: rgba(var(--palette-neutral-100), 0.04);
|
|
|
|
|
--component-grid-selected-row-color: rgba(var(--palette-primary-tint-30), 1);
|
|
|
|
|
--component-grid-focus-border-color: rgba(var(--palette-primary), 1);
|
|
|
|
|
--component-grid-link-selected-row-color: var(--communication-foreground);
|
|
|
|
|
--component-grid-link-hover-color: var(--communication-foreground);
|
|
|
|
|
--component-grid-action-hover-color: rgba(var(--palette-neutral-8), 1);
|
|
|
|
|
--component-grid-action-selected-cell-hover-color: rgba(var(--palette-primary-tint-30), 0.4);
|
|
|
|
|
--component-grid-cell-bottom-border-color: rgba(var(--palette-neutral-8), 1);
|
|
|
|
|
--component-grid-drag-source-color: rgba(var(--palette-neutral-0), 0.30);
|
|
|
|
|
--component-label-default-colorr: rgba(var(--palette-neutral-6), 1);
|
|
|
|
|
--component-label-default-color-hover: rgba(var(--palette-neutral-20), 1);
|
|
|
|
|
--component-label-default-color: rgba(var(--palette-neutral-10), 1);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
color: rgba(var(--palette-neutral-100), 1);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app {
|
|
|
|
|
flex: 1 1 auto; /* azure-devops-ui injects body display flex. */
|
|
|
|
|
/* width: 100%; /* Not obvious unless viewer is empty. */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="app"></div>
|
2020-01-10 03:00:03 +03:00
|
|
|
<script src="./dist/index.js"></script>
|
2019-12-18 04:14:33 +03:00
|
|
|
</body>
|
|
|
|
|
</html>
|
