Table of Contents

About

The console component is just a semantic layer above the prism component.

It's to indicate that this is the output of a command line (and not a file).

You can create block like this one: 

total 32
drwxrwx---  4 www-user www-user  156 Jun 10  2020 acl
-rwxrwx---  1 www-user www-user   71 Jun 10  2020 action.php
-rwxrwx---  1 www-user www-user   71 Jun 10  2020 admin.php
drwxrwx---  5 www-user www-user  101 Jun 10  2020 authad
drwxrwx---  4 www-user www-user   69 Jun 10  2020 authldap
drwxrwx---  4 www-user www-user   30 Jun 10  2020 authmysql

Syntax

This is a Prism component and follows its ComboStrap - Prism

See prism syntax

ANSI Colors

A language called ansi can be used to transform a terminal output with ansi escaped code to render the colors.

Example: 

<console ansi>
This text is �[31mred�[0m. This one is �[32mgreen�[0m and this one is �[34mblue�[0m.
</console>

You will get this output: 

This text is �[31mred�[0m. This one is �[32mgreen�[0m and this one is �[34mblue�[0m.

Configuration

Theme

This component:

  • gets the theme chosen
  • and all userstyle applied to the elements pre and code with the class combo_console

Example: 

code.combo_console{
    color: #333 !important;
}
pre.combo_console{
    background-color: #e9ecef !important;
}