JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<?php include('inc/Breadcrumbs.php');?>
<div class="departaments_cont container">
    <div class="pages_top_filter">
        <div class="pages_title">
            <h1 tabindex="0">this is interesting</h1>
            <div class="title_line"></div>
        </div>
        <div class="filter_">
            <div class="filter_name">Search with date:</div>
            <div class="filter_box" style="width: 166px;">
                <div class="filter_outer" tabindex="0">
                    <div class="firts_option">
                        <span style="width: auto;margin-right: 10px;"> Pick a date</span>
                        <input type="text" style="opacity: 0;" class="input_flat">
                        <span class="cl_">
                            <svg xmlns="http://www.w3.org/2000/svg" width="19.557" height="20" viewBox="0 0 19.557 20">
                                <g id="calendar" transform="translate(-5.411)">
                                    <g id="Group_199" data-name="Group 199" transform="translate(5.411)">
                                        <path id="Path_235" data-name="Path 235" d="M119.527,258.7a.454.454,0,0,0-.454-.454h-1.584a.454.454,0,0,0-.454.454v1.584a.454.454,0,0,0,.454.454h1.584a.454.454,0,0,0,.454-.454V258.7Z" transform="translate(-112.462 -247.662)" fill="#0c172d" />
                                        <path id="Path_236" data-name="Path 236" d="M216.162,258.7a.454.454,0,0,0-.454-.454h-1.584a.454.454,0,0,0-.454.454v1.584a.454.454,0,0,0,.454.454h1.584a.454.454,0,0,0,.454-.454Z" transform="translate(-205.137 -247.662)" fill="#0c172d" />
                                        <path id="Path_237" data-name="Path 237" d="M312.79,258.7a.454.454,0,0,0-.454-.454h-1.584a.454.454,0,0,0-.454.454v1.584a.454.454,0,0,0,.454.454h1.584a.454.454,0,0,0,.454-.454Z" transform="translate(-297.807 -247.662)" fill="#0c172d" />
                                        <path id="Path_238" data-name="Path 238"...