Open
Description
Describe the bug
I want to remove the control bar at the top of the Chrono component.
So I searched the API and used the hideControls
property, but it does not disappear.
To Reproduce
Steps to reproduce the behavior:
import { Chrono } from 'react-chrono';
const Timeline = () => {
const items = [
{
title: 'January 2022',
cardTitle: 'Event 1',
cardSubtitle: 'Event 1 Subtitle',
cardDetailedText: [
'This is the first event on the timeline.',
'And so on..',
],
},
];
return (
<div className="w-full">
<Chrono
items={items.map((item) => ({
...item,
cardDetailedText: item.cardDetailedText.map((text, index) => (
<span key={index} className="text-sm">
{text}
</span>
)),
}))}
mode="VERTICAL"
hideControls
theme={{ primary: '#4B5563', secondary: '#D1D5DB' }}
/>
</div>
);
};
export default Timeline;
As in the code above, I used the hideControls
property properly. But it doesn't go away.
Expected behavior
If used, it will be a really simple and convenient component.
Desktop (please complete the following information):
- OS - Windows
- Browser - Chrome, Edge
- Version - most recent version
Additional context
It is being developed using React.tsx and is being developed as a mobile first screen. Is this by any chance a problem?
hideControls="true"
, hideControls={true}
I tried both of the above but they didn't work.