You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@ignite.apache.org by GitBox <gi...@apache.org> on 2018/11/03 19:54:25 UTC
[GitHub] asfgit closed pull request #58: IGNITE-10125 Uniform style for
buttons
asfgit closed pull request #58: IGNITE-10125 Uniform style for buttons
URL: https://github.com/apache/ignite-teamcity-bot/pull/58
This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:
As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):
diff --git a/ignite-tc-helper-web/src/main/webapp/comparison.html b/ignite-tc-helper-web/src/main/webapp/comparison.html
index 82cf0968..b8d5b70b 100644
--- a/ignite-tc-helper-web/src/main/webapp/comparison.html
+++ b/ignite-tc-helper-web/src/main/webapp/comparison.html
@@ -34,7 +34,7 @@
<td style="text-align: center;" id="info2"></td>
</tr>
<tr><td class="field">DURATION</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphDuration" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphDuration" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Duration1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="Duration2" data-allow-highlight="true"></td>
</tr>
@@ -45,7 +45,7 @@
</tr><tr></tr>
<tr><td class="section">TESTS</td><td></td><td class="mmm title 1"></td><td class="mmm title 2"></td></tr>
<tr><td class="field">COUNT</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphCount" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphCount" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Count1" data-allow-highlight="false"></td>
<td class="mmm data 2" id="Count2" data-allow-highlight="false"></td>
</tr>
@@ -55,7 +55,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphCount2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">PASSED</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphPassed" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphPassed" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Passed1" data-allow-highlight="false"></td>
<td class="mmm data 2" id="Passed2" data-allow-highlight="false"></td>
</tr>
@@ -65,7 +65,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphPassed2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">FAILED</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphFailed" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphFailed" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Failed1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="Failed2" data-allow-highlight="true"></td>
</tr>
@@ -75,7 +75,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphFailed2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">IGNORED</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphIgnored" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphIgnored" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Ignored1" data-allow-highlight="false"></td>
<td class="mmm data 2" id="Ignored2" data-allow-highlight="false"></td>
</tr>
@@ -85,7 +85,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphIgnored2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">MUTED</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphMuted" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphMuted" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="Muted1" data-allow-highlight="false"></td>
<td class="mmm data 2" id="Muted2" data-allow-highlight="false"></td></tr>
<tr id="showGraphMuted" style="display: none;"><td></td>
@@ -96,7 +96,7 @@
<tr><td class="section">PROBLEMS</td><td></td><td class="mmm title 1"></td><td class="mmm title 2"></td></tr>
<tr style="display: none;"><td></td><td></td><td></td></tr>
<tr><td class="field">TOTAL</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphTT" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphTT" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="TT1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="TT2" data-allow-highlight="true"></td></tr>
<tr id="showGraphTT" style="display: none;"><td></td>
@@ -105,7 +105,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphTT2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">EXECUTION TIMEOUT</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphET" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphET" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="ET1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="ET2" data-allow-highlight="true"></td>
</tr>
@@ -115,7 +115,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphET2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">JVM CRASH</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphJC" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphJC" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="JC1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="JC2" data-allow-highlight="true"></td>
</tr>
@@ -125,7 +125,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphJC2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">OOME</td>
- <td class="icon"></td>
+ <td class="icon"><button id="clickGraphOO" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="OO1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="OO2" data-allow-highlight="true"></td>
</tr>
@@ -135,7 +135,7 @@
<td style="text-align: center;"><svg class="graph 2" id="graphOO2" width="500" height="200"></svg></td>
</tr>
<tr><td class="field">EXIT CODE</td>
- <td class="icon"><p class="tooltips"><img id="clickGraphEC" src='/img/browser.png'><span>show graph</span></p></td>
+ <td class="icon"><button id="clickGraphEC" class="more white short"><i class="fas fa-caret-down"></i></button></td>
<td class="mmm data 1" id="EC1" data-allow-highlight="true"></td>
<td class="mmm data 2" id="EC2" data-allow-highlight="true"></td>
</tr>
@@ -663,7 +663,13 @@
function graphSpoiler(fieldName) {
$("#clickGraph" + fieldName).click(function() {
let element = $('#showGraph' + fieldName);
- element.css('display') === 'none' ? element.css('display', '') : element.css('display', 'none');
+ if (element.css('display') === 'none') {
+ element.css('display', '');
+ $(this).html("<i class='fas fa-caret-up'></i>");
+ } else {
+ element.css('display', 'none');
+ $(this).html("<i class='fas fa-caret-down'></i>");
+ }
});
}
diff --git a/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css b/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css
index 1c20db8f..c591c54a 100644
--- a/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css
+++ b/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css
@@ -117,6 +117,54 @@ input[type=button]:hover, input[type=submit]:hover, button:hover {
transition: ease-in 0.175s;
}
+button.more {
+ display: inline-block;
+ font-size: 12px;
+ border-radius: 4px;
+ padding-bottom: 2px;
+ padding-right: 5px;
+ padding-left: 5px;
+ text-align: center;
+}
+
+button.more.full {
+ width: 70px;
+}
+
+button.more.short {
+ width: 27px;
+
+}
+
+button.more.white {
+ border: 2px solid #12AD5E;
+ color: #12AD5E;
+ background: white;
+}
+
+button.more.white:hover {
+ background: #eeeeee;
+}
+
+button.more.green {
+ background: #12AD5E;
+ color: #FFF;
+ border: 2px solid #FFF;
+}
+
+button.more.green:hover {
+ background: #128c46;
+}
+
+button.more > b {
+ padding-right:5px;
+}
+
+button.more > i {
+ padding-left: 1px;
+ padding-right:1px;
+}
+
form, .formgroup {
margin: 0px auto;
padding: 5px;
@@ -299,6 +347,7 @@ form li:after
td.details-control {
//background: url('../resources/details_open.png') no-repeat center center;
cursor: pointer;
+ text-align: center;
//content: "+➖";
}
tr.shown td.details-control {
@@ -472,43 +521,3 @@ div.tooltip {
transition: transform .25s;
display: inline-block;
}
-
-.testClass:hover > i {
- transform: scale(1.2) translateX(0.8em) translateY(1px);
-}
-
-p.tooltips {
- position: relative;
- display: inline;
-}
-p.tooltips span {
- position: absolute;
- width:100px;
- color: #FFFFFF;
- background: #000000;
- height: 30px;
- line-height: 30px;
- text-align: center;
- visibility: hidden;
- border-radius: 5px;
-}
-p.tooltips span:after {
- content: '';
- position: absolute;
- top: 50%;
- right: 100%;
- margin-top: -8px;
- width: 0; height: 0;
- border-right: 8px solid #000000;
- border-top: 8px solid transparent;
- border-bottom: 8px solid transparent;
-}
-p:hover.tooltips span {
- visibility: visible;
- opacity: 0.8;
- left: 100%;
- top: 50%;
- margin-top: -15px;
- margin-left: 15px;
- z-index: 999;
-}
diff --git a/ignite-tc-helper-web/src/main/webapp/js/prs-1.0.js b/ignite-tc-helper-web/src/main/webapp/js/prs-1.0.js
index 4e96144d..a72e05a9 100644
--- a/ignite-tc-helper-web/src/main/webapp/js/prs-1.0.js
+++ b/ignite-tc-helper-web/src/main/webapp/js/prs-1.0.js
@@ -66,7 +66,8 @@ function showContributionsTable(result, srvId, suiteId) {
"defaultContent": "",
"render": function (data, type, row, meta) {
if (type === 'display') {
- return "<button>✔ Inspect</button>";
+ return "<button class='more full green' type='button' id='button_" + row.prNumber +"'>" +
+ "<b>ᴍᴏʀᴇ</b><i class='fas fa-caret-down'></i></button>";
}
}
},
@@ -142,11 +143,13 @@ function showContributionsTable(result, srvId, suiteId) {
if (row.child.isShown()) {
// This row is already open - close it
row.child.hide();
+ $("#button_" + row.data().prNumber).html("<b>ᴍᴏʀᴇ</b><i class='fas fa-caret-down'></i>");
tr.removeClass('shown');
}
else {
// Open this row
row.child(formatContributionDetails(row.data(), srvId, suiteId)).show();
+ $("#button_" + row.data().prNumber).html("<b>ʟᴇss </b><i class='fas fa-caret-up'></i>");
tr.addClass('shown');
}
});
diff --git a/ignite-tc-helper-web/src/main/webapp/js/testfails-2.1.js b/ignite-tc-helper-web/src/main/webapp/js/testfails-2.1.js
index 4342d600..037a7203 100644
--- a/ignite-tc-helper-web/src/main/webapp/js/testfails-2.1.js
+++ b/ignite-tc-helper-web/src/main/webapp/js/testfails-2.1.js
@@ -3,6 +3,9 @@
//triggerConfirm & triggerDialog element should be provided on page (may be hidden)
var g_initMoreInfoDone = false;
+var more = "<button class='more white short'><i class='fas fa-caret-down'></i></button>";
+var less = "<button class='more white short'><i class='fas fa-caret-up'></i></button>";
+
/** Object used to notify git. See ChainAtServerCurrentStatus Java class. */
var g_srv_to_notify_git;
@@ -159,7 +162,7 @@ function showChainCurrentStatusData(server, settings) {
if(!isDefinedAndFilled(findGetParameter("reportMode"))) {
res += "<span class='container'>";
- res += " <a href='javascript:void(0);' class='header'>More >></a>";
+ res += " <a href='javascript:void(0);' class='header'>" + more + "</a>";
res += "<div class='content'>" + mInfo + "</div></span>";
}
@@ -646,7 +649,7 @@ function showSuiteData(suite, settings) {
if(!isDefinedAndFilled(findGetParameter("reportMode"))) {
res += "<span class='container'>";
- res += " <a href='javascript:void(0);' class='header'>More >></a>";
+ res += " <a href='javascript:void(0);' class='header'>" + more + "</a>";
res += "<div class='content'>" + mInfo + "</div></span>";
}
@@ -891,7 +894,7 @@ function showTestFailData(testFail, isFailureShown, settings) {
if (isDefinedAndFilled(testFail.warnings) && testFail.warnings.length > 0
&& !isDefinedAndFilled(findGetParameter("reportMode"))) {
res += "<span class='container'>";
- res += " <a href='javascript:void(0);' class='header'>More >></a>";
+ res += " <a href='javascript:void(0);' class='header'>" + more + "</a>";
res += "<div class='content'>";
@@ -986,9 +989,9 @@ function initMoreInfo() {
$content.slideToggle(500, function() {
//execute this after slideToggle is done
//change text of header based on visibility of content div
- $header.text(function() {
+ $header.html(function() {
//change text based on condition
- return $content.is(":visible") ? "Hide <<" : "More >>";
+ return $content.is(":visible") ? less : more;
});
});
});
diff --git a/ignite-tc-helper-web/src/main/webapp/pr.html b/ignite-tc-helper-web/src/main/webapp/pr.html
index e7851e58..6f667cad 100644
--- a/ignite-tc-helper-web/src/main/webapp/pr.html
+++ b/ignite-tc-helper-web/src/main/webapp/pr.html
@@ -4,7 +4,8 @@
<link rel="icon" href="img/leaf-icon-png-7066.png">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="css/style-1.5.css">
-
+ <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css"
+ integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/common-1.6.js"></script>
diff --git a/ignite-tc-helper-web/src/main/webapp/prs.html b/ignite-tc-helper-web/src/main/webapp/prs.html
index 668d3e31..5ebd3dc6 100644
--- a/ignite-tc-helper-web/src/main/webapp/prs.html
+++ b/ignite-tc-helper-web/src/main/webapp/prs.html
@@ -14,6 +14,8 @@
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/dataTables.jqueryui.js"></script>
+ <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css"
+ integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
<script src="js/common-1.6.js"></script>
<script src="js/testfails-2.1.js"></script>
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services