Termwind
Termwind allows you to build unique and beautiful PHP command-line applications, using the Tailwind CSS API. In short, it's like Tailwind CSS, but for the PHP command-line applications.
Requires PHP 8.0+
Require Termwind using Composer:
composer require nunomaduro/termwind
use function Termwind{render}; // single line html... render('Termwind'); // multi-line html... render(<<<'HTML'HTML); // Laravel or Symfony console commands... class UsersCommand extends Command { public function handle() { render( view('users.index', [ 'users' => User::all() ]) ); } }TermwindGive your CLI apps a unique look
style()
The style()
function may be used to add own custom styles and also update colors.
use function Termwind{style}; style('green-300')->color('#bada55'); style('btn')->apply('p-4 bg-green-300 text-white'); render('Click me');
ask()
The ask()
function may be used to prompt the user with a question.
use function Termwind{ask};
$answer = ask(<<
What is your name?
HTML);
The return
provided from the ask method will be the answer provided from the user.
terminal()
The terminal()
function returns an instance of the Terminal class, with the following methods:
->width()
: Returns the full width of the terminal.->height()
: Returns the full height of the terminal.->clear()
: It clears the terminal screen.All the classes supported use exactly the same logic that is available on tailwindcss.com/docs.
bg-{color}-{variant}
.text-{color}-{variant}
.font-bold
, font-normal
.italic
.underline
, line-through
.uppercase
, lowercase
, capitalize
, snakecase
.truncate
.text-left
, text-center
, text-right
.m-{margin}
, ml-{leftMargin}
, mr-{rightMargin}
, mt-{topMargin}
, mb-{bottomMargin}
, mx-{horizontalMargin}
, my-{verticalMargin}
.p-{padding}
, pl-{leftPadding}
, pr-{rightPadding}
, pt-{topPadding}
, pb-{bottomPadding}
, px-{horizontalPadding}
, py-{verticalPadding}
.space-y-{space}
, space-x-{space}
.w-{width}
, w-full
, w-auto
.min-w-{width}
.max-w-{width}
.justify-between
, justify-around
, justify-evenly
, justify-center
.invisible
.block
, flex
, hidden
.flex-1
.list-disc
, list-decimal
, list-square
, list-none
.content-repeat-['.']
.Like TailwindCSS we also support Responsive Design media queries and this are the breakpoints supported:
sm
: 64 spaces (640px)md
: 76 spaces (768px)lg
: 102 spaces (1024px)xl
: 128 spaces (1280px)2xl
: 153 spaces (1536px)render(<<<'HTML'If bg is blue is sm, if red > than sm breakpoint.HTML);
All the sizes for the CLI are based on Font Size 15.
All the elements have the capability to use the class
attribute.
The element can be used as a block type element.
Default Styles: block
render(<<<'HTML'
This is a div element.
HTML);
The
element can be used as a paragraph.
Default Styles: block
render(<<<'HTML'
This is a paragraph.
HTML);
The
element can be used as an inline text container.
Termwind.
HTML);">render(<<<'HTML'
This is a CLI app built with Termwind.
HTML);
The
element can be used as a hyperlink. It allows to use the href
attribute to open the link when clicked.
Click here to open
HTML);">render(<<<'HTML'
This is a CLI app built with Termwind. Click here to open
HTML);
and
The
and
elements can be used to mark the text as bold.
Default Styles: font-bold
render(<<<'HTML'
This is a CLI app built with Termwind.
HTML);
and
The
and
elements can be used to mark the text as italic.
Default Styles: italic
render(<<<'HTML'
This is a CLI app built with Termwind.
HTML);
The
element can be used to add a line through the text.
Default Styles: line-through
render(<<<'HTML'
This is a CLI app built with Termwind.
HTML);
The
element can be used to do a line break.
render(<<<'HTML'
This is a CLI
app built with Termwind.
HTML);
The
element can be used for an unordered list. It can only accept
elements as childs, if there is another element provided it will throw an InvalidChild
exception.
Default Styles: block
, list-disc
render(<<<'HTML'
Item 1
Item 2
HTML);
The
element can be used for an ordered list. It can only accept
elements as childs, if there is another element provided it will throw an InvalidChild
exception.
Default Styles: block
, list-decimal
render(<<<'HTML'
Item 1
Item 2
HTML);
The
element can be used as a list item. It should only be used as a child of
and
elements.
Default Styles: block
, list-decimal
render(<<<'HTML'
Item 1
HTML);
The
element can be used for a description list. It can only accept
or
elements as childs, if there is another element provided it will throw an InvalidChild
exception.
Default Styles: block
render(<<<'HTML'
Termwind
Give your CLI apps a unique look
HTML);
The
element can be used as a description title. It should only be used as a child of
elements.
Default Styles: block
, font-bold
render(<<<'HTML'
Termwind
HTML);
The
element can be used as a description title. It should only be used as a child of
elements.
Default Styles: block
, ml-4
render(<<<'HTML'
Give your CLI apps a unique look
HTML);
The
element can be used as a horizontal line.
render(<<<'HTML'
Termwind
Give your CLI apps a unique look
HTML);
The element can have columns and rows.
render(<<<'HTML'
Task
Status
Termwind
Done
HTML);
The
element can be used as preformatted text.
render(<<<'HTML'
Text in a pre element
it preserves
both spaces and
line breaks
HTML);
The
element can be used as code highlighter. It accepts line
and start-line
attributes.
try {
throw new Exception('Something went wrong');
} catch (Throwable $e) {
report($e);
}
HTML);">render(<<<'HTML'
try {
throw new Exception('Something went wrong');
} catch (Throwable $e) {
report($e);
}
HTML);
Termwind is an open-sourced software licensed under the MIT license.
Expand
Additional Information
-
Version
v2.3.0
-
Type
Other categories
-
Update Time
2024-12-14
-
size
50MB
-
From
Github
Related Applications
Recommended for You
Related Information
All
-
Dreamweaver2021 installation graphic tutorial
2024-12-17
-
Project practice of implementing cool login switching using HTML+CSS
2024-12-18
-
Implementation of HTML-like Windows desktop theme special effects
2024-12-18
-
4 ways to introduce svg images into html web pages
2024-12-18
-
The specific implementation method of HTML table merging
2024-12-18
-
How to add empty links to Dreamweaver text or pictures
2024-12-17