### Install neoteroi-mkdocs

Source: https://github.com/neoteroi/mkdocs-plugins/blob/main/README.md

Use this command to install the neoteroi-mkdocs package.

```bash
pip install neoteroi-mkdocs
```

--------------------------------

### Gantt Chart with Phases and Activities

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Defines a project timeline with nested phases and activities, specifying start dates and durations. Use this for detailed project planning.

```markdown
<!-- Project plan with phases and activities -->
::gantt:: id="project-timeline"

- title: Definition Phase
  activities:
    - title: Requirements Gathering
      start: 2024-03-01
      lasts: 1 week
    - title: Technical Design
      start: 2024-03-08
      lasts: 2 weeks
    - title: Architecture Review
      start: 2024-03-22
      lasts: 3 days

- title: Development Phase
  activities:
    - title: Backend Development
      start: 2024-03-25
      lasts: 4 weeks
    - title: Frontend Development
      start: 2024-04-01
      lasts: 3 weeks
    - title: Integration
      start: 2024-04-22
      lasts: 1 week

- title: Testing Phase
  activities:
    - title: Unit Testing
      start: 2024-04-29
      lasts: 2 weeks
    - title: UAT
      start: 2024-05-13
      lasts: 1 week

::/gantt::
```

--------------------------------

### Compile Sass to CSS

Source: https://github.com/neoteroi/mkdocs-plugins/blob/main/styles/README.md

Use this command to compile Sass files into compressed CSS. Ensure Sass is installed and accessible in your PATH.

```bash
sass --no-source-map --style compressed styles/all.scss ~/projects/github/mkdocs-plugins-docs/docs/css/neoteroi.css
```

--------------------------------

### Configure OpenAPI Documentation Plugin

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Set up the mkdocsoad plugin in your configuration file.

```yaml
# mkdocs.yml configuration
plugins:
  - neoteroi.mkdocsoad:
      use_pymdownx: true  # Use PyMdown Extensions styling
      templates_path: ./custom-templates  # Optional custom templates
```

--------------------------------

### Configure MkDocs Plugins and Extensions

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Register the plugins and markdown extensions in your mkdocs.yml file.

```yaml
# mkdocs.yml
plugins:
  - neoteroi.mkdocsoad
  - neoteroi.contribs

markdown_extensions:
  - neoteroi.cards
  - neoteroi.timeline
  - neoteroi.projects
  - neoteroi.spantable
```

--------------------------------

### Create Responsive Card Grids

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Display content in cards using YAML/JSON data or external files.

```markdown
<!-- Basic cards with images -->
::cards:: cols=3 image-tags

- title: Getting Started
  url: /docs/getting-started
  content: Learn the basics of our platform.
  image: /img/icons/start.png

- title: API Reference
  url: /docs/api
  content: Complete API documentation.
  image: /img/icons/api.png

- title: Examples
  url: /docs/examples
  content: Real-world usage examples.
  image: /img/icons/examples.png

::/cards::

<!-- Cards with Font Awesome icons -->
::cards::

- title: Authentication
  url: /docs/auth
  content: Secure your application.
  icon: "fa-solid fa-lock"

- title: Database
  url: /docs/database
  content: Data storage solutions.
  icon: "fa-solid fa-database"

- title: Monitoring
  url: /docs/monitoring
  content: Track application health.
  icon: ":octicons-graph-16:"

::/cards::

<!-- Cards with custom styling and blank target -->
::cards:: cols=4 blank_target

- title: External Resource
  url: https://example.com
  content: Opens in new tab.
  image: /img/external.png
  key: highlighted

::/cards::

<!-- Cards from external JSON file -->
[cards(./data/features.json)]
```

--------------------------------

### Enable Plugin via Environment Variable

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Set the environment variable to toggle plugin functionality before running the build command.

```bash
# Enable plugin via environment variable
export ENABLE_CONTRIBS=true
mkdocs build
```

--------------------------------

### Gantt Chart with Milestones and Events

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Creates a Gantt chart that includes key milestones and events alongside development activities. Useful for release planning and tracking significant project points.

