Markup Code
Mostly used in documentation of shell command or SQL. The file public/assets/css/markup.css defines some custom CSS-rules for markup. Use prefered method (span or custom tags):
<div class="w3-code bash">
<span>mkdir -p backup/server</span><br>
<span>rsync -av user@server:~ backup/server</span><br>
</div>
<div class="w3-code">
<bash>mkdir -p backup/server</bash><br>
<bash>rsync -av user@server:~ backup/server</bash><br>
</div>
The output from this markup will be:
mkdir -p backup/server
rsync -av user@server:~ backup/server
mkdir -p backup/server
rsync -av user@server:~ backup/server
In addition to bash, custom CSS is defined for these common command line tools:
<div class="w3-code">
<tcsh>mkdir -p backup/server</tcsh><br>
<mysql>SELECT * FROM users</mysql><br>
<psql>SELECT * FROM users</psql><br>
<cmd>copy /y /q *.txt D:\Temp</cmd><br>
<ps>Get-WmiObject -Query "Select * from Win32_Bios"</ps><br>
</div>
The output from this markup will be:
mkdir -p backup/server
SELECT * FROM users
SELECT * FROM users
copy /y /q *.txt D:\Temp
Get-WmiObject -Query "Select * from Win32_Bios"
A special sudo markup is also defined, currently these commands are displayed using a bash shell prompt.
<div class="w3-code sudo">
<span>sudo groupadd -g 1050 compdept</span><br>
<span>sudo gpasswd -a andlov compdept</span><br>
</div>
The output from this markup will be:
sudo groupadd -g 1050 compdept
sudo gpasswd -a andlov compdept
Benefit
In addition to colorize the prompt, it also let users to select text and copy without getting the prompt name mixed in.