How to make a calendar with a button, not an input on mobile

Hello,

I search by manually entering the input field.
If I want to search for a date, I click on the calendar topic on the left, select the date in the popup window that opens and it searches.

There is no problem on the computer, but I cannot enter the input field manually on the mobile, the calendar opens

How do I disable opening the calendar in the input field on mobile?
I want to search by manually entering the Input field on mobile. like on computer
how do i do this?

There is no rule that I will use this application, I just want it to select a date from the window and transfer “2021-10-16” into the input.

<div class="smallfont flatpickr" data-allow-input="true" data-wrap="true" data-click-opens="false" style="float:right; padding-top: 6px;padding-right: 6px;padding-bottom: 5px;">

	<a class="input-button" data-clear=""><img alt="Temizle" src="images/x.png" style="width: 18px; height: 18px; cursor: pointer;" /></a>
	<a class="input-button" data-toggle=""><img alt="Tarih Seç" src="images/calendar.png" style="width: 19px; height: 19px; cursor: pointer;" /></a>
	<input data-input="" type="text" class="bginput flatpickr-input" id="search" placeholder="İçerik Ara">
</div>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    <script src="https://npmcdn.com/flatpickr/dist/flatpickr.min.js"></script>
    <script src="https://npmcdn.com/flatpickr/dist/l10n/tr.js"></script>
	<script async>
        flatpickr(".flatpickr", {
            "locale": "tr"
        });
	</script>

ara
ara2

Thank you in advance

I solved the problem as below

<script async>
        flatpickr(".flatpickr", {
            "locale": "tr",
            disableMobile: "true"
        });
    </script>
Sponsor our Newsletter | Privacy Policy | Terms of Service