@percy/report 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,221 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
+ <title>Document</title>
9
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
10
+ integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
11
+ <style>
12
+ img {
13
+ width: 100%;
14
+ object-fit: contain;
15
+ border: 1px solid gray;
16
+ }
17
+
18
+ .comparison-container {
19
+ position: relative;
20
+ cursor: pointer;
21
+ }
22
+
23
+ .overlay {
24
+ position: absolute;
25
+ top: 0;
26
+ left: 0;
27
+ right: 0;
28
+ bottom: 0;
29
+ z-index: 50;
30
+ width: 100%;
31
+ height: 100%;
32
+ background-color: rgba(0, 0, 0, 0.7);
33
+ }
34
+
35
+ .browser-icon{
36
+ width: 30px;
37
+ height: 30px;
38
+ }
39
+ .color-red{
40
+ background-color: red !important;
41
+ color: white !important;
42
+ }
43
+ .color-green{
44
+ background-color: green !important;
45
+ color: white !important;
46
+ }
47
+ select{
48
+ max-width: 100%;
49
+ }
50
+ </style>
51
+ <script type="text/javascript">
52
+ function onClickOverlay(e, element) {
53
+ let hidden = e.currentTarget.querySelector(".overlay").classList.contains('d-none')
54
+ if(hidden){
55
+ e.currentTarget.querySelector(".overlay").classList.remove('d-none')
56
+ }else{
57
+ e.currentTarget.querySelector(".overlay").classList.add('d-none')
58
+ }
59
+ }
60
+ const snapshots = JSON.parse('<%- JSON.stringify(details.map(snp=>snp.name)) %>')
61
+ const widths = JSON.parse('<%- JSON.stringify(widths) %>')
62
+ const browsers = JSON.parse('<%- JSON.stringify(browsers) %>')
63
+ var snapshotSelect, widthSelect,browserSelect,images
64
+ window.addEventListener('DOMContentLoaded', () => {
65
+ snapshotSelect = document.getElementById('select-snapshot')
66
+ widthSelect = document.getElementById('select-width')
67
+ browserSelect = document.getElementById('select-browser')
68
+ images = document.getElementsByTagName('img')
69
+ tables = document.getElementsByTagName('table')
70
+ snapshotSelect.addEventListener('change', ApplyFilter)
71
+ widthSelect.addEventListener('change', ApplyFilter)
72
+ browserSelect.addEventListener('change', ApplyFilter)
73
+ ApplyFilter()
74
+ })
75
+
76
+ function ApplyFilter() {
77
+ const shouldEnable = (dataset) => {
78
+ if(dataset.browser == "Chrome on Android" || dataset.browser == "Safari on iPhone" ){
79
+ return (snapshotSelect.value == "All" || snapshotSelect.value == dataset.name) && browserSelect.value == dataset.browser
80
+ }
81
+ return (snapshotSelect.value == "All" || snapshotSelect.value == dataset.name) && widthSelect.value == dataset.width && browserSelect.value == dataset.browser
82
+ }
83
+ for (let i = 0; i < images.length; i++) {
84
+ let image = images.item(i)
85
+ image.hidden = !shouldEnable(image.dataset)
86
+ }
87
+
88
+ for(let i = 0; i < tables.length; i++){
89
+ let table = tables.item(i)
90
+ if(table.id !== "build-details"){
91
+ table.hidden = !shouldEnable(table.dataset)
92
+ }
93
+ }
94
+ }
95
+ </script>
96
+ </head>
97
+
98
+ <body class="p-5">
99
+ <div class="container">
100
+ <h1 class="my-3 text-center"> <u> <%= projectName %> </u></h1>
101
+ <h4 class="my-3 text-center"> <u> <a href="<%= buildURL %>">Go to Percy Dashboard Build</a> </u></h3>
102
+ <table class="table table-bordered table-striped" id="build-details">
103
+ <thead>
104
+ <th class="text-center">Build Number</th>
105
+ <th class="text-center">Browsers</th>
106
+ <th class="text-center">Total Snapshots</th>
107
+ <th class="text-center">Total Screenshots</th>
108
+ <th class="text-center">Snapshots Unreviewed</th>
109
+ <th class="text-center">Screenshots Unreviewed</th>
110
+ </thead>
111
+ <tbody>
112
+ <tr>
113
+ <td class="text-center">
114
+ <%= buildNumber %>
115
+ </td>
116
+ <td class="text-center">
117
+ <% if(browsers.includes('Safari')) { %>
118
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="38.698" cy="38.568" r="38" fill="#BABABA"></circle><circle cx="38.698" cy="38.568" r="38" fill="url(#x)"></circle><circle cx="38.698" cy="38.568" r="38" fill="url(#w)"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="#309CFF"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="url(#cc)"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="url(#dd)"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M37.168 35.58L19.705 58.046 39.668 38.08l-2.501-2.501z" fill="#fff"></path><path d="M19.704 58.046L42.17 40.582l-2.5-2.501-19.966 19.965z" fill="#fff"></path><path d="M42.166 40.59l-2.629-2.641-19.816 20.096L42.166 40.59z" fill="#E5E5E5"></path><path d="M37.19 35.59l22.254-17.298-17.362 22.336-.184.047-4.809-4.809.101-.275z" fill="#EA3939"></path><path d="M42.159 40.574l-2.641-2.63 20.096-19.816-17.455 22.446z" fill="#AD2C2C"></path><rect x="38.698" y="8.255" width="1.64" height="5.66" rx=".82" fill="#E8F4FF"></rect><rect x="38.698" y="63.584" width="1.64" height="5.66" rx=".82" fill="#E8F4FF"></rect><rect x="69.013" y="37.93" width="1.64" height="5.66" rx=".82" transform="rotate(90 69.013 37.93)" fill="#E8F4FF"></rect><rect x="13.683" y="37.93" width="1.64" height="5.66" rx=".82" transform="rotate(90 13.683 37.93)" fill="#E8F4FF"></rect><rect x="60.661" y="59.733" width="1.64" height="5.66" rx=".82" transform="rotate(135 60.66 59.733)" fill="#E8F4FF"></rect><rect x="21.537" y="20.609" width="1.64" height="5.66" rx=".82" transform="rotate(135 21.537 20.61)" fill="#E8F4FF"></rect><defs><radialGradient id="w" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .065 38.633) scale(38)"><stop offset=".927" stop-color="#B6C6FF" stop-opacity="0"></stop><stop offset="1" stop-color="#CFCFD1"></stop></radialGradient><radialGradient id="cc" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(52.933 -10.487 32.545) scale(56.3527)"><stop offset=".594" stop-color="#60D9FF" stop-opacity=".59"></stop><stop offset="1" stop-color="#003CB1" stop-opacity=".83"></stop></radialGradient><radialGradient id="dd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .065 38.633) scale(32.7068)"><stop offset=".87" stop-color="#5587E8" stop-opacity="0"></stop><stop offset="1" stop-color="#175ECA"></stop></radialGradient><linearGradient id="x" x1="12.796" y1="12.307" x2="65.319" y2="65.307" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".79"></stop><stop offset="1" stop-color="#fff" stop-opacity="0"></stop></linearGradient></defs></svg>
119
+ <% } %>
120
+ <% if(browsers.includes('Firefox')) { %>
121
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M36.977 0c20.42 0 36.976 16.464 36.976 36.778 0 20.308-16.555 36.777-36.976 36.777S0 57.086 0 36.778C0 16.462 16.556 0 36.977 0z" transform="translate(2.465)" fill="url(#a)"></path><path d="M45.762 70.558C64.532 67.545 78.886 51.4 78.886 31.88l-.36.444c.562-3.71.464-7.015-.308-9.898-.276 2.136-.577 3.425-.88 3.943-.002-.167-.044-2.393-.757-5.5-.338-2.265-.833-4.396-1.518-6.365.167.902.266 1.655.315 2.337C72.514 9.196 65.461-.217 48.084.004c0 0 6.111.642 8.988 4.975 0 0-2.94-.7-5.164.372 2.709 1.074 5.058 2.197 7.057 3.37l.173.105c.513.306.95.62 1.413.931 3.692 2.58 7.119 6.26 6.858 11.007-.797-1.25-1.857-2.07-3.215-2.482 1.674 6.522 1.839 11.909.486 16.158-.93-2.83-1.785-4.526-2.547-5.124 1.063 8.743-.37 15.209-4.287 19.423.745-2.572 1.04-4.678.873-6.34-4.602 6.919-9.838 10.496-15.708 10.717-2.32-.02-4.51-.368-6.572-1.045-3.027-1.017-5.766-2.756-8.204-5.222 3.806.316 7.282-.34 10.342-1.893l5.011-3.266-.02-.014c.651-.246 1.263-.226 1.86.05 1.222-.166 1.65-.818 1.242-1.919-.592-.819-1.487-1.562-2.636-2.216-2.507-1.302-5.125-1.096-7.856.637-2.6 1.471-5.103 1.412-7.538-.152-1.595-1.096-3.136-2.572-4.625-4.416l-.591-.87c-.28 2.089.037 4.769.98 8.069l.02.044-.02-.04c-.946-3.3-1.26-5.986-.98-8.073v-.02c.071-1.824.83-2.83 2.277-3.055l-.614-.051.62.051c1.634.15 3.51.523 5.625 1.136.355-2.03-.111-4.156-1.39-6.336v-.04c1.986-1.843 3.749-3.184 5.255-4.04.668-.355 1.057-.895 1.186-1.623l.054-.04.02-.019.074-.071c.389-.579.258-1.044-.407-1.456a16.664 16.664 0 0 1-4.179-.297l-.02.056c-.574-.166-1.298-.674-2.19-1.532l-2.286-2.236-.685-.537v.071h-.02l.02-.09-.13-.136.184-.13c.316-1.694.836-3.15 1.578-4.4l.167-.15c.745-1.231 2.172-2.553 4.27-3.965-3.9.483-7.427 2.231-10.563 5.254-2.6-.948-5.682-.747-9.23.613l-.426.324-.032.017.463-.338.02-.02C10.835 8.71 9.33 5.78 8.605.992 5.766 3.789 4.39 8.784 4.483 15.995l-.814 1.223-.21.142-.041.04-.018.017-.04.08c-.43.673-1.025 1.688-1.774 3.05C.508 22.476.145 24.094.04 25.504l-.01.017.006.047-.035.37.062-.098c.007.326.014.655.098.949l2.303-1.883c-.836 2.106-1.39 4.34-1.672 6.708l-.066 1.084-.723-.822c0 8.405 2.683 16.175 7.208 22.56l.136.21.217.258a39.539 39.539 0 0 0 12.222 10.945c3.459 2.038 7.176 3.465 11.14 4.313l.816.181c.82.157 1.661.275 2.504.38.624.081 1.248.16 1.879.214l.838.095 1.19.008 1.295.064 1.03-.052 1.699-.083a39.852 39.852 0 0 0 2.987-.322l.6-.088zM70.704 22.77l-.017.321.012-.323.005.002z" transform="translate(0 4.897)" fill="url(#b)"></path><defs><linearGradient id="a" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 73.5555 -73.9534 0 73.953 0)"><stop stop-color="#0093F7"></stop><stop offset="1" stop-color="#372893"></stop></linearGradient><linearGradient id="b" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(78.8861 0 0 88.4522 0 -9.471)"><stop stop-color="#FE3229"></stop><stop offset="1" stop-color="#FFD71F"></stop></linearGradient></defs></svg>
122
+ <% } %>
123
+ <% if(browsers.includes('Chrome')) { %>
124
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M38 57.447c-3.86 0-7.372-1.04-10.54-3.117-3.169-2.078-5.544-4.75-7.125-8.015L4.75 19C1.484 24.84 0 31.371 0 38c0 9.5 3.092 17.789 9.277 24.864 6.184 7.075 13.88 11.305 23.082 12.692l11.023-19.074c-1.11.326-2.96.965-5.382.965z" fill="#4AAE48"></path><path d="M26.05 22.636C29.562 19.916 33.547 19 38 19h32.656c-3.366-5.738-7.942-10.588-13.73-13.953C51.136 1.684 44.828 0 37.999 0c-5.937 0-11.48 1.261-16.625 3.786-5.146 2.522-9.908 6.196-13.397 10.91L18.999 33.25c1.088-4.254 3.537-7.89 7.052-10.614z" fill="#EA3939"></path><path d="M73.143 23.75h-22.08c3.86 3.86 6.384 8.809 6.384 14.25 0 4.059-1.138 7.769-3.415 11.134L38.447 76c10.39-.1 19.247-3.86 26.571-11.281C72.338 57.297 76 48.39 76 38c0-4.847-.817-9.947-2.857-14.25z" fill="#FED14B"></path><path d="M38 52.25c7.87 0 14.25-6.38 14.25-14.25S45.87 23.75 38 23.75 23.75 30.13 23.75 38 30.13 52.25 38 52.25z" fill="#188FD1"></path></svg>
125
+ <% } %>
126
+ <% if(browsers.includes('Edge')) { %>
127
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#z)"><path d="M68.584 56.56c-1.014.53-2.058.997-3.129 1.399a30.242 30.242 0 0 1-10.657 1.917c-14.046 0-26.282-9.662-26.282-22.061a9.343 9.343 0 0 1 4.877-8.107c-12.705.535-15.97 13.774-15.97 21.53 0 21.931 20.212 24.154 24.567 24.154 2.348 0 5.889-.682 8.014-1.353l.39-.13a38.096 38.096 0 0 0 19.769-15.674 1.187 1.187 0 0 0-1.58-1.674z" fill="url(#y)"></path><path opacity=".35" d="M68.584 56.56c-1.014.53-2.058.997-3.129 1.399a30.242 30.242 0 0 1-10.657 1.917c-14.046 0-26.282-9.662-26.282-22.061a9.343 9.343 0 0 1 4.877-8.107c-12.705.535-15.97 13.774-15.97 21.53 0 21.931 20.212 24.154 24.567 24.154 2.348 0 5.889-.682 8.014-1.353l.39-.13a38.096 38.096 0 0 0 19.769-15.674 1.187 1.187 0 0 0-1.58-1.674z" fill="url(#c)"></path><path d="M31.378 71.663a23.51 23.51 0 0 1-6.75-6.334 23.96 23.96 0 0 1 8.765-35.621c.926-.437 2.508-1.226 4.613-1.188a9.603 9.603 0 0 1 7.626 3.86 9.463 9.463 0 0 1 1.888 5.538c0-.062 7.26-23.628-23.748-23.628C10.741 14.29.025 26.656.025 37.506A38.634 38.634 0 0 0 3.62 54.129a37.996 37.996 0 0 0 46.42 19.92 22.426 22.426 0 0 1-18.636-2.374l-.026-.012z" fill="url(#d)"></path><path opacity=".41" d="M31.378 71.663a23.51 23.51 0 0 1-6.75-6.334 23.96 23.96 0 0 1 8.765-35.621c.926-.437 2.508-1.226 4.613-1.188a9.603 9.603 0 0 1 7.626 3.86 9.463 9.463 0 0 1 1.888 5.538c0-.062 7.26-23.628-23.748-23.628C10.741 14.29.025 26.656.025 37.506A38.634 38.634 0 0 0 3.62 54.129a37.996 37.996 0 0 0 46.42 19.92 22.426 22.426 0 0 1-18.636-2.374l-.026-.012z" fill="url(#e)"></path><path d="M45.211 44.188c-.24.312-.98.742-.98 1.68 0 .775.505 1.52 1.402 2.146 4.268 2.969 12.316 2.577 12.336 2.577a17.68 17.68 0 0 0 8.986-2.479 18.22 18.22 0 0 0 9.033-15.697c.077-6.652-2.375-11.075-3.366-13.034C66.332 7.077 52.754 0 37.989 0A37.996 37.996 0 0 0-.007 37.462c.143-10.847 10.924-19.607 23.748-19.607 1.038 0 6.963.101 12.467 2.99 4.85 2.546 7.391 5.622 9.158 8.67 1.834 3.167 2.16 7.169 2.16 8.763 0 1.594-.813 3.957-2.315 5.91z" fill="url(#f)"></path><path d="M45.211 44.188c-.24.312-.98.742-.98 1.68 0 .775.505 1.52 1.402 2.146 4.268 2.969 12.316 2.577 12.336 2.577a17.68 17.68 0 0 0 8.986-2.479 18.22 18.22 0 0 0 9.033-15.697c.077-6.652-2.375-11.075-3.366-13.034C66.332 7.077 52.754 0 37.989 0A37.996 37.996 0 0 0-.007 37.462c.143-10.847 10.924-19.607 23.748-19.607 1.038 0 6.963.101 12.467 2.99 4.85 2.546 7.391 5.622 9.158 8.67 1.834 3.167 2.16 7.169 2.16 8.763 0 1.594-.813 3.957-2.315 5.91z" fill="url(#g)"></path></g><defs><radialGradient id="c" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(28.3129 0 0 26.8972 46.662 52.974)"><stop offset=".72" stop-opacity="0"></stop><stop offset=".95" stop-opacity=".53"></stop><stop offset="1"></stop></radialGradient><radialGradient id="e" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-81.384 44.823 17.356) scale(42.575 34.3963)"><stop offset=".76" stop-opacity="0"></stop><stop offset=".95" stop-opacity=".5"></stop><stop offset="1"></stop></radialGradient><radialGradient id="f" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(92.291 -2.921 10.717) scale(60.1379 128.081)"><stop stop-color="#35C1F1"></stop><stop offset=".11" stop-color="#34C1ED"></stop><stop offset=".23" stop-color="#2FC2DF"></stop><stop offset=".31" stop-color="#2BC3D2"></stop><stop offset=".67" stop-color="#36C752"></stop></radialGradient><radialGradient id="g" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(73.74 20.31 58.993) scale(28.8947 23.4971)"><stop stop-color="#66EB6E"></stop><stop offset="1" stop-color="#66EB6E" stop-opacity="0"></stop></radialGradient><linearGradient id="y" x1="17.423" y1="52.556" x2="70.362" y2="52.556" gradientUnits="userSpaceOnUse"><stop stop-color="#0C59A4"></stop><stop offset="1" stop-color="#114A8B"></stop></linearGradient><linearGradient id="d" x1="45.332" y1="29.592" x2="12.267" y2="65.608" gradientUnits="userSpaceOnUse"><stop stop-color="#1B9DE2"></stop><stop offset=".16" stop-color="#1595DF"></stop><stop offset=".67" stop-color="#0680D7"></stop><stop offset="1" stop-color="#0078D4"></stop></linearGradient><clipPath id="z"><path fill="#fff" d="M0 0h76v76H0z"></path></clipPath></defs></svg>
128
+ <% } %>
129
+ <% if(browsers.includes('Safari on iPhone')) { %>
130
+ <svg class="w-full browser-icon" width="100" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#aaa)"><path d="M28.375 0h-16.25A3.09 3.09 0 0 0 9 3.047v33.906A3.09 3.09 0 0 0 12.125 40h16.25a3.09 3.09 0 0 0 3.125-3.047V3.047A3.09 3.09 0 0 0 28.375 0zm1.875 36.953a1.84 1.84 0 0 1-1.875 1.796h-16.25a1.84 1.84 0 0 1-1.875-1.796V3.047a1.84 1.84 0 0 1 1.875-1.797h3.125A1.301 1.301 0 0 0 16.5 2.5H24a1.343 1.343 0 0 0 1.25-1.25h3.125a1.84 1.84 0 0 1 1.875 1.797v33.906z" fill="#000"></path><path d="M30.25 36.953a1.84 1.84 0 0 1-1.875 1.796h-16.25a1.84 1.84 0 0 1-1.875-1.796V3.047a1.84 1.84 0 0 1 1.875-1.797h3.125A1.301 1.301 0 0 0 16.5 2.5H24a1.343 1.343 0 0 0 1.25-1.25h3.125a1.84 1.84 0 0 1 1.875 1.797v33.906z" fill="#BFD2EE"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="#BABABA"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="url(#bbb)"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="url(#ccc)"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="#309CFF"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="url(#ddd)"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="url(#eee)"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M19.88 19.505l-3.416 4.394 3.905-3.905-.49-.49h.001z" fill="#fff"></path><path d="M16.464 23.9l4.394-3.417-.49-.49-3.904 3.906z" fill="#fff"></path><path d="M20.856 20.484l-.514-.517-3.876 3.93 4.39-3.413z" fill="#E5E5E5"></path><path d="M19.882 19.508l4.353-3.383-3.396 4.369-.036.009-.94-.94.02-.055h-.001z" fill="#EA3939"></path><path d="M20.854 20.482l-.517-.514 3.93-3.876-3.413 4.39z" fill="#AD2C2C"></path><path d="M20.498 14.32a.16.16 0 1 0-.32 0v.786a.16.16 0 0 0 .32 0v-.786zm0 10.823a.16.16 0 1 0-.32 0v.787a.16.16 0 0 0 .32 0v-.787zm5.45-4.86a.16.16 0 0 0 0-.32h-.787a.16.16 0 1 0 0 .32h.787zm-10.661-.16a.16.16 0 0 0-.16-.16h-.786a.16.16 0 1 0 0 .32h.786a.16.16 0 0 0 .16-.16zm8.847 4.217a.16.16 0 0 0 .227-.227l-.556-.556a.16.16 0 0 0-.274.114.162.162 0 0 0 .047.113l.556.556zm-7.427-7.652a.16.16 0 0 0 0-.226l-.556-.556a.16.16 0 1 0-.227.226l.556.556a.161.161 0 0 0 .227 0z" fill="#E8F4FF"></path></g><defs><radialGradient id="ccc" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .045 20.134) scale(7.43234)"><stop offset=".927" stop-color="#B6C6FF" stop-opacity="0"></stop><stop offset="1" stop-color="#CFCFD1"></stop></radialGradient><radialGradient id="ddd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(52.933 -8.346 25.3) scale(11.0219)"><stop offset=".594" stop-color="#60D9FF" stop-opacity=".59"></stop><stop offset="1" stop-color="#003CB1" stop-opacity=".83"></stop></radialGradient><radialGradient id="eee" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .044 20.132) scale(6.39705)"><stop offset=".87" stop-color="#5587E8" stop-opacity="0"></stop><stop offset="1" stop-color="#175ECA"></stop></radialGradient><linearGradient id="bbb" x1="15.113" y1="14.952" x2="25.386" y2="25.319" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".79"></stop><stop offset="1" stop-color="#fff" stop-opacity="0"></stop></linearGradient><clipPath id="aaa"><path fill="#fff" d="M0 0h40v40H0z"></path></clipPath></defs></svg>
131
+ <% } %>
132
+ <% if(browsers.includes('Chrome on Android')) { %>
133
+ <svg class="w-full browser-icon" width="100" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#aaaa)"><path d="M10.152.38H28.62v39.298H10.152V.381z" fill="#A4A9AF"></path><g filter="url(#bbbb)"><path d="M19.425 25.791a5.531 5.531 0 1 0 0-11.062 5.531 5.531 0 0 0 0 11.062z" fill="#F9F9F9"></path><path d="M19.425 23.09a2.743 2.743 0 0 1-1.535-.453 2.88 2.88 0 0 1-1.037-1.168l-2.268-3.975c-.476.85-.694 1.8-.694 2.766 0 1.383.452 2.59 1.353 3.619.899 1.03 2.019 1.646 3.36 1.848l1.604-2.776c-.162.046-.43.14-.783.14z" fill="#4AAE48"></path><path d="M17.684 18.024c.51-.396 1.091-.53 1.739-.53h4.754a5.576 5.576 0 0 0-2-2.03 5.39 5.39 0 0 0-2.754-.735c-.865 0-1.67.183-2.42.552a5.35 5.35 0 0 0-1.951 1.587l1.605 2.7a2.82 2.82 0 0 1 1.027-1.544z" fill="#EA3939"></path><path d="M24.54 18.186h-3.214c.562.562.93 1.282.93 2.077 0 .59-.166 1.13-.498 1.619l-2.27 3.912a5.311 5.311 0 0 0 3.868-1.644c1.067-1.08 1.6-2.377 1.6-3.89 0-.704-.12-1.447-.417-2.074z" fill="#FED14B"></path><path d="M19.425 22.335a2.075 2.075 0 0 0 1.525-3.573 2.075 2.075 0 1 0-1.525 3.573z" fill="#188FD1"></path></g><path d="M10.076.19h18.505" stroke="#435553" stroke-width=".5"></path><path d="M10.038 39.985v-.381M10 .19h.114H10zm.038.191V0v.381zm0 0v39.566V.38zM10 .191h.114H10zm.038.19V0v.381zM28.62.191h.114-.114zm.038.19V0v.381zM10 39.794h.114H10z" stroke="#4E494B" stroke-width=".5"></path><path d="M10.038.38v39.567" stroke="#2E403E" stroke-width=".5"></path><path d="M28.651 39.81l-18.504.012" stroke="#3C4F4D" stroke-width=".5"></path><path d="M28.688 39.62V40m.038-.19h-.114.114z" stroke="#4E494B" stroke-width=".5"></path><path d="M28.688 39.62L28.667.053" stroke="#2E403E" stroke-width=".5"></path><path d="M29.168 14.826v2.442m0-9.766v4.88-4.88z" stroke="#0A2C28" stroke-width=".15"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M19.585 2.501a.417.417 0 1 0 0-.834.417.417 0 0 0 0 .834z" fill="#212022"></path><g filter="url(#cccc)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.342a.26.26 0 1 0 .044-.519.26.26 0 0 0-.044.52z" fill="url(#dddd)"></path></g><g filter="url(#eeee)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.58 2.24a.156.156 0 1 0 .001-.312.156.156 0 0 0 0 .312z" fill="url(#ffff)"></path></g><mask id="gggg" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="19" y="1" width="1" height="2"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.58 2.24a.156.156 0 1 0 .001-.312.156.156 0 0 0 0 .312z" fill="#fff"></path></mask><g mask="url(#gggg)"><g filter="url(#hhhh)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.261a.166.166 0 1 0 0-.333.166.166 0 0 0 0 .333z" fill="#1A1719"></path></g><g opacity=".776" filter="url(#iiii)"><path opacity=".776" fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.033c.07 0 .126-.029.126-.063s-.058-.063-.126-.063c-.069 0-.124.029-.124.063s.057.063.124.063z" fill="url(#jjjj)"></path></g><g filter="url(#kkkk)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.579 2.293c.044 0 .076-.02.076-.046 0-.027-.034-.048-.076-.048-.044 0-.078.021-.078.048 0 .025.034.046.076.046h.002z" fill="url(#llll)"></path></g></g></g><defs><filter id="bbbb" x="13.892" y="14.729" width="11.065" height="15.065" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="4"></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_803_329"></feBlend></filter><filter id="cccc" x="15.344" y="-2.179" width="8.522" height="8.521" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"></feColorMatrix><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_803_329"></feBlend><feBlend in="SourceGraphic" in2="effect1_dropShadow_803_329" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="65"></feOffset><feGaussianBlur stdDeviation="1.5"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="shape" result="effect2_innerShadow_803_329"></feBlend></filter><filter id="eeee" x="15.425" y="-2.072" width="8.312" height="8.313" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_803_329"></feBlend><feBlend in="SourceGraphic" in2="effect1_dropShadow_803_329" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="1"></feOffset><feGaussianBlur stdDeviation="1.5"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="shape" result="effect2_innerShadow_803_329"></feBlend></filter><filter id="hhhh" x="14.252" y="-3.236" width="10.661" height="10.661" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="2.582" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><filter id="iiii" x="11.305" y="-6.247" width="16.558" height="16.434" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="4.077" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><filter id="kkkk" x="14.337" y="-2.965" width="10.482" height="10.422" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="2.582" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><radialGradient id="dddd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(19.583 2.083) scale(.26042)"><stop offset=".24" stop-color="#8F8F8F"></stop><stop offset=".5" stop-color="#090A0F"></stop><stop offset=".998" stop-color="#090A0F"></stop></radialGradient><radialGradient id="ffff" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(19.58 2.084) scale(.15625)"><stop offset=".092" stop-color="#242C33"></stop><stop offset=".289" stop-color="#1A1719"></stop><stop offset="1" stop-color="#1A1719"></stop></radialGradient><radialGradient id="jjjj" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .0929 -.18581 0 19.583 1.972)"><stop stop-color="#65BBFF"></stop><stop offset=".581" stop-color="#E0DDE7"></stop><stop offset="1" stop-color="#968BAC"></stop></radialGradient><radialGradient id="llll" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .07918 -.13196 0 19.579 2.173)"><stop stop-color="#88888A"></stop><stop offset=".558" stop-color="#8B8B8B"></stop><stop offset="1" stop-color="#505050"></stop></radialGradient><clipPath id="aaaa"><path fill="#fff" d="M0 0h40v40H0z"></path></clipPath></defs></svg>
134
+ <% } %>
135
+ </td>
136
+ <td class="text-center">
137
+ <%= totalSnapshots %>
138
+ </td>
139
+ <td class="text-center">
140
+ <%= totalScreenshots %>
141
+ </td>
142
+ <td class="text-center">
143
+ <%= unreviewedSnapshots %>
144
+ </td>
145
+ <td class="text-center">
146
+ <%= unreviewedScreenshots %>
147
+ </td>
148
+ </tr>
149
+ </tbody>
150
+ </table>
151
+ <div class="row g-0 my-3">
152
+ <div class="col-md-4 text-center border p-2">
153
+ <label>Snapshot Name</label>
154
+ <select id="select-snapshot">
155
+ <option selected>All</option>
156
+ <% for(let snapshot of details){ %>
157
+ <option value="<%= snapshot['name'] %>">
158
+ <%= snapshot['name'] %>
159
+ </option>
160
+ <% } %>
161
+ </select>
162
+ </div>
163
+ <div class="col-md-4 text-center border p-2">
164
+ <label>Snapshot Width</label>
165
+ <select id="select-width">
166
+ <% for(let width of widths){ %>
167
+ <option value="<%= width %>">
168
+ <%= width %>
169
+ </option>
170
+ <% } %>
171
+ </select>
172
+ </div>
173
+ <div class="col-md-4 text-center border p-2">
174
+ <label>Browser</label>
175
+ <select id="select-browser">
176
+ <% for(let browser of browsers){ %>
177
+ <option value="<%= browser %>">
178
+ <%= browser %>
179
+ </option>
180
+ <% } %>
181
+ </select>
182
+ </div>
183
+ </div>
184
+ <hr>
185
+ <% for(let snapshot of details){ %>
186
+ <% for(let comparison of snapshot.comparisons){ %>
187
+ <div class="row gx-2">
188
+ <div class="col-md-12">
189
+ <table hidden data-type="diff-ratio" data-name="<%= snapshot.name %>"
190
+ data-width="<%= comparison.width %>" data-browser="<%= comparison.browser %>" class="m-3">
191
+ <tbody>
192
+ <tr>
193
+ <td>Diff Ratio:</td>
194
+ <td class="color-<%= comparison['diff-color'] %>" ><%= comparison['diff-percentage'] %></td>
195
+ </tr>
196
+ </tbody>
197
+ </table>
198
+ </div>
199
+ <div class="col-md-6 image-container">
200
+ <img hidden data-type="base" data-name="<%= snapshot.name %>"
201
+ data-width="<%= comparison.width %>" data-browser="<%= comparison.browser %>"
202
+ src="<%= comparison.images['base']?.file || comparison.images['base']?.url %>" alt="No Base Image Found">
203
+ </div>
204
+ <% if(!comparison.images['base'] || comparison.images['diff'] || comparison.images['head']){ %>
205
+ <div onclick="onClickOverlay(event,this)" class="col-md-6 image-container comparison-container">
206
+ <img hidden data-type="head" data-name="<%= snapshot.name %>"
207
+ data-width="<%= comparison.width %>" data-browser="<%= comparison.browser %>"
208
+ src="<%= comparison.images['head'].file || comparison.images['head']?.url %>" alt="No Head Image Found">
209
+ <% if (comparison.images['diff']) { %> <img hidden data-type="diff"
210
+ data-name="<%= snapshot.name %>" data-width="<%= comparison.width %>"
211
+ data-browser="<%= comparison.browser %>" class="overlay"
212
+ src="<%= comparison.images['diff']?.file || comparison.images['diff']?.url %>" alt="">
213
+ <% } %>
214
+ </div>
215
+ <% } %>
216
+ </div>
217
+ <% }} %>
218
+ </div>
219
+ </body>
220
+
221
+ </html>
@@ -0,0 +1,176 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
8
+ integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
9
+ <title>Document</title>
10
+ </head>
11
+ <style>
12
+ .table{
13
+ max-width: 768px !important;
14
+ }
15
+ .logo{
16
+ display: block;
17
+ width: 150px;
18
+ height: auto;
19
+ margin: auto;
20
+ }
21
+ .browser-icon{
22
+ width: 30px;
23
+ height: 30px;
24
+ }
25
+ </style>
26
+ <body class="p-5">
27
+ <div class="container">
28
+ <svg class="logo my-5" width="116" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M109.723 26.385c-.066.211-.175.36-.324.443l-.043.021c-.162.066-.335.057-.539.007-.657-.162-3.706-.505-2.487-4.067l.723-2.112-.164-.41-.792-1.885-4.966-11.538a.614.614 0 0 1 .028-.606c.101-.155.279-.233.531-.238h2.825c.194 0 .359.052.485.15.127.098.219.248.298.432l3.645 8.528 2.615-8.504a.8.8 0 0 1 .289-.446c.131-.1.298-.16.493-.16h3.018c.256 0 .438.074.545.21.107.14.121.338.042.6l-4.058 12.734-1.565 4.942-.599 1.9zM97.368 14.95h3.085c.477 0 .757.303.589.773-.87 2.873-3.618 4.861-6.9 4.861-4.263 0-7.432-3.176-7.432-7.291C86.71 9.175 89.879 6 94.142 6c3.282 0 6.03 1.988 6.9 4.86.168.47-.112.774-.589.774h-3.085c-.365 0-.617-.165-.842-.469-.504-.69-1.374-1.077-2.384-1.077-1.823 0-3.225 1.298-3.225 3.204 0 1.905 1.402 3.203 3.225 3.203 1.01 0 1.88-.386 2.384-1.049.225-.332.449-.497.842-.497zm-15.11-8.202v.72c.35-.61 1.146-1.474 3.223-1.447.15.002.272.059.36.15.132.134.195.315.195.549v3.375c0 .23-.049.4-.15.515-.098.114-.243.172-.431.172a4.08 4.08 0 0 0-1.187.129c-.378.1-.721.271-1.022.505-.3.239-.54.559-.716.949-.178.396-.268.877-.271 1.45l-.02 3.6c-.02 3.76-2.932 3.19-3.612 3.151-.231-.013-.412-.062-.537-.185-.126-.124-.19-.301-.19-.53V6.747c0-.229.064-.406.19-.53s.305-.185.537-.185h2.905c.233 0 .412.061.538.185.126.124.189.3.189.53zm-12.586-.74c1.025.004 1.966.188 2.824.55a6.743 6.743 0 0 1 2.232 1.524 6.957 6.957 0 0 1 1.463 2.303c.345.881.522 1.845.527 2.891 0 .18-.005.354-.019.519-.01.17-.023.335-.037.5-.028.22-.112.38-.242.482-.13.101-.303.151-.513.151h-9.338c.177.542.424.982.75 1.322.326.335.708.578 1.136.734.434.156.895.23 1.385.23a3.658 3.658 0 0 0 1.141-.188c.36-.124.671-.29.928-.5.135-.11.27-.198.4-.262.136-.064.29-.097.466-.097l2.685-.027c.256.005.442.078.554.22.107.142.112.326.005.55a5.947 5.947 0 0 1-1.468 2.006 6.162 6.162 0 0 1-2.125 1.22 8.256 8.256 0 0 1-2.642.41c-1.165-.006-2.214-.194-3.146-.56-.936-.368-1.733-.877-2.395-1.538a6.74 6.74 0 0 1-1.528-2.303c-.354-.882-.532-1.836-.536-2.869.005-1.032.186-1.987.55-2.867a6.913 6.913 0 0 1 1.542-2.304 7 7 0 0 1 2.367-1.538c.914-.367 1.925-.555 3.034-.56zm-19.617 1.5a6.578 6.578 0 0 1 1.88-1.09c.7-.262 1.44-.398 2.19-.398 1.856 0 3.67.817 4.887 2.138 1.215 1.319 1.967 3.14 1.967 5.152 0 2.01-.752 3.832-1.967 5.151a6.746 6.746 0 0 1-4.888 2.138c-1.36 0-2.786-.42-3.78-1.36l.003 4.473c.003 3.76-2.932 3.19-3.612 3.151-.23-.013-.411-.062-.537-.186-.126-.123-.189-.3-.189-.53L46 6.767c0-.233.065-.417.194-.544.13-.127.315-.19.552-.19H49.3c.238 0 .423.063.552.19.13.127.191.31.194.544l.01.741zm7.255 5.763c0-1.774-1.45-3.211-3.24-3.211-1.789 0-3.24 1.438-3.24 3.211 0 1.774 1.451 3.212 3.24 3.212 1.79 0 3.24-1.438 3.24-3.212zm10.363-3.055c-.527.357-.9.885-1.118 1.574h5.987c-.149-.519-.372-.937-.67-1.248a2.618 2.618 0 0 0-1.026-.67 3.446 3.446 0 0 0-1.202-.202c-.788.004-1.45.183-1.97.546z" fill="#333"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M39.482 7.275c-.23-.758-.84-1.503-1.565-1.2A5.688 5.688 0 0 1 36 6.5c-1.429-1.341-5.631-4-8.398-5.505 0 0 .338.987.804 2.831 0 0-2.978-2.326-6.348-3.826 0 0 .948 1.946 1.026 2.576 0 0-3.092-1.076-7.43-1.484 0 0 2.084 1.453 2.892 2.564 0 0-3.066-.156-7.645 0 0 0 2.603 1.055 3.752 2.025 0 0-5.434.552-8.504 1.435 0 0 3.46 1.22 4.42 2.127 0 0-4.412 1.257-8.86 3.825 0 0 2.471.432 4.405 1.277 0 0-2.463 1.722-6.114 6.42 0 0 2.698-.515 4.549-.37 0 0-2.345 2.74-3.569 6.93 0 0 1.357-.864 2.67-1.177 0 0 .142 4.998 2.875 5.798l.002-.003c.134.042.261.057.372.057.134 0 .273-.02.415-.061.867-.248 1.523-1.104 2.283-2.095.249-.324.505-.657.776-.981a6.595 6.595 0 0 1 1.176-1.27c.966-.797 2.303-1.4 3.931-1.159 1.834.155 2.966 1.982 3.877 3.45.473.764 1.1 2.116 2.149 2.116 1.16 0 1.567-1.39 2.084-3.104a16.946 16.946 0 0 1 2.149-4.553c1.81-2.693 4.124-4.157 6.9-5.6 2.659-1.383 5.172-2.69 6.432-4.672.63-.991.943-2.207.928-3.615-.012-1.262-.288-2.427-.517-3.18zM26.352 6.5l-4.294-2 6.348 1.575-2.055.425zm-9.758.616l5.305 1.357 2.314-.768-7.62-.59zm10.46 2.66l1.132-.858L23.084 10l3.97-.224zm-8.508 0l-1.815 1.216-5.03-.479 6.845-.737zm5.667 3.039l1.841-1.03-6.844.737 5.003.293zm-5.07 1.143l-1.283 2.109-6.422 1.57 7.705-3.679zm-8.023 1.298L6.15 17.445l6.102-4.377-1.13 2.188zM9.401 17.88l-.196 2.19L6 23l3.401-5.12z" fill="#333"></path><path d="M26.332 31.457c-.558-.009-1.15-.486-1.8-1.454.383-2.192 1.897-4.991 3.718-6.869-.465 1.744-.527 3.495-.576 4.901v.002c-.032.91-.06 1.695-.19 2.267-.174.765-.555 1.154-1.133 1.154h-.02z" fill="#333"></path><path d="M10.901 29.875c.473 1.068.978 1.588 1.542 1.588a.893.893 0 0 0 .137-.01c.766-.121 1.476-1.606 2.07-3.043.154-.373.298-.745.427-1.09-1.696.02-3.345 1.384-4.176 2.555z" fill="#333"></path></svg>
29
+ <table class="table table-bordered m-auto">
30
+ <thead>
31
+ <tr>
32
+ <th>Summary Report</th>
33
+ <th> <%=new Date(startDate).toDateString()%> - <%=new Date(endDate).toDateString()%> </th>
34
+ </tr>
35
+ </thead>
36
+ <tbody>
37
+ <tr>
38
+ <td>Project Name</td>
39
+ <td> <a href="<%=projectURL%>"> <%=projectName%> </a></td>
40
+ </tr>
41
+ <tr>
42
+ <td>Browsers Enabled</td>
43
+ <td>
44
+ <% if(browsers.includes('Safari')) { %>
45
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="38.698" cy="38.568" r="38" fill="#BABABA"></circle><circle cx="38.698" cy="38.568" r="38" fill="url(#x)"></circle><circle cx="38.698" cy="38.568" r="38" fill="url(#w)"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="#309CFF"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="url(#cc)"></circle><circle cx="38.698" cy="38.568" r="32.707" fill="url(#dd)"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M37.168 35.58L19.705 58.046 39.668 38.08l-2.501-2.501z" fill="#fff"></path><path d="M19.704 58.046L42.17 40.582l-2.5-2.501-19.966 19.965z" fill="#fff"></path><path d="M42.166 40.59l-2.629-2.641-19.816 20.096L42.166 40.59z" fill="#E5E5E5"></path><path d="M37.19 35.59l22.254-17.298-17.362 22.336-.184.047-4.809-4.809.101-.275z" fill="#EA3939"></path><path d="M42.159 40.574l-2.641-2.63 20.096-19.816-17.455 22.446z" fill="#AD2C2C"></path><rect x="38.698" y="8.255" width="1.64" height="5.66" rx=".82" fill="#E8F4FF"></rect><rect x="38.698" y="63.584" width="1.64" height="5.66" rx=".82" fill="#E8F4FF"></rect><rect x="69.013" y="37.93" width="1.64" height="5.66" rx=".82" transform="rotate(90 69.013 37.93)" fill="#E8F4FF"></rect><rect x="13.683" y="37.93" width="1.64" height="5.66" rx=".82" transform="rotate(90 13.683 37.93)" fill="#E8F4FF"></rect><rect x="60.661" y="59.733" width="1.64" height="5.66" rx=".82" transform="rotate(135 60.66 59.733)" fill="#E8F4FF"></rect><rect x="21.537" y="20.609" width="1.64" height="5.66" rx=".82" transform="rotate(135 21.537 20.61)" fill="#E8F4FF"></rect><defs><radialGradient id="w" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .065 38.633) scale(38)"><stop offset=".927" stop-color="#B6C6FF" stop-opacity="0"></stop><stop offset="1" stop-color="#CFCFD1"></stop></radialGradient><radialGradient id="cc" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(52.933 -10.487 32.545) scale(56.3527)"><stop offset=".594" stop-color="#60D9FF" stop-opacity=".59"></stop><stop offset="1" stop-color="#003CB1" stop-opacity=".83"></stop></radialGradient><radialGradient id="dd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .065 38.633) scale(32.7068)"><stop offset=".87" stop-color="#5587E8" stop-opacity="0"></stop><stop offset="1" stop-color="#175ECA"></stop></radialGradient><linearGradient id="x" x1="12.796" y1="12.307" x2="65.319" y2="65.307" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".79"></stop><stop offset="1" stop-color="#fff" stop-opacity="0"></stop></linearGradient></defs></svg>
46
+ <% } %>
47
+ <% if(browsers.includes('Firefox')) { %>
48
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M36.977 0c20.42 0 36.976 16.464 36.976 36.778 0 20.308-16.555 36.777-36.976 36.777S0 57.086 0 36.778C0 16.462 16.556 0 36.977 0z" transform="translate(2.465)" fill="url(#a)"></path><path d="M45.762 70.558C64.532 67.545 78.886 51.4 78.886 31.88l-.36.444c.562-3.71.464-7.015-.308-9.898-.276 2.136-.577 3.425-.88 3.943-.002-.167-.044-2.393-.757-5.5-.338-2.265-.833-4.396-1.518-6.365.167.902.266 1.655.315 2.337C72.514 9.196 65.461-.217 48.084.004c0 0 6.111.642 8.988 4.975 0 0-2.94-.7-5.164.372 2.709 1.074 5.058 2.197 7.057 3.37l.173.105c.513.306.95.62 1.413.931 3.692 2.58 7.119 6.26 6.858 11.007-.797-1.25-1.857-2.07-3.215-2.482 1.674 6.522 1.839 11.909.486 16.158-.93-2.83-1.785-4.526-2.547-5.124 1.063 8.743-.37 15.209-4.287 19.423.745-2.572 1.04-4.678.873-6.34-4.602 6.919-9.838 10.496-15.708 10.717-2.32-.02-4.51-.368-6.572-1.045-3.027-1.017-5.766-2.756-8.204-5.222 3.806.316 7.282-.34 10.342-1.893l5.011-3.266-.02-.014c.651-.246 1.263-.226 1.86.05 1.222-.166 1.65-.818 1.242-1.919-.592-.819-1.487-1.562-2.636-2.216-2.507-1.302-5.125-1.096-7.856.637-2.6 1.471-5.103 1.412-7.538-.152-1.595-1.096-3.136-2.572-4.625-4.416l-.591-.87c-.28 2.089.037 4.769.98 8.069l.02.044-.02-.04c-.946-3.3-1.26-5.986-.98-8.073v-.02c.071-1.824.83-2.83 2.277-3.055l-.614-.051.62.051c1.634.15 3.51.523 5.625 1.136.355-2.03-.111-4.156-1.39-6.336v-.04c1.986-1.843 3.749-3.184 5.255-4.04.668-.355 1.057-.895 1.186-1.623l.054-.04.02-.019.074-.071c.389-.579.258-1.044-.407-1.456a16.664 16.664 0 0 1-4.179-.297l-.02.056c-.574-.166-1.298-.674-2.19-1.532l-2.286-2.236-.685-.537v.071h-.02l.02-.09-.13-.136.184-.13c.316-1.694.836-3.15 1.578-4.4l.167-.15c.745-1.231 2.172-2.553 4.27-3.965-3.9.483-7.427 2.231-10.563 5.254-2.6-.948-5.682-.747-9.23.613l-.426.324-.032.017.463-.338.02-.02C10.835 8.71 9.33 5.78 8.605.992 5.766 3.789 4.39 8.784 4.483 15.995l-.814 1.223-.21.142-.041.04-.018.017-.04.08c-.43.673-1.025 1.688-1.774 3.05C.508 22.476.145 24.094.04 25.504l-.01.017.006.047-.035.37.062-.098c.007.326.014.655.098.949l2.303-1.883c-.836 2.106-1.39 4.34-1.672 6.708l-.066 1.084-.723-.822c0 8.405 2.683 16.175 7.208 22.56l.136.21.217.258a39.539 39.539 0 0 0 12.222 10.945c3.459 2.038 7.176 3.465 11.14 4.313l.816.181c.82.157 1.661.275 2.504.38.624.081 1.248.16 1.879.214l.838.095 1.19.008 1.295.064 1.03-.052 1.699-.083a39.852 39.852 0 0 0 2.987-.322l.6-.088zM70.704 22.77l-.017.321.012-.323.005.002z" transform="translate(0 4.897)" fill="url(#b)"></path><defs><linearGradient id="a" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 73.5555 -73.9534 0 73.953 0)"><stop stop-color="#0093F7"></stop><stop offset="1" stop-color="#372893"></stop></linearGradient><linearGradient id="b" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(78.8861 0 0 88.4522 0 -9.471)"><stop stop-color="#FE3229"></stop><stop offset="1" stop-color="#FFD71F"></stop></linearGradient></defs></svg>
49
+ <% } %>
50
+ <% if(browsers.includes('Chrome')) { %>
51
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M38 57.447c-3.86 0-7.372-1.04-10.54-3.117-3.169-2.078-5.544-4.75-7.125-8.015L4.75 19C1.484 24.84 0 31.371 0 38c0 9.5 3.092 17.789 9.277 24.864 6.184 7.075 13.88 11.305 23.082 12.692l11.023-19.074c-1.11.326-2.96.965-5.382.965z" fill="#4AAE48"></path><path d="M26.05 22.636C29.562 19.916 33.547 19 38 19h32.656c-3.366-5.738-7.942-10.588-13.73-13.953C51.136 1.684 44.828 0 37.999 0c-5.937 0-11.48 1.261-16.625 3.786-5.146 2.522-9.908 6.196-13.397 10.91L18.999 33.25c1.088-4.254 3.537-7.89 7.052-10.614z" fill="#EA3939"></path><path d="M73.143 23.75h-22.08c3.86 3.86 6.384 8.809 6.384 14.25 0 4.059-1.138 7.769-3.415 11.134L38.447 76c10.39-.1 19.247-3.86 26.571-11.281C72.338 57.297 76 48.39 76 38c0-4.847-.817-9.947-2.857-14.25z" fill="#FED14B"></path><path d="M38 52.25c7.87 0 14.25-6.38 14.25-14.25S45.87 23.75 38 23.75 23.75 30.13 23.75 38 30.13 52.25 38 52.25z" fill="#188FD1"></path></svg>
52
+ <% } %>
53
+ <% if(browsers.includes('Edge')) { %>
54
+ <svg class="w-full browser-icon" viewBox="0 0 77 77" width="100" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#z)"><path d="M68.584 56.56c-1.014.53-2.058.997-3.129 1.399a30.242 30.242 0 0 1-10.657 1.917c-14.046 0-26.282-9.662-26.282-22.061a9.343 9.343 0 0 1 4.877-8.107c-12.705.535-15.97 13.774-15.97 21.53 0 21.931 20.212 24.154 24.567 24.154 2.348 0 5.889-.682 8.014-1.353l.39-.13a38.096 38.096 0 0 0 19.769-15.674 1.187 1.187 0 0 0-1.58-1.674z" fill="url(#y)"></path><path opacity=".35" d="M68.584 56.56c-1.014.53-2.058.997-3.129 1.399a30.242 30.242 0 0 1-10.657 1.917c-14.046 0-26.282-9.662-26.282-22.061a9.343 9.343 0 0 1 4.877-8.107c-12.705.535-15.97 13.774-15.97 21.53 0 21.931 20.212 24.154 24.567 24.154 2.348 0 5.889-.682 8.014-1.353l.39-.13a38.096 38.096 0 0 0 19.769-15.674 1.187 1.187 0 0 0-1.58-1.674z" fill="url(#c)"></path><path d="M31.378 71.663a23.51 23.51 0 0 1-6.75-6.334 23.96 23.96 0 0 1 8.765-35.621c.926-.437 2.508-1.226 4.613-1.188a9.603 9.603 0 0 1 7.626 3.86 9.463 9.463 0 0 1 1.888 5.538c0-.062 7.26-23.628-23.748-23.628C10.741 14.29.025 26.656.025 37.506A38.634 38.634 0 0 0 3.62 54.129a37.996 37.996 0 0 0 46.42 19.92 22.426 22.426 0 0 1-18.636-2.374l-.026-.012z" fill="url(#d)"></path><path opacity=".41" d="M31.378 71.663a23.51 23.51 0 0 1-6.75-6.334 23.96 23.96 0 0 1 8.765-35.621c.926-.437 2.508-1.226 4.613-1.188a9.603 9.603 0 0 1 7.626 3.86 9.463 9.463 0 0 1 1.888 5.538c0-.062 7.26-23.628-23.748-23.628C10.741 14.29.025 26.656.025 37.506A38.634 38.634 0 0 0 3.62 54.129a37.996 37.996 0 0 0 46.42 19.92 22.426 22.426 0 0 1-18.636-2.374l-.026-.012z" fill="url(#e)"></path><path d="M45.211 44.188c-.24.312-.98.742-.98 1.68 0 .775.505 1.52 1.402 2.146 4.268 2.969 12.316 2.577 12.336 2.577a17.68 17.68 0 0 0 8.986-2.479 18.22 18.22 0 0 0 9.033-15.697c.077-6.652-2.375-11.075-3.366-13.034C66.332 7.077 52.754 0 37.989 0A37.996 37.996 0 0 0-.007 37.462c.143-10.847 10.924-19.607 23.748-19.607 1.038 0 6.963.101 12.467 2.99 4.85 2.546 7.391 5.622 9.158 8.67 1.834 3.167 2.16 7.169 2.16 8.763 0 1.594-.813 3.957-2.315 5.91z" fill="url(#f)"></path><path d="M45.211 44.188c-.24.312-.98.742-.98 1.68 0 .775.505 1.52 1.402 2.146 4.268 2.969 12.316 2.577 12.336 2.577a17.68 17.68 0 0 0 8.986-2.479 18.22 18.22 0 0 0 9.033-15.697c.077-6.652-2.375-11.075-3.366-13.034C66.332 7.077 52.754 0 37.989 0A37.996 37.996 0 0 0-.007 37.462c.143-10.847 10.924-19.607 23.748-19.607 1.038 0 6.963.101 12.467 2.99 4.85 2.546 7.391 5.622 9.158 8.67 1.834 3.167 2.16 7.169 2.16 8.763 0 1.594-.813 3.957-2.315 5.91z" fill="url(#g)"></path></g><defs><radialGradient id="c" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(28.3129 0 0 26.8972 46.662 52.974)"><stop offset=".72" stop-opacity="0"></stop><stop offset=".95" stop-opacity=".53"></stop><stop offset="1"></stop></radialGradient><radialGradient id="e" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-81.384 44.823 17.356) scale(42.575 34.3963)"><stop offset=".76" stop-opacity="0"></stop><stop offset=".95" stop-opacity=".5"></stop><stop offset="1"></stop></radialGradient><radialGradient id="f" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(92.291 -2.921 10.717) scale(60.1379 128.081)"><stop stop-color="#35C1F1"></stop><stop offset=".11" stop-color="#34C1ED"></stop><stop offset=".23" stop-color="#2FC2DF"></stop><stop offset=".31" stop-color="#2BC3D2"></stop><stop offset=".67" stop-color="#36C752"></stop></radialGradient><radialGradient id="g" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(73.74 20.31 58.993) scale(28.8947 23.4971)"><stop stop-color="#66EB6E"></stop><stop offset="1" stop-color="#66EB6E" stop-opacity="0"></stop></radialGradient><linearGradient id="y" x1="17.423" y1="52.556" x2="70.362" y2="52.556" gradientUnits="userSpaceOnUse"><stop stop-color="#0C59A4"></stop><stop offset="1" stop-color="#114A8B"></stop></linearGradient><linearGradient id="d" x1="45.332" y1="29.592" x2="12.267" y2="65.608" gradientUnits="userSpaceOnUse"><stop stop-color="#1B9DE2"></stop><stop offset=".16" stop-color="#1595DF"></stop><stop offset=".67" stop-color="#0680D7"></stop><stop offset="1" stop-color="#0078D4"></stop></linearGradient><clipPath id="z"><path fill="#fff" d="M0 0h76v76H0z"></path></clipPath></defs></svg>
55
+ <% } %>
56
+ <% if(browsers.includes('Safari on iPhone')) { %>
57
+ <svg class="w-full browser-icon" width="100" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#aaa)"><path d="M28.375 0h-16.25A3.09 3.09 0 0 0 9 3.047v33.906A3.09 3.09 0 0 0 12.125 40h16.25a3.09 3.09 0 0 0 3.125-3.047V3.047A3.09 3.09 0 0 0 28.375 0zm1.875 36.953a1.84 1.84 0 0 1-1.875 1.796h-16.25a1.84 1.84 0 0 1-1.875-1.796V3.047a1.84 1.84 0 0 1 1.875-1.797h3.125A1.301 1.301 0 0 0 16.5 2.5H24a1.343 1.343 0 0 0 1.25-1.25h3.125a1.84 1.84 0 0 1 1.875 1.797v33.906z" fill="#000"></path><path d="M30.25 36.953a1.84 1.84 0 0 1-1.875 1.796h-16.25a1.84 1.84 0 0 1-1.875-1.796V3.047a1.84 1.84 0 0 1 1.875-1.797h3.125A1.301 1.301 0 0 0 16.5 2.5H24a1.343 1.343 0 0 0 1.25-1.25h3.125a1.84 1.84 0 0 1 1.875 1.797v33.906z" fill="#BFD2EE"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="#BABABA"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="url(#bbb)"></path><path d="M20.18 27.52a7.432 7.432 0 1 0 0-14.865 7.432 7.432 0 0 0 0 14.866z" fill="url(#ccc)"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="#309CFF"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="url(#ddd)"></path><path d="M20.177 26.485a6.397 6.397 0 1 0 0-12.794 6.397 6.397 0 0 0 0 12.794z" fill="url(#eee)"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M19.88 19.505l-3.416 4.394 3.905-3.905-.49-.49h.001z" fill="#fff"></path><path d="M16.464 23.9l4.394-3.417-.49-.49-3.904 3.906z" fill="#fff"></path><path d="M20.856 20.484l-.514-.517-3.876 3.93 4.39-3.413z" fill="#E5E5E5"></path><path d="M19.882 19.508l4.353-3.383-3.396 4.369-.036.009-.94-.94.02-.055h-.001z" fill="#EA3939"></path><path d="M20.854 20.482l-.517-.514 3.93-3.876-3.413 4.39z" fill="#AD2C2C"></path><path d="M20.498 14.32a.16.16 0 1 0-.32 0v.786a.16.16 0 0 0 .32 0v-.786zm0 10.823a.16.16 0 1 0-.32 0v.787a.16.16 0 0 0 .32 0v-.787zm5.45-4.86a.16.16 0 0 0 0-.32h-.787a.16.16 0 1 0 0 .32h.787zm-10.661-.16a.16.16 0 0 0-.16-.16h-.786a.16.16 0 1 0 0 .32h.786a.16.16 0 0 0 .16-.16zm8.847 4.217a.16.16 0 0 0 .227-.227l-.556-.556a.16.16 0 0 0-.274.114.162.162 0 0 0 .047.113l.556.556zm-7.427-7.652a.16.16 0 0 0 0-.226l-.556-.556a.16.16 0 1 0-.227.226l.556.556a.161.161 0 0 0 .227 0z" fill="#E8F4FF"></path></g><defs><radialGradient id="ccc" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .045 20.134) scale(7.43234)"><stop offset=".927" stop-color="#B6C6FF" stop-opacity="0"></stop><stop offset="1" stop-color="#CFCFD1"></stop></radialGradient><radialGradient id="ddd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(52.933 -8.346 25.3) scale(11.0219)"><stop offset=".594" stop-color="#60D9FF" stop-opacity=".59"></stop><stop offset="1" stop-color="#003CB1" stop-opacity=".83"></stop></radialGradient><radialGradient id="eee" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(90 .044 20.132) scale(6.39705)"><stop offset=".87" stop-color="#5587E8" stop-opacity="0"></stop><stop offset="1" stop-color="#175ECA"></stop></radialGradient><linearGradient id="bbb" x1="15.113" y1="14.952" x2="25.386" y2="25.319" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".79"></stop><stop offset="1" stop-color="#fff" stop-opacity="0"></stop></linearGradient><clipPath id="aaa"><path fill="#fff" d="M0 0h40v40H0z"></path></clipPath></defs></svg>
58
+ <% } %>
59
+ <% if(browsers.includes('Chrome on Android')) { %>
60
+ <svg class="w-full browser-icon" width="100" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#aaaa)"><path d="M10.152.38H28.62v39.298H10.152V.381z" fill="#A4A9AF"></path><g filter="url(#bbbb)"><path d="M19.425 25.791a5.531 5.531 0 1 0 0-11.062 5.531 5.531 0 0 0 0 11.062z" fill="#F9F9F9"></path><path d="M19.425 23.09a2.743 2.743 0 0 1-1.535-.453 2.88 2.88 0 0 1-1.037-1.168l-2.268-3.975c-.476.85-.694 1.8-.694 2.766 0 1.383.452 2.59 1.353 3.619.899 1.03 2.019 1.646 3.36 1.848l1.604-2.776c-.162.046-.43.14-.783.14z" fill="#4AAE48"></path><path d="M17.684 18.024c.51-.396 1.091-.53 1.739-.53h4.754a5.576 5.576 0 0 0-2-2.03 5.39 5.39 0 0 0-2.754-.735c-.865 0-1.67.183-2.42.552a5.35 5.35 0 0 0-1.951 1.587l1.605 2.7a2.82 2.82 0 0 1 1.027-1.544z" fill="#EA3939"></path><path d="M24.54 18.186h-3.214c.562.562.93 1.282.93 2.077 0 .59-.166 1.13-.498 1.619l-2.27 3.912a5.311 5.311 0 0 0 3.868-1.644c1.067-1.08 1.6-2.377 1.6-3.89 0-.704-.12-1.447-.417-2.074z" fill="#FED14B"></path><path d="M19.425 22.335a2.075 2.075 0 0 0 1.525-3.573 2.075 2.075 0 1 0-1.525 3.573z" fill="#188FD1"></path></g><path d="M10.076.19h18.505" stroke="#435553" stroke-width=".5"></path><path d="M10.038 39.985v-.381M10 .19h.114H10zm.038.191V0v.381zm0 0v39.566V.38zM10 .191h.114H10zm.038.19V0v.381zM28.62.191h.114-.114zm.038.19V0v.381zM10 39.794h.114H10z" stroke="#4E494B" stroke-width=".5"></path><path d="M10.038.38v39.567" stroke="#2E403E" stroke-width=".5"></path><path d="M28.651 39.81l-18.504.012" stroke="#3C4F4D" stroke-width=".5"></path><path d="M28.688 39.62V40m.038-.19h-.114.114z" stroke="#4E494B" stroke-width=".5"></path><path d="M28.688 39.62L28.667.053" stroke="#2E403E" stroke-width=".5"></path><path d="M29.168 14.826v2.442m0-9.766v4.88-4.88z" stroke="#0A2C28" stroke-width=".15"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M19.585 2.501a.417.417 0 1 0 0-.834.417.417 0 0 0 0 .834z" fill="#212022"></path><g filter="url(#cccc)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.342a.26.26 0 1 0 .044-.519.26.26 0 0 0-.044.52z" fill="url(#dddd)"></path></g><g filter="url(#eeee)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.58 2.24a.156.156 0 1 0 .001-.312.156.156 0 0 0 0 .312z" fill="url(#ffff)"></path></g><mask id="gggg" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="19" y="1" width="1" height="2"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.58 2.24a.156.156 0 1 0 .001-.312.156.156 0 0 0 0 .312z" fill="#fff"></path></mask><g mask="url(#gggg)"><g filter="url(#hhhh)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.261a.166.166 0 1 0 0-.333.166.166 0 0 0 0 .333z" fill="#1A1719"></path></g><g opacity=".776" filter="url(#iiii)"><path opacity=".776" fill-rule="evenodd" clip-rule="evenodd" d="M19.583 2.033c.07 0 .126-.029.126-.063s-.058-.063-.126-.063c-.069 0-.124.029-.124.063s.057.063.124.063z" fill="url(#jjjj)"></path></g><g filter="url(#kkkk)"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.579 2.293c.044 0 .076-.02.076-.046 0-.027-.034-.048-.076-.048-.044 0-.078.021-.078.048 0 .025.034.046.076.046h.002z" fill="url(#llll)"></path></g></g></g><defs><filter id="bbbb" x="13.892" y="14.729" width="11.065" height="15.065" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="4"></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_803_329"></feBlend></filter><filter id="cccc" x="15.344" y="-2.179" width="8.522" height="8.521" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"></feColorMatrix><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_803_329"></feBlend><feBlend in="SourceGraphic" in2="effect1_dropShadow_803_329" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="65"></feOffset><feGaussianBlur stdDeviation="1.5"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="shape" result="effect2_innerShadow_803_329"></feBlend></filter><filter id="eeee" x="15.425" y="-2.072" width="8.312" height="8.313" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_803_329"></feBlend><feBlend in="SourceGraphic" in2="effect1_dropShadow_803_329" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="1"></feOffset><feGaussianBlur stdDeviation="1.5"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend in2="shape" result="effect2_innerShadow_803_329"></feBlend></filter><filter id="hhhh" x="14.252" y="-3.236" width="10.661" height="10.661" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="2.582" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><filter id="iiii" x="11.305" y="-6.247" width="16.558" height="16.434" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="4.077" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><filter id="kkkk" x="14.337" y="-2.965" width="10.482" height="10.422" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="2.582" result="effect1_foregroundBlur_803_329"></feGaussianBlur></filter><radialGradient id="dddd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(19.583 2.083) scale(.26042)"><stop offset=".24" stop-color="#8F8F8F"></stop><stop offset=".5" stop-color="#090A0F"></stop><stop offset=".998" stop-color="#090A0F"></stop></radialGradient><radialGradient id="ffff" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(19.58 2.084) scale(.15625)"><stop offset=".092" stop-color="#242C33"></stop><stop offset=".289" stop-color="#1A1719"></stop><stop offset="1" stop-color="#1A1719"></stop></radialGradient><radialGradient id="jjjj" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .0929 -.18581 0 19.583 1.972)"><stop stop-color="#65BBFF"></stop><stop offset=".581" stop-color="#E0DDE7"></stop><stop offset="1" stop-color="#968BAC"></stop></radialGradient><radialGradient id="llll" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .07918 -.13196 0 19.579 2.173)"><stop stop-color="#88888A"></stop><stop offset=".558" stop-color="#8B8B8B"></stop><stop offset="1" stop-color="#505050"></stop></radialGradient><clipPath id="aaaa"><path fill="#fff" d="M0 0h40v40H0z"></path></clipPath></defs></svg>
61
+ <% } %>
62
+ </td>
63
+ </tr>
64
+ <tr>
65
+ <td> Total Builds </td>
66
+ <td> <%=totalBuilds%> </td>
67
+ </tr>
68
+ <tr>
69
+ <td> Total Builds Approved </td>
70
+ <td> <%=totalBuildsApproved%> </td>
71
+ </tr>
72
+ <tr>
73
+ <td> Total Builds Unreviewed </td>
74
+ <td>
75
+ <% if(totalBuildsUnreviewed) { %>
76
+ <a href="#unreviewedBuilds">
77
+ <% } %>
78
+ <%=totalBuildsUnreviewed%>
79
+ </a>
80
+ </td>
81
+
82
+ </tr>
83
+ <tr>
84
+ <td> Total Builds Failed </td>
85
+ <td>
86
+ <% if(totalBuildsFailed) { %>
87
+ <a href="#failedBuilds">
88
+ <% } %>
89
+ <%=totalBuildsFailed%>
90
+ </a>
91
+ </td>
92
+ </tr>
93
+ <tr>
94
+ <td> Total Builds Requesting Changes</td>
95
+ <td> <%=totalBuildsRequestingChanges%> </td>
96
+ </tr>
97
+ <tr>
98
+ <td> Total Snapshots</td>
99
+ <td> <%=totalSnapshots%> </td>
100
+ </tr>
101
+ <tr>
102
+ <td> Total Snapshots Requesting Changes</td>
103
+ <td> <%=totalSnapshotsRequestingChanges%> </td>
104
+ </tr>
105
+ <tr>
106
+ <td> Total Snapshots Unreviewed</td>
107
+ <td> <%=totalSnapshotsUnreviewed%> </td>
108
+ </tr>
109
+ <tr>
110
+ <td> Total Snapshots Reviewed</td>
111
+ <td> <%=totalSnapshotsReviewed%> </td>
112
+ </tr>
113
+
114
+ <tr>
115
+ <td> Total Comparisons</td>
116
+ <td> <%=totalComparisons%> </td>
117
+ </tr>
118
+ </tbody>
119
+ </table>
120
+ <% if(totalBuildsUnreviewed) { %>
121
+ <section id="unreviewedBuilds">
122
+ <table class="table table-bordered mx-auto mt-5">
123
+ <thead>
124
+ <tr>
125
+ <th colspan="2">Unreviewed Builds</th>
126
+ </tr>
127
+ <tr>
128
+ <th>Build ID</th>
129
+ <th>Build Created At</th>
130
+ </tr>
131
+ </thead>
132
+ <tbody>
133
+ <% for(let unreviewedBuild of unreviewedBuilds){ %>
134
+ <tr>
135
+ <td>
136
+ <a href="<%= unreviewedBuild['buildUrl'] %>">Build <%= unreviewedBuild['buildNo'] %></a>
137
+ </td>
138
+ <td>
139
+ <%= new Date(unreviewedBuild['timestamp']) %>
140
+ </td>
141
+ </tr>
142
+ <% } %>
143
+ </tbody>
144
+ </table>
145
+ </section>
146
+ <% } %>
147
+ <% if(totalBuildsFailed) { %>
148
+ <section id="failedBuilds">
149
+ <table class="table table-bordered mx-auto mt-5">
150
+ <thead>
151
+ <tr>
152
+ <th colspan="2">Failed Builds</th>
153
+ </tr>
154
+ <tr>
155
+ <th>Build ID</th>
156
+ <th>Build Created At</th>
157
+ </tr>
158
+ </thead>
159
+ <tbody>
160
+ <% for(let failedBuild of failedBuilds){ %>
161
+ <tr>
162
+ <td>
163
+ <a href="<%= failedBuild['buildUrl'] %>">Build <%= failedBuild['buildNo'] %></a>
164
+ </td>
165
+ <td>
166
+ <%= new Date(failedBuild['timestamp']) %>
167
+ </td>
168
+ </tr>
169
+ <% } %>
170
+ </tbody>
171
+ </table>
172
+ </section>
173
+ <% } %>
174
+ </div>
175
+ </body>
176
+ </html>