```markdown
<!-- Gantt with milestones/events -->
::gantt:: id="release-plan"

- title: Milestones
  events:
    - title: Kick-off Meeting
      time: 2024-01-15
      icon: ":octicons-rocket-16:"
    - title: Alpha Release
      time: 2024-03-01
      icon: ":octicons-tag-16:"
    - title: Beta Release
      time: 2024-04-15
      icon: ":octicons-tag-16:"
    - title: Production Launch
      time: 2024-06-01
      icon: ":octicons-sun-16:"

- title: Development
  activities:
    - title: Core Features
      start: 2024-01-15
      end: 2024-03-01
    - title: Beta Features
      start: 2024-03-01
      end: 2024-04-15
    - title: Polish & Fixes
      start: 2024-04-15
      end: 2024-06-01

::/gantt::
```

--------------------------------

### Configure Neoteroi Contributors Plugin

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Define plugin settings in mkdocs.yml, including labels, contributor overrides, and exclusion patterns.

```yaml
plugins:
  - neoteroi.contribs:
      contributors_label: "Contributors"
      last_modified_label: "Last modified on"
      time_format: "%Y-%m-%d %H:%M:%S"
      show_last_modified_time: true
      show_contributors_title: false
      enabled_by_env: "ENABLE_CONTRIBS"  # Optional env var control
      exclude:
        - "index.md"
        - "changelog/*"
      contributors:
        - email: "john@example.com"
          name: "John Doe"
          image: "/img/avatars/john.png"
        - email: "bot@example.com"
          ignore: true  # Exclude bots from contributor list
        - email: "old@example.com"
          merge_with: "new@example.com"  # Merge commit counts
```

--------------------------------

### Use Extensions Programmatically with Python Markdown

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Initialize and configure Neoteroi extensions within a Python script to process Markdown content.

```python
import markdown
from neoteroi.mkdocs.cards import CardsExtension
from neoteroi.mkdocs.timeline import TimelineExtension
from neoteroi.mkdocs.projects import ProjectsExtension
from neoteroi.mkdocs.spantable import SpanTableExtension

# Configure extensions with options
md = markdown.Markdown(
    extensions=[
        CardsExtension(priority=100, blank_target=True),
        TimelineExtension(priority=100),
        ProjectsExtension(priority=100),
        SpanTableExtension(),
    ]
)

# Process Markdown with embedded cards
source = """
::cards:: cols=2

- title: Feature One
  content: Description of feature one.
  url: /feature-one

- title: Feature Two
  content: Description of feature two.
  url: /feature-two

::/cards::
"""

html_output = md.convert(source)
print(html_output)
# Output: <div class="nt-cards nt-grid cols-2">...</div>
```

--------------------------------

### Compile SCSS Styles

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Use the Sass CLI to compile component styles into CSS files for theme integration.

```bash
# Compile all styles
sass --no-source-map --style compressed styles/all.scss docs/css/neoteroi.css

# Or compile individual components
sass --no-source-map --style compressed styles/cards.scss docs/css/cards.css
sass --no-source-map --style compressed styles/timeline.scss docs/css/timeline.css
sass --no-source-map --style compressed styles/gantt.scss docs/css/gantt.css
sass --no-source-map --style compressed styles/spantable.scss docs/css/spantable.css
sass --no-source-map --style compressed styles/contribs.scss docs/css/contribs.css
```

--------------------------------

### Include Compiled CSS in MkDocs

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Reference the generated CSS files in the mkdocs.yml configuration.

```yaml
# mkdocs.yml - include compiled CSS
extra_css:
  - css/neoteroi.css
```

--------------------------------

### Embed OpenAPI Documentation

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Use the OAD tag to embed OpenAPI specs from local files or remote URLs.

```markdown
<!-- In your Markdown file -->
# API Reference

[OAD(./docs/swagger.yaml)]

<!-- Or from a remote URL -->
[OAD(https://petstore.swagger.io/v2/swagger.json)]
```

--------------------------------

### Render Chronological Timelines

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Display events in a vertical timeline using YAML, JSON, CSV, or external files.

