mirror of
https://github.com/twigphp/Twig.git
synced 2026-09-05 15:07:11 +00:00
Fix some typos in html_cva docs
This commit is contained in:
@@ -20,7 +20,7 @@ function where you define ``base`` classes that should always be present and the
|
|||||||
|
|
||||||
{# templates/alert.html.twig #}
|
{# templates/alert.html.twig #}
|
||||||
{% set alert = html_cva(
|
{% set alert = html_cva(
|
||||||
base='alert ',
|
base='alert',
|
||||||
variants={
|
variants={
|
||||||
color: {
|
color: {
|
||||||
blue: 'bg-blue',
|
blue: 'bg-blue',
|
||||||
@@ -45,13 +45,13 @@ Then use the ``color`` and ``size`` variants to select the needed classes:
|
|||||||
|
|
||||||
{# index.html.twig #}
|
{# index.html.twig #}
|
||||||
{{ include('alert.html.twig', {'color': 'blue', 'size': 'md'}) }}
|
{{ include('alert.html.twig', {'color': 'blue', 'size': 'md'}) }}
|
||||||
// class="alert bg-red text-lg"
|
// class="alert bg-red text-md"
|
||||||
|
|
||||||
{{ include('alert.html.twig', {'color': 'green', 'size': 'sm'}) }}
|
{{ include('alert.html.twig', {'color': 'green', 'size': 'sm'}) }}
|
||||||
// class="alert bg-green text-sm"
|
// class="alert bg-green text-sm"
|
||||||
|
|
||||||
{{ include('alert.html.twig', {'color': 'red', 'class': 'flex items-center justify-center'}) }}
|
{{ include('alert.html.twig', {'color': 'red', 'class': 'flex items-center justify-center'}) }}
|
||||||
// class="alert bg-red text-md flex items-center justify-center"
|
// class="alert bg-red flex items-center justify-center"
|
||||||
|
|
||||||
CVA and Tailwind CSS
|
CVA and Tailwind CSS
|
||||||
--------------------
|
--------------------
|
||||||
@@ -118,7 +118,7 @@ when multiple other variant conditions are met:
|
|||||||
// class="alert bg-green text-sm"
|
// class="alert bg-green text-sm"
|
||||||
|
|
||||||
{{ include('alert.html.twig', {color: 'red', size: 'md'}) }}
|
{{ include('alert.html.twig', {color: 'red', size: 'md'}) }}
|
||||||
// class="alert bg-green text-lg font-bold"
|
// class="alert bg-green text-md font-bold"
|
||||||
|
|
||||||
Default Variants
|
Default Variants
|
||||||
----------------
|
----------------
|
||||||
@@ -128,7 +128,7 @@ If no variants match, you can define a default set of classes to apply:
|
|||||||
.. code-block:: html+twig
|
.. code-block:: html+twig
|
||||||
|
|
||||||
{% set alert = html_cva(
|
{% set alert = html_cva(
|
||||||
base='alert ',
|
base='alert',
|
||||||
variants={
|
variants={
|
||||||
color: {
|
color: {
|
||||||
blue: 'bg-blue',
|
blue: 'bg-blue',
|
||||||
@@ -158,7 +158,7 @@ If no variants match, you can define a default set of classes to apply:
|
|||||||
{# index.html.twig #}
|
{# index.html.twig #}
|
||||||
|
|
||||||
{{ include('alert.html.twig', {color: 'red', size: 'lg'}) }}
|
{{ include('alert.html.twig', {color: 'red', size: 'lg'}) }}
|
||||||
// class="alert bg-red text-lg font-bold rounded-md"
|
// class="alert bg-red text-lg rounded-md"
|
||||||
|
|
||||||
.. note::
|
.. note::
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user