1
Intro to Styling Custom UIs with Tailwind Utility Classes
9m 8s
2
Scaffolding a Multi-Panel App Layout with Flexbox
7m 47s
3
Making Panels Scrollable with Flexbox
4m 59s
4
Customizing Tailwind’s Color Palette With Your Brand
3m 32s
5
Adding Custom Fonts to Tailwind
6m 45s
6
Building a Hoverable Server Selector With SVG
5m 49s
7
Transitioning Rounded Corners using the JIT Compiler
4m 29s
8
Conditionally Applying Classes Based on the Active URL
5m 8s
9
Building the Active Server Indicator using Group and Transform Utilities
11m 23s
10
Solving the Duplication Problem with Components
10m 5s
11
Building the Server Header using Arbitrary Values from the JIT Compiler
7m 17s
12
Styling the Channel List and Controlling Layout
12m 18s
13
Identifying Repeated Patterns while Dynamically Generating the Channel List
12m 35s
14
Styling the Active Channel Link with a New Dynamic URL Segment
9m 1s
15
Using a State Variable to Add Unread States to the Channel Nav
7m 29s
16
Building Collapsible Categories with Rotating Arrow Icons
4m 56s
17
Building the Channel Header with Flexbox Shrink and Truncating Text
8m 25s
18
Styling the Search Box Using the Forms Plugin
6m 1s
19
Using Components to Dynamically Generate the Channel's Messages
7m 3s
20
Dynamically Generating the Server and Channel Navs
3m 21s
21
Using Responsive Design to Hide the Desktop Navigation
7m 7s

Transitioning Rounded Corners using the JIT Compiler

Tailwind

Share this video with your friends

Tailwind CSS v2.1 introduces a new just-in-time compiler for Tailwind that generates your styles on-demand as you author your templates, instead of generating everything in advance at initial build time. In this lesson, we'll review how to transition rounded courses using the JIT Compiler.

The code for this lesson is divided into two sections, with this you can see the progress on the code.

Begin
End

Course

Craft Scalable, Custom-Made Interfaces with Tailwind CSS

Rafael Bitencourt

~ 2 years ago

From squares to a circles, we can also use rounded-[50%] and it will work despite the size of the square.