download termwind - download do código-fonte termwind

termwind

Outras categorias

v2.3.0

Baixar

Logotipo Termwind

`Termwind`

Termwind permite que você crie aplicativos de linha de comando PHP exclusivos e bonitos, usando a API Tailwind CSS . Resumindo, é como Tailwind CSS, mas para aplicativos de linha de comando PHP.

Instalação

Requer PHP 8.0+

Exigir Termwind usando Composer:

composer require nunomaduro/termwind

Uso

 use function Termwind { render };

// single line html...
render ( ' <div class="px-1 bg-green-300">Termwind</div> ' );

// multi-line html...
render (<<<'HTML'
    <div>
        <div class="px-1 bg-green-600">Termwind</div>
        <em class="ml-1">
          Give your CLI apps a unique look
        </em>
    </div>
HTML);

// Laravel or Symfony console commands...
class UsersCommand extends Command
{
    public function handle ()
    {
        render (
            view ( ' users.index ' , [
                ' users ' => User:: all ()
            ])
        );
    }
}

`style()`

A função style() pode ser usada para adicionar estilos personalizados próprios e também atualizar cores.

 use function Termwind { style };

style ( ' green-300 ' )-> color ( ' #bada55 ' );
style ( ' btn ' )-> apply ( ' p-4 bg-green-300 text-white ' );

render ( ' <div class="btn">Click me</div> ' );

`ask()`

A função ask() pode ser usada para fazer uma pergunta ao usuário.

 use function Termwind { ask };

$ answer = ask ( <<<HTML
    <span class="mt-1 ml-2 mr-1 bg-green px-1 text-black">
        What is your name?
    </span>
HTML );

O return fornecido pelo método ask será a resposta fornecida pelo usuário.

`terminal()`

A função terminal() retorna uma instância da classe Terminal, com os seguintes métodos:

->width() : Retorna a largura total do terminal.
->height() : Retorna a altura total do terminal.
->clear() : Limpa a tela do terminal.

Aulas suportadas

Todas as classes suportadas usam exatamente a mesma lógica disponível em tailwindcss.com/docs.

Cor de fundo: bg-{color}-{variant} .
Cor do texto: text-{color}-{variant} .
Peso da fonte: font-bold , font-normal .
Estilo da fonte: italic .
Decoração de texto: underline , line-through .
Transformação de texto: uppercase , lowercase , capitalize , snakecase .
Estouro de texto: truncate .
Alinhamento de texto: text-left , text-center , text-right .
Margem: m-{margin} , ml-{leftMargin} , mr-{rightMargin} , mt-{topMargin} , mb-{bottomMargin} , mx-{horizontalMargin} , my-{verticalMargin} .
Preenchimento: p-{padding} , pl-{leftPadding} , pr-{rightPadding} , pt-{topPadding} , pb-{bottomPadding} , px-{horizontalPadding} , py-{verticalPadding} .
Espaço: space-y-{space} , space-x-{space} .
Largura: w-{width} , w-full , w-auto .
Largura mínima: min-w-{width} .
Largura máxima: max-w-{width} .
Justificar conteúdo: justify-between , justify-around , justify-evenly , justify-center .
Visibilidade: invisible .
Exibir: block , flex , hidden .
Flexível: flex-1 .
Estilo de lista: list-disc , list-decimal , list-square , list-none .
Conteúdo: content-repeat-['.'] .

Design Responsivo

Assim como o TailwindCSS, também oferecemos suporte a consultas de mídia de design responsivo e estes são os pontos de interrupção suportados:

sm : 64 espaços (640px)
md : 76 espaços (768px)
lg : 102 espaços (1024px)
xl : 128 espaços (1280px)
2xl : 153 espaços (1536px)

 render (<<<'HTML'
    <div class="bg-blue-500 sm:bg-red-600">
        If bg is blue is sm, if red > than sm breakpoint.
    </div>
HTML);

Todos os tamanhos da CLI são baseados no tamanho da fonte 15.

Elementos HTML suportados

Todos os elementos têm a capacidade de usar o atributo class .

`<div>`

O elemento <div> pode ser usado como um elemento do tipo bloco.

Estilos padrão : block

 render (<<<'HTML'
    <div>This is a div element.</div>
HTML);

`<p>`

O elemento <p> pode ser usado como um parágrafo.

Estilos padrão : block

 render (<<<'HTML'
    <p>This is a paragraph.</p>
HTML);

`<span>`

O elemento <span> pode ser usado como um contêiner de texto embutido.

 render (<<<'HTML'
    <p>
        This is a CLI app built with <span class="text-green-300">Termwind</span>.
    </p>
HTML);

`<a>`

O elemento <a> pode ser usado como um hiperlink. Permite usar o atributo href para abrir o link quando clicado.

 render (<<<'HTML'
    <p>
        This is a CLI app built with Termwind. <a href="/">Click here to open</a>
    </p>
HTML);

`<b>` e `<strong>`

Os elementos <b> e <strong> podem ser usados para marcar o texto como negrito .

Estilos padrão : font-bold

 render (<<<'HTML'
    <p>
        This is a CLI app built with <b>Termwind</b>.
    </p>
HTML);

`<i>` e `<em>`

Os elementos <i> e <em> podem ser usados para marcar o texto como itálico .

Estilos padrão : italic

 render (<<<'HTML'
    <p>
        This is a CLI app built with <i>Termwind</i>.
    </p>
HTML);

