Timeline

Timeline - 1

Aug 19, 1994
Lorem Ipsum is simply dummy text

The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested.
July 01, 2000
Lorem Ipsum is simply dummy text

The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested.
Feb, 2012
Lorem Ipsum is simply dummy text

The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested.
Feb 14, 2013
Lorem Ipsum is simply dummy text

The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested.

                    
                        <ol class="list-timeline-v list-unstyled">
                        <!--timeline-item-->
                        <li data-aos="fade-left">
                            <div class="timeline-icon shadow bg-primary text-white rounded-4">
                                <!--ICON-->
                                <i class="bx bx-dots-vertical-rounded"></i>
                            </div>
                            <!--/.timeline-icon-->
                            <div class="d-block flex-column">
                                <small class="text-muted">Aug 19, 1994</small>
                                <h6 class="mt-2">Lorem Ipsum is simply dummy text</h6>
                                <p class="mb-0">
                                    The standard chunk of Lorem Ipsum used since the 1500s is reproduced below
                                    for
                                    those interested.
                                </p>
                            </div>
                        </li>
                        <!--timeline-item-->
                        <li data-aos="fade-left">
                            <div class="timeline-icon shadow bg-info text-white rounded-4">
                                <!--ICON-->
                                <i class="bx bx-shopping-bag"></i>
                            </div>
                            <!--/.timeline-icon-->
                            <div class="d-block flex-column">
                                <small class="text-muted">July 01, 2000</small>
                                <h6 class="mt-2">Lorem Ipsum is simply dummy text</h6>
                                <p class="mb-0">
                                    The standard chunk of Lorem Ipsum used since the 1500s is reproduced below
                                    for
                                    those interested.
                                </p>
                            </div>
                        </li>
                        <!--timeline-item-->
                        <li data-aos="fade-left">
                            <div class="timeline-icon shadow bg-success text-white rounded-4">
                                <!--ICON-->
                                <i class="bx bx-edit"></i>
                            </div>
                            <!--/.timeline-icon-->
                            <div class="d-block flex-column">
                                <small class="text-muted">Feb, 2012</small>
                                <h6 class="mt-2">Lorem Ipsum is simply dummy text</h6>
                                <p class="mb-0">
                                    The standard chunk of Lorem Ipsum used since the 1500s is reproduced below
                                    for
                                    those interested.
                                </p>
                            </div>
                        </li>
                        <!--timeline-item-->
                        <li data-aos="fade-left">
                            <div class="timeline-icon shadow bg-danger text-white rounded-4">
                                <!--ICON-->
                                <i class="bx bx-envelope"></i>
                            </div>
                            <!--/.timeline-icon-->
                            <div class="d-block flex-column">
                                <small class="text-muted">Feb 14, 2013</small>
                                <h6 class="mt-2">Lorem Ipsum is simply dummy text</h6>
                                <p class="mb-0">
                                    The standard chunk of Lorem Ipsum used since the 1500s is reproduced below
                                    for
                                    those interested.
                                </p>
                            </div>
                        </li>

                    </ol>
                    <!--/.END-timeline-list-->

Timeline - Steps

Scheduled Maintenance!

