Buttons

Bootstrap buttons, FleetPro actions, sizes, states and button groups

Buttons System

Buttons are used for actions, navigation, confirmations, filters and toolbar controls. FleetPro uses Bootstrap buttons with custom spacing, rounded corners and dashboard-friendly visual states.

Bootstrap Buttons Actions & States

Default Buttons

Standard Bootstrap button variants

<button type="button" class="btn btn-primary">Primary</button>

Outline Buttons

Lightweight buttons for secondary actions

<button type="button" class="btn btn-outline-primary">Primary</button>

FleetPro Action Buttons

Buttons commonly used across FleetPro business pages

<button class="btn btn-primary"><i class="bi bi-plus-lg me-1"></i> New Booking</button>

Button Sizes

Large, default and small buttons

<button class="btn btn-primary btn-sm">Small Button</button>

Icon Buttons

Compact buttons for table actions and toolbars


Vehicle Status Actions
BMW X5 AA-123-BB Available
<button class="btn btn-sm btn-light"><i class="bi bi-eye"></i></button>

Button Groups

Grouped actions and segmented controls

Default group

Outline group

Toolbar group

<div class="btn-group">...</div>

Block Buttons

Full-width buttons for sidebars and summary panels

<div class="d-grid"><button class="btn btn-primary">Create Booking</button></div>

Disabled & Loading States

Button states for unavailable or processing actions

<button class="btn btn-primary" disabled>Saving...</button>