Fixed placeholder text not appearing when emptying textbox. Fixed marker going...

Fixed placeholder text not appearing when emptying textbox. Fixed marker going under textbox when textbox has more than one rows

src/App.css

@@ -166,12 +166,9 @@ div.login button:hover {
   pointer-events: all;
 }
 
-/* moving the tooltip so that the icon can be clicked */
-/*
-.leaflet-tooltip-center {
-  margin-top: 24px;
+.leaflet-tooltip-bottom:before {
+  border: 0;
 }
-*/
 
 /* Editing editable tooltips */
 .editable {

src/components/DrawTools.js

@@ -10,7 +10,7 @@ L.Draw.MarkerTextBox = L.Draw.Marker.extend({
     icon: L.divIcon({
       className: "dummy",
       iconSize: [20, 20],
-      iconAnchor: [10, 50]
+      iconAnchor: [10, 20]
     }),
     repeatMode: false,
     interactive: true
@@ -84,7 +84,7 @@ class DrawTools extends Component {
 
       e.layer.bindTooltip(tooltip, {
         permanent: true,
-        direction: "center",
+        direction: "bottom",
         interactive: true
       });
 
@@ -110,8 +110,6 @@ class DrawTools extends Component {
 
         console.log(tooltip.firstChild.childNodes.length);
         let margintop = tooltip.firstChild.childNodes.length * 40;
-        e.layer.options.icon.options.iconAnchor = [10, 1000];
-        //tooltip.style.backgroundColor = "#000";
         console.log(e.layer);
         //tooltip.style.marginTop = margintop.toString() + "px";