→ Asmath
→ Minimal Changelog Page Template design

Minimal Changelog Page Template design

This bootstrap css example is contributed by Asmath, on 26-Dec-2024. Component is made with bootstrap css v.5.3. It is responsive.

Tags: Other

Author Asmath

v.5.3

Fork Fullscreen

<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-lg-8">
            <h1 class="fw-light mb-5 text-center">Changelog</h1>

<div class="mb-5">
                <div class="d-flex align-items-baseline mb-4">
                    <h2 class="version-tag me-3">2.0.0</h2>
                    <span class="changelog-date">December 26, 2024</span>
                </div>

<div class="bg-white shadow-sm rounded">
                    <div class="changelog-entry position-relative p-4">
                        <div class="change-type added"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Added</h6>
                            <p class="text-muted mb-0">Real-time analytics dashboard with improved performance metrics
                            </p>
                        </div>
                    </div>

<div class="changelog-entry position-relative p-4">
                        <div class="change-type fixed"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Fixed</h6>
                            <p class="text-muted mb-0">Database query optimization for faster response times</p>
                        </div>
                    </div>

<div class="changelog-entry position-relative p-4">
                        <div class="change-type updated"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Updated</h6>
                            <p class="text-muted mb-0">Modernized UI components following new design system</p>
                        </div>
                    </div>
                </div>
            </div>

<div class="mb-5">
                <div class="d-flex align-items-baseline mb-4">
                    <h2 class="version-tag me-3">1.9.0</h2>
                    <span class="changelog-date">December 15, 2024</span>
                </div>

<div class="bg-white shadow-sm rounded">
                    <div class="changelog-entry position-relative p-4">
                        <div class="change-type added"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Added</h6>
                            <p class="text-muted mb-0">Two-factor authentication implementation</p>
                        </div>
                    </div>

<div class="changelog-entry position-relative p-4">
                        <div class="change-type updated"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Updated</h6>
                            <p class="text-muted mb-0">Enhanced security protocols and password requirements</p>
                        </div>
                    </div>
                </div>
            </div>

<div>
                <div class="d-flex align-items-baseline mb-4">
                    <h2 class="version-tag me-3">1.8.5</h2>
                    <span class="changelog-date">December 1, 2024</span>
                </div>

<div class="bg-white shadow-sm rounded">
                    <div class="changelog-entry position-relative p-4">
                        <div class="change-type fixed"></div>
                        <div class="ms-3">
                            <h6 class="fw-bold mb-3">Fixed</h6>
                            <p class="text-muted mb-0">Performance optimizations and bug fixes</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

More Examples

Invoice template with bootstrap

Author:
Anonymous

5 months ago

249

v.4.6
Credit Card Clone
On hover shows backside of credit card

Author:
Ankit khedkar

5 months ago

305

v.5.3
Interactive Kanban Task Board

Author:
Anonymous

3 months ago

1.4k

v.5.3
Privacy policy template with boostrap 5

Author:
Anonymous

1 day ago

15

v.5.3
Bootstrap 5 chat template

Author:
Andreas Müller

5 months ago

439

v.5.3
Background image with bootstrap 4
Bootstrap 4 background image

Author:
Anonymous

2 weeks ago

65

v.4.6
Parallax effect with image background

Author:
Anonymous

2 weeks ago

90

v.4.6
Responsive video container

Author:
Anonymous

5 months ago

256

v.4.6
Interactive Quiz Application
1. Dynamic Question Loading: Questions are loaded one at a time from a predefined set. 2. Timer: Each question has a 30-second time limit. Interactive Options: Users can select their answer, with visual feedback for correct and incorrect choices. 3. Progress Bar: Shows the user's progress through the quiz. 4. Results Summary: Displays the final score with a congratulatory or encouraging message. 5. Responsive Design: The quiz adapts to different screen sizes.

Author:
Ross Wille

3 months ago

693

v.5.3
Credit cards bootstrap 5
credit cards design made with Bootstrap 5

Author:
Ankit khedkar

5 months ago

465

v.5.3
Changelog page template

Author:
Asmath

15 hours ago

20

v.5.3
Product Card
A product card layout for an e-commerce website with an image at the top

Author:
Juan Martinez

5 months ago

712

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent