Moved to here

# ci4-debug-toolbar SQL Syntax Highlighter for CodeIgniter 4 Database Debug Toolbar.

Description

Make CodeIgniter 4 Database Debug Toolbar SQL Syntax to be more readable and themeable.

Table of contents

• Requirement
• Installation
• Setup
• Usage
  • Change stylesheet
  • Utilities
• Screenshot
  • Default database toolbar
  • After Using Highlighter
  • Another Example
• Credit

Requirement

• Codeigniter 4
• Highlight.php

Installation

Install library via composer:

composer require nfaiz/ci4-debug-toolbar

Or refer here for manual installation.

Setup

Library setup can be done via spark:

php spark debugtoolbar:database

This command will try to overwrite some content in app/Config/Events.php and app/Config/Toolbar.php.
Choose overwrite [y] when prompted.

Or refer here for manual setup.

After library installation and setup are completed, refresh page to see result.
See usage to configure with other pre-installed stylesheet themes.

Usage

Change StyleSheet

Open app/Config/Toolbar.php.

Find $sqlCssTheme property.

    public $sqlCssTheme = [
        'light' => 'github',
        'dark'  => 'dracula'
    ];

• light and dark are mode options for CodeIghniter 4 debug toolbar.
• Assign stylesheet name without .css extension. E.g 'github'
• Available stylesheets can be found using utilities

Utilities

Use HighlightUtilities function from Highlight.php.
Please see highlighter-utilities for more information.

E.g In Controller

    // Get available stylesheets.
    $list = \HighlightUtilities\getAvailableStyleSheets();
    d($list);

    // Set true to get available stylesheets with absolute path.
    $listPath = \HighlightUtilities\getAvailableStyleSheets(true);
    d($listPath);

    // Get specific stylesheet path.
    $path = \HighlightUtilities\getStyleSheetPath('github');
    d($path);

Screenshot

Default Database Toolbar

• Light
  

• Dark
  

After using highlighter

• Light (using default.css)
  

• Dark (using dark.css)
  

Another example

• Light (using atom-one-light.css)

• Dark (using atom-one-dark.css)

Credit

• Highlight.php
• Inspired by this pull request