First, have a look at https://tiddlytools.com/#TiddlyTools%2FTime%2FEditDate macro.
It provides an $edit-text input control with a popup Calendar. If TiddlyTools/Time/Calendar is not installed (or if “type:date” is specified as a parameter), then the default HTML date picker is used as a fallback; and, if “type:button” is specified, then the $edit-text input control is suppressed and a $button is used instead.
For your purposes, you can get a simple button when using type=date
(the default HTML date picker), without using TiddlyTools/Time/EditDate, like this:
<$edit-text tiddler=... field=... class="date-button" tag="input" type="date"/>
where the date-button
class is defined as:
.date-button { width:1.5em; height:1.5em; padding:0; }
The really important part is width:1.5em
, which forces the text input field to only be wide enough to show the system-provided calendar icon, which effectively hides the date input text.
enjoy,
-e