JSFiddle - React, Tailwind, and code Playground

HTML

<div id="panel_log"></div>

CSS

#panel_log {
  position:absolute;
  width:100px;
  height:100px;
  border:1px solid #000;
  background-color:#fff;
  top:20px;
  left:20px;
  cursor:move;
}

JavaScript

var spaceY;
		var spaceX;
    
		var move_start = function(e) {
			var panel_log = document.getElementById('panel_log');
			spaceY = parseInt(window.getComputedStyle(panel_log,null).getPropertyValue('top')) - parseInt(e.clientY);
			spaceX = parseInt(window.getComputedStyle(panel_log,null).getPropertyValue('left')) - parseInt(e.clientX);

			window.addEventListener('mousemove',moving,false);
			window.addEventListener('mouseup',finishing,false);
		}
		var moving = function(e) {
			var panel_log = document.getElementById('panel_log');
			panel_log.style.top = parseInt(e.clientY) + spaceY + 'px';
			panel_log.style.left = parseInt(e.clientX) + spaceX + 'px';
		};
		var finishing = function(e) {
			var panel_log = document.getElementById('panel_log');
			window.removeEventListener('mousemove', moving, false);
			window.removeEventListener('mouseup', finishing, false);
		};

		document.getElementById('panel_log').addEventListener('mousedown',move_start,false);