mirror_php/php-debugbar
1
0
Fork 0
mirror of https://github.com/maximebf/php-debugbar.git synced 2025-01-16 21:08:34 +01:00
Code Issues Releases Wiki Activity

Allow tooltip to show as key/value list (#686)

Browse Source 
* Allow tooltip to show as key/value list

* Align left
This commit is contained in:
Barry vd. Heuvel 2024-12-12 12:11:10 +01:00 committed by GitHub
parent c2f1006129
commit 39174ebe5f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/DebugBar/Resources/debugbar.css
View File

@ -251,7 +251,7 @@ a.phpdebugbar-open-btn {
.phpdebugbar-indicator span.phpdebugbar-tooltip { .phpdebugbar-indicator span.phpdebugbar-tooltip {
display: none; display: none;
position: absolute; position: absolute;
top: -30px; bottom: 30px;
background: #efefef70; background: #efefef70;
border: 1px solid #ccc; border: 1px solid #ccc;
color: #555; color: #555;
@ -268,6 +268,20 @@ a.phpdebugbar-open-btn {
.phpdebugbar-indicator:hover span.phpdebugbar-tooltip:not(.phpdebugbar-disabled) { .phpdebugbar-indicator:hover span.phpdebugbar-tooltip:not(.phpdebugbar-disabled) {
display: block; display: block;
} }
.phpdebugbar-indicator span.phpdebugbar-tooltip dl {
display: grid;
grid-gap: 4px 10px;
grid-template-columns: max-content;
}
.phpdebugbar-indicator span.phpdebugbar-tooltip dl dt {
font-weight: bold;
text-align: left;
}
.phpdebugbar-indicator span.phpdebugbar-tooltip dl dd {
margin: 0;
grid-column-start: 2;
text-align: left;
}
select.phpdebugbar-datasets-switcher { select.phpdebugbar-datasets-switcher {
float: right; float: right;

13
src/DebugBar/Resources/debugbar.js
View File

@ -328,7 +328,16 @@ if (typeof(PhpDebugBar) == 'undefined') {
this.$tooltip = $('<span />').addClass(csscls('tooltip disabled')).appendTo(this.$el); this.$tooltip = $('<span />').addClass(csscls('tooltip disabled')).appendTo(this.$el);
this.bindAttr('tooltip', function(tooltip) { this.bindAttr('tooltip', function(tooltip) {
if (tooltip) { if (tooltip) {
this.$tooltip.text(tooltip).removeClass(csscls('disabled')); var dl = $('<dl />');
if (Array.isArray(tooltip) || typeof tooltip === 'object') {
$.each(tooltip, function(key, value) {
$('<dt />').text(key).appendTo(dl);
$('<dd />').text(value).appendTo(dl);
});
this.$tooltip.html(dl).removeClass(csscls('disabled'));
} else {
this.$tooltip.text(tooltip).removeClass(csscls('disabled'));
}
} else { } else {
this.$tooltip.addClass(csscls('disabled')); this.$tooltip.addClass(csscls('disabled'));
} }
@ -665,7 +674,7 @@ if (typeof(PhpDebugBar) == 'undefined') {
* @this {DebugBar} * @this {DebugBar}
* @param {String} name Internal name * @param {String} name Internal name
* @param {String} icon * @param {String} icon
* @param {String} tooltip * @param {String|Object} tooltip
* @param {String} position "right" or "left", default is "right" * @param {String} position "right" or "left", default is "right"
* @return {Indicator} * @return {Indicator}
*/ */