Enhance datepicker UX: position above input with proper styling

- Added CSS positioning to display inline datepicker above input field
- Enhanced datepicker styling with background, border and shadow
- Improved template with datepicker-above class for better positioning
- Maintains Bootstrap 5 compatibility and inline mode functionality

This provides a better user experience by preventing the datepicker
from appearing below and potentially being cut off by page boundaries.

dist/jqueryui-editable/css/jqueryui-editable.css

@@ -156,6 +156,20 @@
    white-space: pre-wrap;
 }
 
+/* Position datepicker above input for datepicker-above class */
+.datepicker-above .datepicker-inline {
+   position: absolute;
+   bottom: 100%;
+   left: 0;
+   right: 0;
+   z-index: 1000;
+   margin-bottom: 5px;
+   background: white;
+   border: 1px solid #dee2e6;
+   border-radius: 0.375rem;
+   box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+}
+
 .editable-container.editable-popup {
     max-width: none !important; /* without this rule poshytip/tooltip does not stretch */
 }  

dist/jqueryui-editable/js/jqueryui-editable.js

@@ -1503,7 +1503,10 @@ Makes editable any HTML element on the page. Applied as jQuery method.
             this.input = $.fn.editableutils.createInput(this.options);
             if(!this.input) {
                 return; 
-            }            
+            }
+            
+            // Set the editable's type from the input's type
+            this.type = this.input.type;            
 
             //set value from settings or by element's text
             if (this.options.value === undefined || this.options.value === null) {