Apply a Class
Last updated
Last updated
Tailwind classes can be applied to a block in one of two ways; through the UI and/or the class selector.
To add a Tailwind class through the UI, select a block.
Select a property.
Select the required value in the modal.
If you are familiar with Tailwind values, you can input the desired value without having to use the class prefix.
Any valid custom input will automatically be converted to a Tailwind class.
Cwicly automatically detects classes that apply to a property so you do not have to remove a Tailwind class to change its value.
Tailwind classes appear with the characteristic Tailwind blue in the Class area.
Any team member unfamiliar with Cwicly can write in their classes as they usually would while another can work with the UI at the same time.
You can also add a Tailwind class through the class selector.
Navigate to the Block Inspector.
Open the class selector.
Type in your desired class.
Some suggestions appear in the Tailwind classes column.
To apply, select a suggestion or press enter.
You can remove a Tailwind value in one of two ways:
Resetting the value of the property.
Or by removing its associated class by clicking the remove icon.
Any team member unfamiliar with Cwicly can simply write in their classes as they usually would while allowing you to work with the UI at the same time.
For hybrid users, those who like to work with classes and the UI:
Shift click on a Tailwind class.
The UI will automatically take you to the appropriate editing view.
The Hover Preview property allows you to see what a class or value represents.
Hover over a Tailwind class to get its CSS definition.
Hover over a value suggestion to see its CSS value.
