Crear terminales personalizados con JavaScript puro y CSS-Shell. js

Vista prévia

Descripción

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

Instalación

# Yarn
$ yarn add shell.js

# NPM
$ npm install shell.js --save

Funcionamiento

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

<script src="/path/to/shell.js"></script>

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

<div id="default"></div>

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

new Shell('#default', {


// options here
});

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

• ' Custom ' (por defecto)
• Ubuntu
• OSX
• Windows

new Shell('#default', {


style: OSX
});

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

new Shell('#default', {


theme: 'light'
});

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

new Shell('#default', {


user: 'guest',


host: 'WIKICSS',


path: '/etc/',


commands: ['sudo -i', 'rm -rf /', 'exit']
});

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

new Shell('#default', {


responsive: true
});

Toastinette es un plugin de notificación JavaScript muy pequeño para mostrar los mensajes del brindis inspirados en material Design en la Página Web.

<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.6/typed.min.js"></script>

new Shell('#default', {


typed: Typed
});

Registro de cambios

10/12/2018

• v3.1.0: Fix responsive behaviour

07/04/2018

• Heredar el color correcto para el título

07/02/2018

• Un montón de correcciones

06/13/2018

• v3.0.0-rc.1