Black Lives Matter. Please consider donating to Black Girls Code today.

Change appearance of dcc.DatePickerSingle

I am trying to include a DatePickerSingle component in a dbc.Form. However, the look does not match the appearance of the other components:


I would like the date picker field to have a similar look as the dropdown below (Select Time) with respect to size (font + box) and rounded cornders. I tried setting the style attribute of of the dcc.DatePickerSingle to style={"border-radius": "3px"}, but it had no effect. Any Ideas how I can achieve this?

below is my code for the form (which is marked in red in the screenshot above):

import dash_bootstrap_components as dbc
import dash_core_components as dcc
from datetime import date

# "Create New Event"-Form
date_and_time = dbc.FormGroup([
        dbc.Label("Date", html_for="dropdown"),
            min_date_allowed=date(1995, 8, 5),
            max_date_allowed=date(2017, 9, 19),
            initial_visible_month=date(2017, 8, 5),
            date=date(2017, 8, 25),
            style={"border-radius": "3px"}
    ], width=6),
        dbc.Label("Time", html_for="dropdown"),
                {"label": "Option 1", "value": 1},
                {"label": "Option 2", "value": 2},
    ], width=6),

slider = dbc.FormGroup(
        dbc.Label("Slider", html_for="slider"),
        dcc.Slider(id="slider", min=0, max=10, step=0.5, value=3),

range_slider = dbc.FormGroup(
        dbc.Label("RangeSlider", html_for="range-slider"),
        dcc.RangeSlider(id="range-slider", min=0, max=10, value=[3, 7]),

create_new_event_form = dbc.Form([date_and_time, slider, range_slider])