Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
36 lines (25 sloc) 1.12 KB

Clean terminal

A terminal emulator React component with clean styling (using styled-components) and easy customization

Why?

So you can show people what terminal commands to use in a pleasant way.

How?

npm install clean-terminal

import {CleanTerminal, StatementLine, InputStatementLine} from 'clean-terminal';

...

<CleanTerminal>
    <InputStatementLine>echo "<span role="img" aria-label="wave">👋</span> Hello, friend."</InputStatementLine>
    <StatementLine><span role="img" aria-label="wave">👋</span> Hello, friend.</StatementLine>
    <InputStatementLine>ping http://sdgandhi.github.io</InputStatementLine>
    <StatementLine>
        <p>PING sni.github.map.fastly.net (151.101.41.147): 56 data bytes</p>
        <p>64 bytes from 151.101.41.147: icmp_seq=0 ttl=56 time=6.610 ms</p>
        <p>64 bytes from 151.101.41.147: icmp_seq=1 ttl=56 time=6.603 ms</p>
    </StatementLine>
</CleanTerminal>

Example 1

What?

It's a React component!

Who?

Me!