We're currently updating an issue that's preventing Forms, Meetings and Ads from being modified. All existing forms on websites continue working and accepting submissions.
Updated to bootstrap 5
June 14, 12:24PM EST
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
Minor bug fixes
June 02, 11:24 AM EST
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

                     
                         <!--Steps list-->
                         <ul class="step mx-3 mx-sm-0 list-unstyled mb-0">
    
                             <!--step-item-->
                             <li class="step-item">
                                 <div class="step-row">
                                     <span class="step-icon bg-danger text-white">
                                         <!--Icon-->
                                         <i class="bx bx-cog align-middle lh-1"></i>
                                     </span>
                                     <!--Step content-->
                                     <div class="step-content">
                                         <div class="alert alert-danger d-flex mb-0" role="alert">
                                             <i class="bx bx-exclamation mt-1 me-4 fs-4"></i>
                                             <div class="">
                                                 <h6 class="alert-heading">Scheduled Maintenance!</h6>
                                                 <hr class="my-2">
                                                 <p class="text-body mb-0">We're currently updating an issue that's
                                                     preventing Forms, Meetings and Ads from being modified. All
                                                     existing forms on websites continue working and accepting
                                                     submissions.</p>
                                             </div>
                                         </div>
                                     </div>
                                 </div>
                             </li>

                             <!--step-item-->
                             <li class="step-item">
                                 <div class="step-row">
                                     <span class="step-icon bg-success text-white">
                                         <!--Icon-->
                                         <i class="bx bxl-dribbble align-middle lh-1"></i>
                                     </span>
                                     <!--Step content-->
                                     <div class="step-content">
                                         <h6 class="mb-1">Updated to bootstrap 5</h6>
                                         <small class="d-block mb-2 text-muted">June 14, 12:24PM EST</small>
                                         <p class="mb-0">
                                             Lorem Ipsum is simply dummy text of the printing and typesetting
                                             industry.
                                             Lorem Ipsum has been the industry's standard dummy text ever since the
                                             1500s, when an unknown printer took a galley of type and scrambled it to
                                             make a type specimen book.
                                         </p>
                                     </div>
                                 </div>
                             </li>

                             <!--step-item-->
                             <li class="step-item">
                                 <div class="step-row">
                                     <span class="step-icon bg-primary text-white">
                                         <!--Icon-->
                                         <i class="bx bx-bug align-middle lh-1 fs-6"></i>
                                     </span>
                                     <div class="step-content">
                                         <h6 class="mb-1">Minor bug fixes</h6>
                                         <small class="d-block mb-2 text-muted">June 02, 11:24 AM EST</small>
                                         <p class="mb-0">
                                             Lorem Ipsum is simply dummy text of the printing and typesetting
                                             industry.
                                             Lorem Ipsum has been the industry's standard dummy text ever since the
                                             1500s, when an unknown printer took a galley of type and scrambled it to
                                             make a type specimen book.
                                         </p>
                                     </div>
                                 </div>
                             </li>
                         </ul>
                         <!--End Steps list-->

Timeline History

At Present

2022

Whole new look with bootstrap5

Lorem ipsum is text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

May

2020

Finished 5000 Sales

Lorem ipsum is text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

June

2018

Convert into Bootstrap 4

Lorem ipsum is text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

July

2016

Finished 2000 Sales

Lorem ipsum is text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

August

2014

Launched Assan Theme

