VOOZH about

URL: https://www.geeksforgeeks.org/css/blaze-ui-timelines-loading-last-item/

⇱ Blaze UI Timelines Loading last Item - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

Blaze UI Timelines Loading last Item

Last Updated : 23 Jul, 2025

Blaze UI is a free open source UI Toolkit that provides a great structure for building websites quickly with a scalable and maintainable foundation. All components in Blaze UI are developed mobile-first and rely solely on native browser features, not a separate library or framework. It helps us to create a scalable and responsive website fast and efficiently with a consistent style.

Blaze UI Timelines are used to illustrate the events that occurred according to their terminology or what should be planned to happen. Blaze UI Timelines Loading last item is used to create the timeline by loading the last item using the c-timeline-item--loading class. 

Blaze UI Timelines Loading last item Classes:

  • o-timeline: This class is used to create the timeline.
  • c-timeline-item: This class is used to create the timeline item.
  • c-timeline-item__body: This class is used to create the timeline body.
  • c-timeline-item--last: This class is used to create the last timeline item.
  • o-timeline--loading: This class is used to create the loading timeline.
  • c-timeline-item--loading: This class is used to create the last item with a loading state.

Syntax:

<ul class="o-timeline">
 <li class="c-timeline-item 
 c-timeline-item--loading">
 <div class="c-timeline-item__body">
 ...
 </div>
 </li>
 ...
</ul>

Example 1: Below example demonstrates the Blaze UI Timelines Loading last item.


Output:

👁 Image
Blaze UI Timelines Loading last item

Example 2: Below example demonstrates the Blaze UI Timelines Loading last item.


Output:

👁 Image
Blaze UI Timelines Loading last item

Reference: https://www.blazeui.com/components/timelines/

Comment