Skip to content

Commit 54d3b79

Browse files
morvadermorvader
authored
Merge pull request #5 from morvader/style_extension_with_bootstrap
Style extension with bootstrap. Minor fixes
2 parents a55c45c + 559ef8a commit 54d3b79

36 files changed

Lines changed: 902 additions & 900 deletions

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,3 +51,4 @@ crashlytics.properties
5151
crashlytics-build.properties
5252
fabric.properties
5353

54+
.vscode/launch.json

‎HTMLReport/loadData.js‎

Lines changed: 378 additions & 331 deletions
Large diffs are not rendered by default.

‎HTMLReport/preview.css‎

Lines changed: 43 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,65 @@
1-
#canvasHolder {
2-
float: left;
3-
/*height:300px;*/
4-
/*width:400px;*/
5-
height:95%;
6-
width:95%;
1+
body{
2+
min-width: 40%;
3+
max-width: 100%;
74
}
8-
#sessionInfo{
9-
height:auto;
10-
overflow: auto;
5+
#sessionInfo {
6+
font-size: 0.7rem;
117
}
8+
#sessionInfo ul li span {
9+
font-weight: bold;
10+
display: block;
11+
font-size: 0.8rem;
12+
}
13+
1214
a.canvasjs-chart-credit {
1315
display: none;
1416
}
15-
#sessionData {
16-
font-size:16px;
17-
/*font-weight:bold;*/
18-
border: 1px solid #d3cdcd;
19-
float: left;
20-
width:22%;
21-
}
2217

23-
#sessionResults{
24-
/*clear:both;*/
18+
#export{
2519
float: right;
26-
margin-left:5px;
27-
width:77%;
20+
clear:both;
2821
}
2922

30-
#export{
31-
float:left;
32-
/*clear:both;*/
33-
margin-left:5px;
34-
margin-top: 4px;
35-
}
36-
.info{
37-
float:left;
38-
clear: both;
39-
margin: 5px;
40-
}
4123
img{
4224
padding:2px;
25+
vertical-align: top;
4326
}
44-
.centered{
45-
text-align:center;
46-
vertical-align: middle;
27+
28+
#sessionActivityTable.tr {
29+
vertical-align: top;
30+
}
31+
.Type {
32+
33+
}
34+
.Description {
35+
4736
}
48-
.noWrap{
49-
white-space: nowrap;
37+
.URL {
38+
5039
}
51-
TH{
52-
padding:5px;
40+
.Screenshot {
41+
5342
}
5443

55-
#sessionActivityTable {
56-
border: 1px solid #B0B0B0;
57-
}
58-
#sessionActivityTable tbody {
59-
/* Kind of irrelevant unless your .css is alreadt doing something else */
60-
margin: 0;
61-
padding: 0;
62-
border: 0;
63-
outline: 0;
64-
font-size: 100%;
65-
vertical-align: baseline;
66-
background: transparent;
67-
}
68-
#sessionActivityTable thead {
69-
text-align: center;
70-
}
71-
#sessionActivityTable thead th {
72-
background: -moz-linear-gradient(top, #F0F0F0 0, #DBDBDB 100%);
73-
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F0F0F0), color-stop(100%, #DBDBDB));
74-
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F0F0F0', endColorstr='#DBDBDB', GradientType=0);
75-
border: 1px solid #B0B0B0;
76-
color: #444;
77-
font-size: 16px;
78-
font-weight: bold;
79-
padding: 3px 10px;
80-
}
81-
#sessionActivityTable td {
82-
padding: 3px 10px;
44+
.annotationDescription, .annotationUrl {
45+
font-size: 0.7rem;
46+
vertical-align: top;
47+
white-space: pre;
48+
}
8349

50+
tr.Bug {
51+
/*background-color: #f5c6cb;*/
52+
}
53+
tr.Note {
54+
/*background-color: #ffeeba;*/
8455
}
85-
#sessionActivityTable tr:nth-child(even) {
86-
background: #F2F2F2;
56+
tr.Question {
57+
/*background-color: #c3e6cb;*/
8758
}
59+
tr.Idea {
60+
/*background-color: #bee5eb;*/
61+
}
62+
8863
.updatethVal{
8964
width: 100%;
9065
}

‎HTMLReport/preview.html‎

Lines changed: 33 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,9 @@
22
<html>
33
<head>
44
<title>Exploratory Session Report</title>
5-
<link rel="stylesheet" type="text/css" href="preview.css">
6-
<link rel="stylesheet" type="text/css" href="../popUp.css">
5+
<link rel="stylesheet" href="../css/bootstrap.min.css">
6+
<link rel="stylesheet" href="preview.css">
7+
<!--<link rel="stylesheet" href="../css/popUp.css">-->
78

89
<script src="loadData.js" type="text/javascript"></script>
910
<script src="../lib/tablefilter_all_min.js" type="text/javascript"></script>
@@ -14,37 +15,46 @@
1415
<script src="../lib/date.js" type="text/javascript"></script>
1516
<script src="../lib/browserInfo.js" type="text/javascript"></script>
1617
<script src="../lib/canvasjs.min.js" type="text/javascript"></script>
17-
<script src="../lib/jquery-1.11.3.min.js" type="text/javascript"></script>
18+
<script src="../js/jquery-3.3.1.min.js" type="text/javascript"></script>
1819