Lorem ipsum is text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

                    
                        <!--History swiper slider-->
                        <div class="swiper-history swiper-container overflow-visible">
                            <!--Slider wrapper-->
                            <div class="swiper-wrapper">
                                <!--Slide-->
                                <div class="swiper-slide">
                                    <div>
                                        <div class="pe-5 pb-3 pe-lg-7">
                                            <!--Time-->
                                            <p class="text-muted">At Present</p>
                                            <!--Year-->
                                            <h2 class="text-primary display-5">2022</h2>
                                        </div>
                                        <!--Divider line-->
                                        <div class="swiper-divider-line bg-primary position-relative w-100 my-4"></div>
                                        <!--Text-->
                                        <div class="pe-7 pt-3 pe-lg-7">
                                            <h5>Whole new look with bootstrap5</h5>
                                            <p>Lorem ipsum is text commonly used in the graphic, print, and publishing
                                                industries for previewing layouts and visual mockups.</p>
                                        </div>
                                    </div>
                                </div>
                                <!--Slide-->
                                <div class="swiper-slide">
                                    <div>
                                        <div class="pe-5 pb-3 pe-lg-7">
                                            <!--Time-->
                                            <p class="text-muted">May</p>
                                            <!--Year-->
                                            <h2 class="text-primary text-opacity-75 display-5">2020</h2>
                                        </div>
                                        <!--Divider line-->
                                        <div class="swiper-divider-line bg-primary bg-opacity-75 position-relative w-100 my-4"></div>
                                        <!--Text-->
                                        <div class="pe-7 pt-3 pe-lg-7">
                                            <h5>Finished 5000 Sales</h5>
                                            <p>Lorem ipsum is text commonly used in the graphic, print, and publishing
                                                industries for previewing layouts and visual mockups.</p>
                                        </div>
                                    </div>
                                </div>
                                <!--Slide-->
                                <div class="swiper-slide">
                                    <div>
                                        <div class="pe-5 pb-3 pe-lg-7">
                                            <!--Time-->
                                            <p class="text-muted">June</p>
                                            <!--Year-->
                                            <h2 class="text-primary text-opacity-75 display-5">2018</h2>
                                        </div>
                                        <!--Divider line-->
                                        <div class="swiper-divider-line bg-primary bg-opacity-50 position-relative w-100 my-4"></div>
                                        <!--Text-->
                                        <div class="pe-7 pt-3 pe-lg-7">
                                            <h5>Convert into Bootstrap 4</h5>
                                            <p>Lorem ipsum is text commonly used in the graphic, print, and publishing
                                                industries for previewing layouts and visual mockups.</p>
                                        </div>
                                    </div>
                                </div>
                                <!--Slide-->
                                <div class="swiper-slide">
                                    <div>
                                        <div class="pe-5 pb-3 pe-lg-7">
                                            <!--Time-->
                                            <p class="text-muted">July</p>
                                            <!--Year-->
                                            <h2 class="text-primary text-opacity-50 display-5">2016</h2>
                                        </div>
                                        <!--Divider line-->
                                        <div class="swiper-divider-line bg-primary bg-opacity-25 position-relative w-100 my-4"></div>
                                        <!--Text-->
                                        <div class="pe-7 pt-3 pe-lg-7">
                                            <h5>Finished 2000 Sales</h5>
                                            <p>Lorem ipsum is text commonly used in the graphic, print, and publishing
                                                industries for previewing layouts and visual mockups.</p>
                                        </div>
                                    </div>
                                </div>
                                <!--Slide-->
                                <div class="swiper-slide">
                                    <div>
                                        <div class="pe-5 pb-3 pe-lg-7">
                                            <!--Time-->
                                            <p class="text-muted">August</p>
                                            <!--Year-->
                                            <h2 class="text-primary text-opacity-25 display-5">2014</h2>
                                        </div>
                                        <!--Divider line-->
                                        <div class="swiper-divider-line position-relative w-100 my-4"></div>
                                        <!--Text-->
                                        <div class="pe-7 pt-3 pe-lg-7">
                                            <h5>Launched Assan Theme</h5>
                                            <p>Lorem ipsum is text commonly used in the graphic, print, and publishing
                                                industries for previewing layouts and visual mockups.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    
                    <!--swiper-slider CSS-->
                    <link href="assets/vendor/node_modules/css/swiper-bundle.min.css" rel="stylesheet">

                    
                        <!--swiper-slider Script-->
                        <script src="assets/vendor/node_modules/js/swiper-bundle.min.js"></script>
                        <script>
                            // init Swiper:
                            const swiper = new Swiper('.swiper-history', {
                                slidesPerView: 1,
                                spaceBetween: 0,
                                autoHeight: true,
                                breakpoints: {
                                    // when window width is >= 480px
                                    768: {
                                        slidesPerView: 2,
                                        spaceBetween: 0
                                    },
                                    // when window width is >= 640px
                                    1024: {
                                        slidesPerView: 3,
                                    }
                                }
                            });
                        </script>

Let's start building stunning websites

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.

Purchase a license

Ultimate modern design toolkit

Headers Styles 25+

Hero Covers Slider

Layouts

Theme styles

Timeline

Timeline - 1

Lorem Ipsum is simply dummy text

Lorem Ipsum is simply dummy text

Lorem Ipsum is simply dummy text

Lorem Ipsum is simply dummy text

Timeline - Steps

Scheduled Maintenance!

Updated to bootstrap 5

Minor bug fixes

Timeline History

2022

Whole new look with bootstrap5

2020

Finished 5000 Sales

2018

Convert into Bootstrap 4

2016

Finished 2000 Sales

2014

Launched Assan Theme

Let's start building stunning websites