Sophivorus has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/345777 )
Change subject: Add tooltips for each parameter
......................................................................
Add tooltips for each parameter
Bug: T154586
Change-Id: I61a18489c751ee002553c8f2cc85565396a64149
---
M proveit.css
M proveit.js
2 files changed, 38 insertions(+), 3 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/wikipedia/gadgets/ProveIt
refs/changes/77/345777/1
diff --git a/proveit.css b/proveit.css
index 8a63e1d..b35f107 100755
--- a/proveit.css
+++ b/proveit.css
@@ -3,7 +3,7 @@
border: 1px solid #ddd;
font-size: .8em;
position: fixed;
- z-index: 2147483647; /* Max value */
+ z-index: 4;
}
.skin-monobook #proveit {
@@ -52,7 +52,6 @@
background: #f4f4f4;
border-top: 1px solid #ddd;
overflow-y: scroll;
- overflow-x: hidden;
width: 700px;
height: 300px;
resize: both;
@@ -169,4 +168,40 @@
#proveit-buttons button:hover {
background: #eee;
+}
+
+/**
+ * Simple CSS tooltip by Keenan Payne
+ * http://www.webdesignerdepot.com/2012/11/how-to-create-a-simple-css3-tooltip/
+ */
+
+[data-tooltip] {
+ display: inline;
+ position: relative;
+}
+
+[data-tooltip]:hover:after {
+ background: #333;
+ background: rgba( 0, 0, 0, .8 );
+ border-radius: 5px;
+ bottom: 26px;
+ color: #fff;
+ content: attr(data-tooltip);
+ font-weight: normal;
+ left: 20%;
+ padding: 5px 15px;
+ position: absolute;
+ z-index: 98;
+ width: 220px;
+}
+
+[data-tooltip]:hover:before {
+ border: solid;
+ border-color: #333 transparent;
+ border-width: 6px 6px 0 6px;
+ bottom: 20px;
+ content: "";
+ left: 50%;
+ position: absolute;
+ z-index: 99;
}
\ No newline at end of file
diff --git a/proveit.js b/proveit.js
index 5c088a9..8b03da2 100755
--- a/proveit.js
+++ b/proveit.js
@@ -1045,7 +1045,7 @@
}
// Start building the table row
- label = $( '<label>' ).attr( 'title',
paramDescription ).text( paramLabel );
+ label = $( '<label>' ).attr( 'data-tooltip',
paramDescription ).text( paramLabel );
paramNameInput = $( '<input>' ).addClass(
'proveit-param-name' ).val( paramName ).attr( 'type', 'hidden' );
paramValueInput = $( '<input>' ).addClass(
'proveit-param-value' ).val( paramValue ).attr( 'placeholder', paramPlaceholder
);
--
To view, visit https://gerrit.wikimedia.org/r/345777
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I61a18489c751ee002553c8f2cc85565396a64149
Gerrit-PatchSet: 1
Gerrit-Project: wikipedia/gadgets/ProveIt
Gerrit-Branch: master
Gerrit-Owner: Sophivorus <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
