Coffee Luv Bug Design System

Input Type - Date

Here is the example of input type date used in our applications form,

It shows a date picker in the input field.

Date:

Here is the html code of our app's form input type date,

        
    
        <form>
        <label for="date">Date:</label>
        <input type="date"  name="date">
        </form>

Here is the css code of our app's form input type date,

        
           
        input[type=date] 
        {
        height: 35px;
        margin: 0 auto;
        width: 20%;
        font-size: 1.4rem;
        text-transform: uppercase;
        background-color: #f1e9d8;
        outline: none;
        border: 0;
        border-radius: 3px;
        padding: 0 3px;
        color: #7a8f99 !important;
        border: 1px solid #ccc;
        }