```markdown
<!-- Timeline with YAML data -->
::timeline::

- title: Project Kickoff
  sub_title: 2024-Q1
  content: Initial planning and team assembly.
  icon: "fa-solid fa-rocket"
  key: blue

- title: Development Phase
  sub_title: 2024-Q2
  content: Core feature implementation begins.
  icon: "fa-solid fa-code"
  key: cyan

- title: Beta Release
  sub_title: 2024-Q3
  content: Public beta testing and feedback collection.
  icon: "fa-solid fa-flask"
  key: pink

- title: Production Launch
  sub_title: 2024-Q4
  content: Full production deployment.
  icon: "fa-solid fa-flag-checkered"
  key: green

::/timeline::

<!-- Timeline with JSON data -->
::timeline:: json

[
    {
        "title": "Version 1.0",
        "content": "Initial release with core features.",
        "icon": "fa-solid fa-star",
        "key": "blue",
        "sub_title": "January 2024"
    },
    {
        "title": "Version 2.0",
        "content": "Major update with new capabilities.",
        "icon": "fa-solid fa-bolt",
        "key": "cyan",
        "sub_title": "June 2024"
    }
]

::/timeline::

<!-- Timeline with CSV data -->
::timeline:: csv
title,sub_title,content,icon,key
Phase 1,2024-Q1,Research and planning,fa-solid fa-search,blue
Phase 2,2024-Q2,Development,fa-solid fa-hammer,cyan
Phase 3,2024-Q3,Testing,fa-solid fa-vial,pink
::/timeline::

<!-- Timeline from external file -->
[timeline(./data/roadmap.yaml)]
```

--------------------------------

### Gantt Chart from External File

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Embeds a Gantt chart defined in an external YAML file. This is useful for separating complex chart definitions from your main documentation.

```markdown
[gantt(./data/project-plan.yaml)]
```

--------------------------------

### SpanTable with Rowspan

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Creates a Markdown table with vertically merged cells using the `@span` directive. Each subsequent row in a merged block omits the cell content for the spanned column.

```markdown
<!-- Table with rowspan (vertical merge) -->
::spantable:: caption="Offices by Country"

| Country      | City      | Address                          |
| ------------ | --------- | -------------------------------- |
| France @span | Paris     | 8 Rue St Ferréol, 75001          |
|              | Lyon      | 50 Boulevard Courbet, 69001      |
|              | Marseille | 12 Rue de la République, 13001   |
| Germany @span| Berlin    | Friedrichstraße 123, 10117       |
|              | Munich    | Maximilianstraße 45, 80539       |
| Italy @span  | Rome      | Via del Corso 100, 00186         |
|              | Milan     | Corso Buenos Aires 50, 20124     |

::end-spantable::
```

--------------------------------

### SpanTable with CSS Classes

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Applies CSS classes to individual cells within a spantable for custom styling. Use `@class` followed by the class name to style specific cells.

```markdown
<!-- Table with cell-level CSS classes -->
::spantable::

| Status           | Count                    |
| ---------------- | ------------------------ |
| Active @class="success" | 42 @class="highlight" |
| Pending @class="warning" | 15                   |
| Failed @class="danger"  | 3                     |

::end-spantable::
```

--------------------------------

### SpanTable with Explicit Rowspan and Colspan

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Uses explicit `@span=col:row` syntax to define cell merges, allowing for precise control over both horizontal and vertical spanning in Markdown tables.

```markdown
<!-- Explicit rowspan with @span=col:row -->
::spantable:: caption="Class Categories"

| Class   | Power Source      |
| ------- | ----------------- |
| Cleric  | Divine @span=0:2  |
| Paladin |                   |
| Fighter | Martial @span=0:4 |
| Ranger  |                   |
| Rogue   |                   |
| Warlord |                   |

::end-spantable::
```

--------------------------------

### SpanTable with Colspan

Source: https://context7.com/neoteroi/mkdocs-plugins/llms.txt

Generates a Markdown table with horizontally merged cells using the `@span` directive. This is useful for creating headers that span multiple columns or grouping related data.

```markdown
<!-- Table with colspan (horizontal merge) -->
::spantable:: caption="Quarterly Sales Report" class="sales-table"

| Region @span  |           | Q1 @span |      | Q2 @span |      |
| ------------- | --------- | -------- | ---- | -------- | ---- |
|               |           | Units    | Rev  | Units    | Rev  |
| North @span   |           | 150      | $15K | 200      | $20K |
|               |           | 180      | $18K | 220      | $22K |
| South @span   |           | 120      | $12K | 140      | $14K |
|               |           | 100      | $10K | 130      | $13K |

::end-spantable::
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.