diff --git a/install/package.json b/install/package.json index 480b97927a..2331e72ad7 100644 --- a/install/package.json +++ b/install/package.json @@ -107,10 +107,10 @@ "nodebb-plugin-ntfy": "1.7.7", "nodebb-plugin-spam-be-gone": "2.3.0", "nodebb-rewards-essentials": "1.0.0", - "nodebb-theme-harmony": "1.2.93", + "nodebb-theme-harmony": "1.2.94", "nodebb-theme-lavender": "7.1.17", - "nodebb-theme-peace": "2.2.32", - "nodebb-theme-persona": "13.3.61", + "nodebb-theme-peace": "2.2.33", + "nodebb-theme-persona": "13.3.62", "nodebb-widget-essentials": "7.0.31", "nodemailer": "6.9.16", "nprogress": "0.2.0", diff --git a/public/scss/generics.scss b/public/scss/generics.scss index baa5a01087..a95d7b1c25 100644 --- a/public/scss/generics.scss +++ b/public/scss/generics.scss @@ -117,16 +117,21 @@ blockquote { .hover-visible { visibility: hidden; } + .hover-opacity-75 { + opacity: 0; + &:focus { opacity: 0.75 } + } + .hover-opacity-100 { + opacity: 0; + &:focus {opacity: 1; } + } + &:hover { - .hover-d-block { - display: block!important; - } - .hover-d-flex { - display: flex!important; - } - .hover-visible { - visibility: visible; - } + .hover-d-block { display: block!important; } + .hover-d-flex { display: flex!important; } + .hover-visible { visibility: visible; } + .hover-opacity-100 { opacity: 1; } + .hover-opacity-75 { opacity: 0.75; } } } diff --git a/public/vendor/jquery/draggable-background/backgroundDraggable.js b/public/vendor/jquery/draggable-background/backgroundDraggable.js index 8453e5aeb0..6785d32e6a 100644 --- a/public/vendor/jquery/draggable-background/backgroundDraggable.js +++ b/public/vendor/jquery/draggable-background/backgroundDraggable.js @@ -79,6 +79,39 @@ imageDimensions = getBackgroundImageDimensions($el); } + $(window).on('keydown.dbg', (e) => { + var pos = $el.css('background-position').match(/(-?\d+).*?\s(-?\d+)/) || []; + var xPos = parseInt(pos[1]) || 0; + var yPos = parseInt(pos[2]) || 0; + // We must convert percentage back to pixels + if (options.units == 'percent') { + xPos = Math.round(xPos / -200 * imageDimensions.width); + yPos = Math.round(yPos / -200 * imageDimensions.height); + } + + var x = 0, y = 0; + if (e.which === 37) { // left + x = -5 + } else if (e.which === 39) { // right + x = 5 + } else if (e.which === 38) { // up + y = -5 + } else if (e.which === 40) { // down + y = +5 + } + if (options.units === 'percent') { + xPos = options.axis === 'y' ? xPos : limit(-imageDimensions.width/2, 0, xPos+x, options.bound); + yPos = options.axis === 'x' ? yPos : limit(-imageDimensions.height/2, 0, yPos+y, options.bound); + + // Convert pixels to percentage + $el.css('background-position', xPos / imageDimensions.width * -200 + '% ' + yPos / imageDimensions.height * -200 + '%'); + } else { + xPos = options.axis === 'y' ? xPos : limit($el.innerWidth()-imageDimensions.width, 0, xPos+x, options.bound); + yPos = options.axis === 'x' ? yPos : limit($el.innerHeight()-imageDimensions.height, 0, yPos+y, options.bound); + } + return [37, 38, 39, 40].includes(e.which) ? false : undefined; + }); + $el.on('mousedown.dbg touchstart.dbg', function(e) { if (e.target !== $el[0]) { return; @@ -145,7 +178,7 @@ Plugin.prototype.disable = function() { var $el = $(this.element); $el.off('mousedown.dbg touchstart.dbg'); - $window.off('mousemove.dbg touchmove.dbg mouseup.dbg touchend.dbg mouseleave.dbg'); + $window.off('mousemove.dbg touchmove.dbg mouseup.dbg touchend.dbg mouseleave.dbg keydown.dbg'); } $.fn.backgroundDraggable = function(options) {