microsoft
/
sarif-web-component
зеркало из https://github.com/microsoft/sarif-web-component.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность
sarif-web-component/index.html

214 строки
10 KiB
HTML
Исходник Обычный вид История

Full rewrite, migrate to azure-devops-ui.
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>
Add "Actions" column + "Fix in VS Code" link (#41) * Skeleton * Revert separate actions array, move it to Result interface * Build link URL + add VS Code icon * Pipe showActions flag through Viewer + cleanup * Restore webpack * Refactor actions cell rendering + tweaks & cleanup * Pass run & result indexes + tweaks * Cleanup * Remove whitespace from action link, rev version * Cleanup * Fix icons * Rev version * Change action link to Link element
2023-04-07 01:08:54 +03:00
<title>SARIF Viewer</title>
Full rewrite, migrate to azure-devops-ui.
2019-12-18 04:14:33 +03:00
<meta charset="utf-8">
Add ado override.css.
2021-05-05 09:19:56 +03:00
<link rel="stylesheet" href="node_modules/azure-devops-ui/Core/override.css" />
Full rewrite, migrate to azure-devops-ui.
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>
DevServer update for dist changes.
2020-01-10 03:00:03 +03:00
<script src="./dist/index.js"></script>
Full rewrite, migrate to azure-devops-ui.
2019-12-18 04:14:33 +03:00
</body>
</html>