Hiding the progress line in the timeline 4 component

At a glance

A community member is using the Timeline 4 component and is experiencing an issue where the Progress line is overflowing out. They ask the community for help. Another community member provides a read-only link to their project. The original poster receives a detailed response from a community member, who suggests that the project was not started using the Webflow style guide, and provides instructions on how to properly set up the project by cloning the style guide and using the Relume Chrome Extension. The original poster thanks the community member for the troubleshooting, and the community member provides further assistance on how to clone the style guide within the existing project. The original poster confirms that the solution worked.

Useful resources

VVinayak Gupta

Hey team,
I've been using the Timeline 4 component. The Progress line is overflowing out, how to hide it?
Can someone please help.

8 comments

MMatt Johnson

Would you mind sending a read-only link?

VVinayak Gupta

https://preview.webflow.com/preview/research-insights?utm_medium=preview_link&utm_sour[…]s&preview=e099153b7deb5873c55038e0eb038af6&workflow=preview

Here I got it.

VVinayak Gupta

any update on this?

MMatt Johnson

yeah so your project wasn't started using our webflow style guide. So when you added the z-index-2 combo class - it did not have the proper settings to it. The proper settings to z-index-2 are:
position: relative;
z-index: 2;

But there are several other issues at the moment but I don't think they are worth troubleshooting until we get the project itself set up correctly - being that you only have two pages built out right now, I would highly recommend creating a new project starting from cloning the webflow style guide and then you can paste in the sections you already have.

Also make sure to install the Relume Chrome Extension so that you can have class sync turned on. To avoid duplicate classes like padding-global 4 etc.

Lastly, here is a full walkthrough of the process - you can skip around the chapters if you'd like. https://relume.notion.site/Using-the-Relume-Site-Builder-Full-Walk-Through-409e549d44594f0986c7b3453d93a5e4?pvs=4

VVinayak Gupta

Thanks a lot for the troubleshooting. This project is upgraded to CMS Plan, is there any way to make the clone under this project?

VVinayak Gupta

Can you please assist here if possible?

MMatt Johnson

sure, clone the style guide in a new project, navigate to the style guide page in that new project, click on the page-wrapper div and copy it, then paste it into your existing/primary project. You'll at least get all of the classes. You'll still need to clean up the duplicate classes within that project.

VVinayak Gupta

This perfectly worked. Thanks a lot! 🙂

Add a reply

Community forum for knowledge and support

Hiding the progress line in the timeline 4 component