Section Components Usage Guide

The Section components create 2-column layouts with text content and images. SectionWithBullets adds bullet points below paragraphs.

Properties:

  • title: string (required) - Main heading text
  • paragraphs: Record<string, string> (required) - Multiple paragraphs with keys like p1, p2, p3...
  • badge: string (optional) - Badge text above the title
  • reverse: boolean (optional) - Reverse column order. Default: false
  • justifyContent: 'start' | 'center' (optional) - Content alignment. Default: 'start'
  • bulletPoints: string[] (optional) - Array of bullet point text (SectionWithBullets only)
  • iconItems: Array of icon objects (optional) - Each item has icon class and text (SectionWithIcons only)
  • buttons: object (optional) - Primary and/or secondary buttons
  • image: object (required) - Image with src, alt, size, and position options

Image Options:

  • size: 'video' (16:9) | 'square' (1:1) | 'full' (default)
  • position: 'top' (default) | 'middle'

Examples Below:

  • Section 1: Basic with badge and buttons
  • Section 2: Reversed layout, centered content, square image
  • Section 3: Video aspect ratio image
  • Section 4: Reversed layout with square image
  • Section 5: With bullet points (SectionWithBullets)
  • Section 6: Reversed with numbered list and video image
  • Section 7: With icons (SectionWithIcons)

Section 1

Feature

Your Title Goes Here 1

A short description of your company or your services that is around 24 words long. Vestibulum at odio sit amet lectus hendrerit auctor vel et ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

You can add more paragraphs here to provide additional context or information about your services.

You can add more paragraphs here to provide additional context or information about your services.

You can add more paragraphs here to provide additional context or information about your services.

managed it services transportation logistics

Section 2

Your Title Goes Here 2

A short description of your company or your services that is around 24 words long. Vestibulum at odio sit amet lectus hendrerit auctor vel et ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

This section demonstrates the reversed layout with image on the left and text on the right.

managed it services transportation logistics

Section 3

Your Title Goes Here 3

A short description of your company or your services that is around 24 words long. Vestibulum at odio sit amet lectus hendrerit auctor vel et ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

This section demonstrates the reversed layout with image on the left and text on the right.

managed it services transportation logistics

Section 4

Your Title Goes Here 4

A short description of your company or your services that is around 24 words long. Vestibulum at odio sit amet lectus hendrerit auctor vel et ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

This section demonstrates the reversed layout with image on the left and text on the right.

managed it services transportation logistics

Section 5 - With Bullets

Features

Your Title Goes Here 5

A short description of your company or your services that is around 24 words long. Vestibulum at odio sit amet lectus hendrerit auctor vel et ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

This section demonstrates the SectionWithBullets component with bullet points below the paragraphs.

  • Easy to use and customize
  • Responsive design for all devices
  • Built with modern web technologies
  • Accessible and SEO friendly
managed it services transportation logistics

Section 6 - With Numbers

Enterprise Integration Solutions

Connect your business systems seamlessly with our enterprise integration platform. We bridge the gap between legacy applications and modern cloud services.

  • API-first architecture design
  • Real-time data synchronization
  • Multi-platform compatibility
  • Scalable microservices framework
managed it services transportation logistics

Section 7 - With Icons

Solutions

Comprehensive IT Services for Modern Businesses

We provide end-to-end IT solutions that help businesses streamline operations, enhance security, and drive digital transformation.

Our expert team ensures seamless implementation and ongoing support for all your technology needs.

Fleet management and logistics optimization solutions
Warehouse automation and inventory management systems
Advanced analytics and business intelligence tools
Comprehensive cybersecurity and compliance management
managed it services transportation logistics

Section 8 - With Cards

Process

Our Work Process

Here is how we approach every project to ensure the best results.

Our systematic approach ensures quality and efficiency in every job.

1. Initial Consultation

We discuss your needs and provide a detailed estimate

2. Planning & Scheduling

We plan the work and schedule it at your convenience

3. Quality Execution

Our skilled team completes the work to the highest standards

4. Final Inspection

We ensure everything meets your expectations before finishing

Our work process

Section 9 - With Features

Benefits

Customer Benefits

Experience the benefits of choosing our handyman services.

We focus on delivering value and satisfaction to every customer.

Time Saving

Get your repairs done quickly and efficiently.

Cost Effective

Competitive rates with no hidden fees.

Reliable Service

On-time service you can count on.

Expert Knowledge

Years of experience in multiple trades.

Customer benefits

Section 10 - With Carousel

Section 9 - With Features