diff --git a/gulp/res/css/style.css b/gulp/res/css/style.css index 7b70ac75..c087e35d 100644 --- a/gulp/res/css/style.css +++ b/gulp/res/css/style.css @@ -838,6 +838,7 @@ input[type="file"] { box-sizing: border-box; border: 5px solid var(--post-color); overflow-y: auto; + box-shadow: 0 0 3px 1px var(--darken); } #postform:target { @@ -1044,7 +1045,7 @@ table, .boardtable { width: 2.25em; } - input[type="range"], input[type="number"], input[type="text"], input[type="submit"], input[type="password"], input[type="file"], .postform-style, select { + input[type="range"], input[type="number"], input[type="text"], input[type="submit"], input[type="password"], input[type="file"], .postform-style, select, #dragHandle { height: 2.25em; box-sizing: border-box; } diff --git a/gulp/res/js/dragable.js b/gulp/res/js/dragable.js index 80ecb357..474b546d 100644 --- a/gulp/res/js/dragable.js +++ b/gulp/res/js/dragable.js @@ -68,6 +68,8 @@ class Dragable { window.addEventListener('mousemove', e => this.doDrag(e)); break; case 'touchstart': + e.preventDefault(); + e.stopPropagation(); this.xo = e.targetTouches[0].clientX - rect.left; this.yo = e.targetTouches[0].clientY - rect.top; window.addEventListener('touchmove', e => this.doDrag(e)); @@ -76,7 +78,6 @@ class Dragable { //user has alien technology break; } - return false; } //do the actual drag/movement @@ -91,6 +92,8 @@ class Dragable { this.target.style.top = `${this.inBounds(e.clientY, this.yo, this.target.offsetHeight, document.documentElement.clientHeight)}px`; break; case 'touchmove': + e.preventDefault(); + e.stopPropagation(); this.target.style.left = `${this.inBounds(e.targetTouches[0].clientX, this.xo, this.target.offsetWidth, document.documentElement.clientWidth)}px`; this.target.style.top = `${this.inBounds(e.targetTouches[0].clientY, this.yo, this.target.offsetHeight, document.documentElement.clientHeight)}px`; break; @@ -99,7 +102,6 @@ class Dragable { } setLocalStorage('dragtop', this.target.style.top); setLocalStorage('dragleft', this.target.style.left); - return false; } //stopped dragging @@ -113,11 +115,6 @@ class Dragable { } -new Dragable('#dragHandle', '#postform'); - -/* -todo: --event when resizing to prevent going bigger than screen size --event when resizing window to prevent going off screen (reset to right side) --dont show drag handle when mobile and smaller than 400 height (set to middle) -*/ +if (document.getElementById('postform')) { + new Dragable('#dragHandle', '#postform'); +}