1920
</head>
2021
<body>
2122

22-
<button id="fakeData" style="display: none;">Init</button>
23-
<h1>Exploratory Session Report</h1>
24-
25-
<div id="sessionData">
26-
<div id="sessionInfo">
27-
<span class="info" id="sessionDate">Date</span>
28-
<span class="info" id="browserInfo">Browser</span>
29-
<span class="info" id="osInfo">OS</span>
30-
<span class="info" id="miscInfo">MiscInfo</span>
23+
<div class="container">
24+
<div class="row">
25+
<div class="col">
26+
<h1 class="display-4">Exploratory Session Report</h1>
27+
</div>
3128
</div>
3229

33-
<div id="graph">
34-
<div id="canvasHolder">
35-
<span>Graph</span>
36-
</div>
37-
</div>
30+
<div class="row">
31+
<div class="col-3">
32+
<div id="sessionData">
33+
<div id="sessionInfo">
34+
<ul class="list-group">
35+
<li class="list-group-item" id="sessionDate">Date</li>
36+
<li class="list-group-item" id="browserInfo">Browser</li>
37+
<li class="list-group-item" id="osInfo">OS</li>
38+
<li class="list-group-item" id="miscInfo">MiscInfo</li>
39+
</div>
40+
<div id="graph">
41+
<div id="canvasHolder">
42+
<span>Graph</span>
43+
</div>
44+
</div>
3845

39-
</div>
46+
</div>
47+
</div>
4048

41-
<div>
42-
<div id="sessionResults">
43-
<label>Data Table</label>
44-
</div>
49+
<div class="col-9">
50+
<div id="sessionResults">
51+
<label>Data Table</label>
52+
</div>
4553

54+
</div>
4655
</div>
47-
<button id="export" class="actionButton" title="Get report in a plain HTML file">Export Session to HTML</button>
56+
57+
</div>
4858
<div id="divOverlay">
4959
<div id='deleteDialog'>
5060
<span>Delete this annotation?</span>

‎css/bootstrap.min.css‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎css/popUp.css‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
body {
2+
min-width: 300px;
3+
max-width: 400px;
4+
}
5+
.form-control-sm {
6+
width: 100%;
7+
}
8+
9+
.screenshot {
10+
background-image: url("../images/device-camera.svg");
11+
background-repeat: no-repeat;
12+
background-size: 75%;
13+
background-position: 4px 3px;
14+
min-width: 30px;
15+
}
16+
17+
.add {
18+
background-image: url("../images/diff-added.svg");
19+
background-repeat: no-repeat;
20+
background-size: 75%;
21+
background-position: 4px 3px;
22+
min-width: 30px;
23+
}
24+
.card-header {
25+
padding: 4px 0 0 7px;
26+
}
27+
.card, .card-body, .card > .card > .card-header, .card-body > .card-footer {
28+
padding: 2px 3px;
29+
}
30+
31+
.cancel {
32+
float: right;
33+
}
34+
35+
.list-group-item > .card > .card-header, .list-group-item > .card > .card-footer, .list-group-item > .card > .card-body {
36+
padding: 2px;
37+
}
38+
39+
.reportAnnotation {
40+
display: none;
41+
margin-top: 2px;
42+
}
43+
44+
#resetConfirmation {
45+
margin-top: 20px;
46+
}
47+
48+
.btn-secondary{
49+
background-color: #f7f7f7;
50+
border-color: #f7f7f7;
51+
52+
}
53+
#resetBtn{
54+
55+
max-height: 30px;
56+
margin-right: 100px;
57+
58+
59+
}
60+
button input.file-input {
61+
display: none;
62+
/*position: absolute;
63+
top: 0;
64+
right: 0;
65+
margin: 0;
66+
padding: 0;
67+
font-size: 20px;
68+
cursor: pointer;
69+
opacity: 0;
70+
filter: alpha(opacity=0);*/
71+
}
72+
#exportCSVBtn{
73+
background-image: url("../images/003-csv.svg");
74+
background-repeat: no-repeat;
75+
background-size: 100%;
76+
/*background-position: 4px 3px; */
77+
min-width: 30px;
78+
min-height: 30px;
79+
}
80+
#exportJsonBtn{
81+
background-image: url("../images/002-download.svg");
82+
background-repeat: no-repeat;
83+
background-size: 100%;
84+
/*background-position: 4px 3px; */
85+
min-width: 30px;
86+
min-height: 30px;
87+
margin-left: 5px;
88+
}
89+
#importJsonBtn{
90+
background-image: url("../images/004-up-arrow.svg");
91+
background-repeat: no-repeat;
92+
background-size: 100%;
93+
/*background-position: 4px 3px; */
94+
min-width: 30px;
95+
min-height: 30px;
96+
margin-left: 5px;
97+
}
98+
#previewBtn{
99+
background-image: url("../images/001-graphic.svg");
100+
background-repeat: no-repeat;
101+
background-size: 100%;
102+
/*background-position: 4px 3px; */
103+
min-width: 30px;
104+
min-height: 30px;
105+
margin-left: 5px;
106+
}

‎images/001-graphic.svg‎

Lines changed: 54 additions & 0 deletions
Loading

‎images/001-interface.png‎

-354 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)