Hello Everyone,
Does anyone know how one can can highlight the image hover or on clicking it to let the user know something happened.
I have attached the code below .
Is their a way to do it without using callback ? or only by usign the style tag ?
dbc.Col([
dbc.Card(
[
dbc.CardHeader(
[
html.H6("Tickets This Month", className="mb-0",
style={'font-size': '12px'}),
html.Img(
src='assets/download.png',
height='15px',
width='15px',
id='download_month_ticket',
style={'background': 'none', 'cursor': 'pointer'},
className="border-0 d-flex justify-content-between align-items-center",
),
html.Div(
[
dbc.Spinner(
dcc.Download(
id='download_month_ticket_data'
),
size='sm',
spinner_style={'min-height': '1.3rem', 'min-width': '1.3rem'},
)
],
className="border-0 d-flex justify-content-between align-items-center"
)
],
className="border-0 d-flex justify-content-between align-items-center"
),
dbc.CardBody(
[
html.Img(src='assets/tickets.png',
style={'height': '24px', 'width': '24px',
'margin-right': '10px'},
alt='icon', className='img-fluid'),
html.H3("25", className="card-title"),
],
className="border-0 d-flex align-items-center"
),
],
style={"height": "auto", "border-radius": "10px",
"background-color": "#CDCDCD",
"box-shadow": "1px 2px 7px 0px grey"},
className="border-0"
),
]),