Termwind
يتيح لك Termwind إنشاء تطبيقات سطر أوامر PHP فريدة وجميلة، باستخدام Tailwind CSS API. باختصار، إنه مثل Tailwind CSS، ولكن لتطبيقات سطر أوامر PHP.
يتطلب PHP 8.0+
تتطلب Termwind باستخدام الملحن:
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()
يمكن استخدام الدالة style()
لإضافة أنماط مخصصة وتحديث الألوان أيضًا.
use function Termwind { style }; style ( ' green-300 ' )-> color ( ' #bada55 ' ); style ( ' btn ' )-> apply ( ' p-4 bg-green-300 text-white ' ); render ( 'Click me' );
ask()
يمكن استخدام الدالة ask()
لطرح سؤال على المستخدم.
use function Termwind { ask };
$ answer = ask ( <<
What is your name?
HTML );
سيكون return
المقدم من طريقة السؤال هو الإجابة المقدمة من المستخدم.
terminal()
تقوم الدالة terminal()
بإرجاع مثيل للفئة Terminal بالطرق التالية:
->width()
: يُرجع العرض الكامل للمحطة.->height()
: يُرجع الارتفاع الكامل للمحطة.->clear()
: يقوم بمسح الشاشة الطرفية. تستخدم كافة الفئات المدعومة نفس المنطق المتوفر على 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-['.']
. كما هو الحال مع TailwindCSS، فإننا ندعم أيضًا استعلامات وسائط التصميم سريع الاستجابة وهذه هي نقاط التوقف المدعومة:
sm
: 64 مسافات (640 بكسل)md
: 76 مسافة (768 بكسل)lg
: 102 مسافات (1024 بكسل)xl
: 128 مسافة (1280 بكسل)2xl
: 153 مسافة (1536 بكسل) render (<<<'HTML'If bg is blue is sm, if red > than sm breakpoint.HTML);
تعتمد جميع أحجام CLI على حجم الخط 15.
جميع العناصر لديها القدرة على استخدام سمة class
.
يمكن استخدام العنصر كعنصر من نوع الكتلة. الأنماط الافتراضية : block
render (<<<'HTML'
This is a div element.
HTML);
يمكن استخدام العنصر
كفقرة.
الأنماط الافتراضية : block
render (<<<'HTML'
This is a paragraph.
HTML);
يمكن استخدام العنصر
كحاوية نص مضمنة.
Termwind.
HTML);" style=";text-align:right;direction:rtl"> render (<<<'HTML'
This is a CLI app built with Termwind.
HTML);
يمكن استخدام العنصر
كارتباط تشعبي. يسمح باستخدام سمة href
لفتح الرابط عند النقر عليه.
Click here to open
HTML);" style=";text-align:right;direction:rtl"> render (<<<'HTML'
This is a CLI app built with Termwind. Click here to open
HTML);
و
يمكن استخدام العنصرين
و
لتمييز النص بالخط العريض .
الأنماط الافتراضية : font-bold
render (<<<'HTML'
This is a CLI app built with Termwind.
HTML);
و
يمكن استخدام العنصرين
و
لتمييز النص على أنه مائل .
الأنماط الافتراضية : italic
render (<<<'HTML'
This is a CLI app built with Termwind.
HTML);
يمكن استخدام العنصر
لإضافة الخط من خلال النص.
الأنماط الافتراضية : line-through
render (<<<'HTML'
This is a CLI app built with Termwind.
HTML);
يمكن استخدام العنصر
لعمل فاصل أسطر.
render (<<<'HTML'
This is a CLI
app built with Termwind.
HTML);
يمكن استخدام العنصر
لقائمة غير مرتبة. يمكنه فقط قبول عناصر
كعناصر فرعية، إذا كان هناك عنصر آخر بشرط أن يقوم بطرح استثناء InvalidChild
.
الأنماط الافتراضية : block
، list-disc
render (<<<'HTML'
Item 1
Item 2
HTML);
يمكن استخدام العنصر
لقائمة مرتبة. يمكنه فقط قبول عناصر
كعناصر فرعية، إذا كان هناك عنصر آخر بشرط أن يرمي استثناء InvalidChild
.
الأنماط الافتراضية : block
، list-decimal
render (<<<'HTML'
Item 1
Item 2
HTML);
يمكن استخدام العنصر
كعنصر قائمة. يجب استخدامه فقط كعنصر فرعي للعناصر
و
.
الأنماط الافتراضية : block
، list-decimal
render (<<<'HTML'
Item 1
HTML);
يمكن استخدام العنصر
لقائمة الوصف. يمكنه فقط قبول عناصر
أو
كعناصر فرعية، إذا كان هناك عنصر آخر بشرط أن يقوم بطرح استثناء InvalidChild
.
الأنماط الافتراضية : block
render (<<<'HTML'
Termwind
Give your CLI apps a unique look
HTML);
يمكن استخدام العنصر
كعنوان وصف. يجب استخدامه فقط كعنصر فرعي لعناصر
.
الأنماط الافتراضية : block
، font-bold
render (<<<'HTML'
Termwind
HTML);
يمكن استخدام العنصر
كعنوان وصف. يجب استخدامه فقط كعنصر فرعي لعناصر
.
الأنماط الافتراضية : block
، ml-4
render (<<<'HTML'
Give your CLI apps a unique look
HTML);
يمكن استخدام العنصر
كخط أفقي.
render (<<<'HTML'
Termwind
Give your CLI apps a unique look
HTML);
يمكن أن يحتوي عنصر على أعمدة وصفوف. render (<<<'HTML'
Task
Status
Termwind
Done
HTML);
يمكن استخدام العنصر
كنص منسق مسبقًا.
render (<<<'HTML'
Text in a pre element
it preserves
both spaces and
line breaks
HTML);
يمكن استخدام عنصر
كأداة تمييز للكود. يقبل سمات line
start-line
.
try {
throw new Exception('Something went wrong');
} catch (Throwable $e) {
report($e);
}
HTML);" style=";text-align:right;direction:rtl"> render (<<<'HTML'
try {
throw new Exception('Something went wrong');
} catch (Throwable $e) {
report($e);
}
HTML);
Termwind هو برنامج مفتوح المصدر مرخص بموجب ترخيص MIT .
يوسع
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة
الكل
-
البرنامج التعليمي الرسمى لتثبيت Dreamweaver2021
2024-12-17
-
ممارسة المشروع لتنفيذ تبديل تسجيل الدخول الرائع باستخدام HTML+CSS
2024-12-18
-
تنفيذ مؤثرات خاصة لسطح مكتب Windows تشبه HTML
2024-12-18
-
4 طرق لإدخال صور SVG في صفحات الويب بتنسيق html
2024-12-18
-
طريقة التنفيذ المحددة لدمج جدول HTML
2024-12-18
-
كيفية إضافة روابط فارغة إلى نص أو صور Dreamweaver
2024-12-17