Profile Modern Basic Images

Profile

History

Today

Laurie Fox

5 sec

Trending Style

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Justin Cross

45 min

Nature Photography

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

timeline timeline timeline

Sonia Shaw

2 hr

Create new Project

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

timeline timeline timeline timeline timeline 
<div class="timeline-simple">
    <p class="timeline-title">History</p>

    <div class="timeline-list">
        <p class="meta-update-day">Today</p>
        
        <div class="timeline-post-content">
            <div class="user-profile">
                <img src="assets/img/profile-11.jpeg" class="">
            </div>
            <div class="">
                <h4>Laurie Fox</h4>
                <p class="meta-time-date">5 sec</p>
                <div class="">
                    <svg> ... </svg>
                    <h6 class="">Trending Style</h6>
                    <p class="post-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                    consequat.</p>
                    <div class="post-contributers">
                        <img src="assets/img/profile-25.jpeg" class="">
                        <img src="assets/img/profile-15.jpeg" class="">
                        <img src="assets/img/profile-8.jpeg" class="">
                        <img src="assets/img/profile-10.jpeg" class="">
                        <img src="assets/img/profile-12.jpeg" class="">
                    </div>
                </div>
            </div>
        </div>

        <div class="timeline-post-content post-gallery">
            <div class="user-profile">
                <img src="assets/img/profile-7.jpeg" class="">
            </div>
            <div class="">
                <h4>Justin Cross</h4>
                <p class="meta-time-date">45 min</p>
                <div class="">
                    <svg> ... </svg>
                    <h6 class="">Nature Photography</h6>
                    <p class="post-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                    consequat.</p>
                    <div class="post-gallery-img">
                        <img src="assets/img/grid-blog-style-2.jpeg" class="">
                        <img src="assets/img/grid-blog-style-1.jpg" class="">
                        <img src="assets/img/list-blog-style-2.jpeg" class="">
                    </div>
                </div>
            </div>
        </div>

        <div class="timeline-post-content">
            <div class="user-profile">
                <img src="assets/img/profile-25.jpeg" class="">
            </div>
            <div class="">
                <h4>Sonia Shaw</h4>
                <p class="meta-time-date">2 hr</p>
                <div class="">
                    <svg> ... </svg>
                    <h6 class="">Create new Project</h6>
                    <p class="post-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                    consequat.</p>
                    <div class="post-contributers">
                        <img src="assets/img/profile-6.jpeg" class="">
                        <img src="assets/img/profile-16.jpeg" class="">
                        <img src="assets/img/profile-11.jpeg" class="">
                        <img src="assets/img/profile-7.jpeg" class="">
                        <img src="assets/img/profile-10.jpeg" class="">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Modern

  • timeline

    Front-End Framework

    Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.

    Read more

  • timeline

    Web Development

    Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.

    Read more

  • timeline

    Theme Development

    Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.

    Read more

  • timeline

    Plugin Development

    Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.

    Read more

<div class="container mt-container">
    <ul class="modern-timeline pl-0">
        <li>
            <div class="modern-timeline-badge"></div>
            <div class="modern-timeline-panel">
                <div class="modern-timeline-preview"><img src="assets/img/tl-5.jpeg" alt="timeline"></div>
                <div class="modern-timeline-body">
                    <h4 class="mb-4">Front-End Framework</h4>
                    <p class="mb-4">Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.</p>
                    <p><a href="javascript:void(0);" class="btn btn-outline-primary mt-2">Read more</a></p>
                </div>
            </div>
        </li>
        <li>
            <div class="modern-timeline-badge"></div>
            <div class="modern-timeline-panel">
                <div class="modern-timeline-preview"><img src="assets/img/tl-2.jpeg" alt="timeline"></div>
                <div class="modern-timeline-body">
                    <h4 class="mb-4">Web Development</h4>
                    <p class="mb-4">Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.</p>
                    <p><a href="javascript:void(0);" class="btn btn-outline-primary mt-2">Read more</a></p>
                </div>
            </div>
        </li>
        <li>
            <div class="modern-timeline-badge"></div>
            <div class="modern-timeline-panel">
                <div class="modern-timeline-preview"><img src="assets/img/tl-3.jpeg" alt="timeline"></div>
                <div class="modern-timeline-body">
                    <h4 class="mb-4">Theme Development</h4>
                    <p class="mb-4">Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.</p>
                    <p><a href="javascript:void(0);" class="btn btn-outline-primary mt-2">Read more</a></p>
                </div>
            </div>
        </li>
        <li>
            <div class="modern-timeline-badge"></div>
            <div class="modern-timeline-panel">
                <div class="modern-timeline-preview"><img src="assets/img/tl-4.jpeg" alt="timeline"></div>
                <div class="modern-timeline-body">
                    <h4 class="mb-4">Plugin Development</h4>
                    <p class="mb-4">Map where your photos were taken and discover local points of interest. Map where your photos. Map where your photos were taken and discover.</p>
                    <p><a href="javascript:void(0);" class="btn btn-outline-primary mt-2">Read more</a></p>
                </div>
            </div>
        </li>
        <li class="position-static">
            <div class="modern-timeline-top"></div>
        </li>
        <li class="position-static">
            <div class="modern-timeline-bottom"></div>
        </li>
    </ul>