`<s>`

O elemento <s> pode ser usado para adicionar um ~~linha através~~ o texto.

Estilos padrão : line-through

 render (<<<'HTML'
    <p>
        This is a CLI app built with <s>Termwind</s>.
    </p>
HTML);

`<br>`

O elemento <br> pode ser usado para fazer uma quebra de linha.

 render (<<<'HTML'
    <p>
        This is a CLI <br>
        app built with Termwind.
    </p>
HTML);

`<ul>`

O elemento <ul> pode ser usado para uma lista não ordenada. Ele só pode aceitar elementos <li> como filhos; se houver outro elemento, ele lançará uma exceção InvalidChild .

Estilos padrão : block , list-disc

 render (<<<'HTML'
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
    </ul>
HTML);

`<ol>`

O elemento <ol> pode ser usado para uma lista ordenada. Ele só pode aceitar elementos <li> como filhos; se houver outro elemento, ele lançará uma exceção InvalidChild .

Estilos padrão : block , list-decimal

 render (<<<'HTML'
    <ol>
        <li>Item 1</li>
        <li>Item 2</li>
    </ol>
HTML);

`<li>`

O elemento <li> pode ser usado como um item de lista. Deve ser usado apenas como filho dos elementos <ul> e <ol> .

Estilos padrão : block , list-decimal

 render (<<<'HTML'
    <ul>
        <li>Item 1</li>
    </ul>
HTML);

`<dl>`

O elemento <dl> pode ser usado para uma lista de descrição. Ele só pode aceitar elementos <dt> ou <dd> como filhos; se houver outro elemento, ele lançará uma exceção InvalidChild .

Estilos padrão : block

 render (<<<'HTML'
    <dl>
        <dt> Termwind</dt>
        <dd>Give your CLI apps a unique look</dd>
    </dl>
HTML);

`<dt>`

O elemento <dt> pode ser usado como título de descrição. Deve ser usado apenas como filho de elementos <dl> .

Estilos padrão : block , font-bold

 render (<<<'HTML'
    <dl>
        <dt> Termwind</dt>
    </dl>
HTML);

`<dd>`

O elemento <dd> pode ser usado como título de descrição. Deve ser usado apenas como filho de elementos <dl> .

Estilos padrão : block , ml-4

 render (<<<'HTML'
    <dl>
        <dd>Give your CLI apps a unique look</dd>
    </dl>
HTML);

`<hr>`

O elemento <hr> pode ser usado como uma linha horizontal.

 render (<<<'HTML'
    <div>
        <div> Termwind</div>
        <hr>
        <p>Give your CLI apps a unique look</p>
    </div>
HTML);

`<table>`

O elemento <table> pode ter colunas e linhas.

 render (<<<'HTML'
    <table>
        <thead>
            <tr>
                <th>Task</th>
                <th>Status</th>
            </tr>
        </thead>
        <tr>
            <th>Termwind</th>
            <td> Done</td>
        </tr>
    </table>
HTML);

`<pre>`

O elemento <pre> pode ser usado como texto pré-formatado.

 render (<<<'HTML'
    <pre>
        Text in a pre element
        it preserves
        both      spaces and
        line breaks
    </pre>
HTML);

`<code>`

O elemento <code> pode ser usado como marcador de código. Aceita atributos line e start-line .

 render (<<<'HTML'
    <code line="22" start-line="20">
        try {
            throw new Exception('Something went wrong');
        } catch (Throwable $e) {
            report($e);
        }
    </code>
HTML);

Termwind é um software de código aberto licenciado sob a licença MIT .

Expandir

Informações adicionais

Versão v2.3.0
Tipo Outras categorias
Data da Última Atualização 2024-12-14
tamanho 50MB
Vindo de Github

Aplicativos Relacionados

Recomendado para você

chat.petals.dev

Outro código-fonte

1.0.0
GPT Prompt Templates

Outro código-fonte

1.0.0
GPTyped

Outro código-fonte

GPTyped 1.0.5
PHP segundo dados abertos adivinhando o código-fonte do site versão completa + conta pública gratuita + pagamento sem visto

Outras categorias
projeto de graduação ssh do sistema de gerenciamento de manutenção de computador jsp1362

Outras categorias
A nova versão do código-fonte de emissão de cartão código-fonte de emissão de cartão pessoal com subestação, distribuição, adesão, pontos, sistema de senha de cartão de envio automático

Outras categorias
Google Dorks

Outro código-fonte

1.0
shepherd

Outro código-fonte

v6.1.6-react-shepherd: Prepare Release (#3063)
mongo express

Outro código-fonte

v1.1.0-rc-3

Informações Relacionadas Todos

termwind

Termwind

Instalação

Uso

style()

ask()

terminal()

Aulas suportadas

Design Responsivo

Elementos HTML suportados

<div>

<p>

<span>

<a>

<b> e <strong>

<i> e <em>

<s>

<br>

<ul>

<ol>

<li>

<dl>

<dt>

<dd>

<hr>

<table>

<pre>

<code>

`Termwind`

`style()`

`ask()`

`terminal()`

`<div>`

`<p>`

`<span>`

`<a>`

`<b>` e `<strong>`

`<i>` e `<em>`

`<s>`

`<br>`

`<ul>`

`<ol>`

`<li>`

`<dl>`

`<dt>`

`<dd>`

`<hr>`

`<table>`

`<pre>`

`<code>`