Drupal Radix Theme
  • Introduction
    • Overview & Support
  • Installation
    • Requirements
    • Getting Started
    • Setup with ddev
  • Understanding Radix
    • Individual files and directories
    • Bootstrap Build
    • Bootswatch
  • Working with the components
    • Components: Intro
    • Components: A deep dive
    • An example component
    • The drupal-radix-cli
    • Copy and modify a component
  • Components
    • Accordion
    • Alerts
    • Badge
    • Block
    • Buttons
    • Button Group
    • Breadcrumb
    • Card
    • Carousel
    • Close button
    • Comment
    • Collapse
    • Details
    • Dropdown menu
    • Field
    • Field Comment
    • Fieldset
    • Figure
    • Form
    • Form: Element
    • Form Element Label
    • Form Element: Radio Checkbox
    • Heading
    • HTML
    • Image
    • Input
    • List group
    • Local Tasks
    • Media
    • Modal
    • Nav
    • Nav Item
    • Navbar
    • Navbar Brand
    • Node
    • Offcanvas
    • Page
    • Page: Content
    • Page: Footer
    • Page: Navigation
    • Page: Title
    • Pagination
    • Progress
    • Radios
    • Region
    • Select
    • Spinners
    • Table
    • Taxonomy
    • Textarea
    • Toasts
    • Tooltips
    • User
    • Views: view
    • Views: view--grid
    • Views: view--table
    • Views: view--unformatted
  • Misc
    • Migration and upgrading
    • Roadmap
    • Credits & Contributions
Powered by GitBook
On this page
  • Key Features
  • Customization Options
  • Example Usage

Was this helpful?

  1. Components

Nav

Documentation and examples for how to use Bootstrap’s included navigation components.

PreviousModalNextNav Item

Last updated 10 months ago

Was this helpful?

Key Features

  • Flexible Alignment: Supports multiple alignment options including left, right, center, and vertical.

  • Style Variations: Offers styles such as tabs and pills for different visual appearances.

  • Fill Options: Includes fill and justify options to control the distribution of navigation items.

  • Utility Class Integration: Allows for the addition of custom utility classes for further customization.

Customization Options

  • Alignment Classes: Adjust the alignment of the nav items based on the provided configuration.

  • Style and Fill: Customize the nav's appearance by choosing between tabs or pills styles and fill options.

  • Utility Classes: Apply additional utility classes to enhance or modify the styling and functionality of the nav component.

Example Usage

{% include 'radix:nav' with {
  alignment: 'right',
  style: 'pills',
  fill: 'justify',
  items: links,
  container: 'fixed',
  color: 'light',
  navbar_utility_classes: ['bg-light'],
  nav_link_utility_classes: ['text-dark'],
  nav_item_utility_classes: ['px-2'],
} %}
Bootstrap docs