</div>

Basic

10:00

Updated Server Logs

25 mins ago

12:45

Backup Files EOD

2 hrs ago

14:00

Send Mail to HR and Admin

4 hrs ago

16:00

Conference call with Marketing Manager.

6 hrs ago

17:00

Collected documents from Sara

9 hrs ago

16:00

Server rebooted successfully

8 hrs ago

<div class="mt-container mx-auto">
    <div class="timeline-line">
        
        <div class="item-timeline">
            <p class="t-time">10:00</p>
            <div class="t-dot t-dot-primary">
            </div>
            <div class="t-text">
                <p>Updated Server Logs</p>
                <p class="t-meta-time">25 mins ago</p>
            </div>
        </div>

        <div class="item-timeline">
            <p class="t-time">12:45</p>
            <div class="t-dot t-dot-success">
            </div>
            <div class="t-text">
                <p>Backup Files EOD</p>
                <p class="t-meta-time">2 hrs ago</p>
            </div>
        </div>

        <div class="item-timeline">
            <p class="t-time">14:00</p>
            <div class="t-dot t-dot-warning">
            </div>
            <div class="t-text">
                <p>Send Mail to HR and Admin</p>
                <p class="t-meta-time">4 hrs ago</p>
            </div>
        </div>

        <div class="item-timeline">
            <p class="t-time">16:00</p>
            <div class="t-dot t-dot-info">
            </div>
            <div class="t-text">
                <p>Conference call with Marketing Manager.</p>
                <p class="t-meta-time">6 hrs ago</p>
            </div>
        </div>

        <div class="item-timeline">
            <p class="t-time">17:00</p>
            <div class="t-dot t-dot-danger">
            </div>
            <div class="t-text">
                <p>Collected documents from <a href="javascript:void(0);">Sara</a></p>
                <p class="t-meta-time">9 hrs ago</p>
            </div>
        </div>

        <div class="item-timeline">
            <p class="t-time">16:00</p>
            <div class="t-dot t-dot-dark">
            </div>
            <div class="t-text">
                <p>Server rebooted successfully</p>
                <p class="t-meta-time">8 hrs ago</p>
            </div>
        </div>

    </div>                                    
</div>

With Images

09:00

avatar

25 mins ago

Conference call with Marketing Manager.

10:00

L

2 hrs ago

Server rebooted successfully

11:00

avatar

4 hrs ago

Backup Files EOD

12:00

avatar

6 hrs ago

Collected documents from Sara

14:00

G

9 hrs ago

PDF file Download

<div class="mt-container mx-auto">
    <div class="timeline-alter">
        
        <div class="item-timeline">
            <div class="t-time">
                <p class="">09:00</p>
            </div>
            <div class="t-img">
                <img src="assets/img/profile-20.jpeg">
            </div>
            <div class="t-meta-time">
                <p class="">25 mins ago</p>
            </div>
            
            <div class="t-text">
                <p>Conference call with Marketing Manager.</p>
            </div>
        </div>

        <div class="item-timeline">
            <div class="t-time">
                <p class="">10:00</p>
            </div>
            <div class="t-usr-txt">
                <p><span>L</span></p>
            </div>
            <div class="t-meta-time">
                <p class="">2 hrs ago</p>
            </div>
            
            <div class="t-text">
                <p>Server rebooted successfully</p>
            </div>
        </div>

        <div class="item-timeline">
            <div class="t-time">
                <p class="">11:00</p>
            </div>
            <div class="t-img">
                <img src="assets/img/profile-6.jpeg">
            </div>
            <div class="t-meta-time">
                <p class="">4 hrs ago</p>
            </div>
            
            <div class="t-text">
                <p>Backup Files EOD</p>
            </div>
        </div>

        <div class="item-timeline">
            <div class="t-time">
                <p class="">12:00</p>
            </div>
            <div class="t-img">
                <img src="assets/img/profile-11.jpeg">
            </div>
            <div class="t-meta-time">
                <p class="">6 hrs ago</p>
            </div>
            
            <div class="t-text">
                <p>Collected documents from <a href="javascript:void(0);">Sara</a></p>
            </div>
        </div>

        <div class="item-timeline">
            <div class="t-time">
                <p class="">14:00</p>
            </div>
            <div class="t-usr-txt">
                <p><span>G</span></p>
            </div>
            <div class="t-meta-time">
                <p class="">9 hrs ago</p>
            </div>
            
            <div class="t-text">
                <p>PDF file Download</p>
            </div>
        </div>

    </div>
</div>

Copyright © 2021 DesignReset, All rights reserved.

Coded with