siestamark

siestamark

Modern CSS with Tailwind: minor formatting suggestions

Congratulations on a fine book on TailwindCSS. I appreciate your very helpful work. It is very timely and nicely done.

In the Utilities section of Chapter 2, you have a callout for “The Leading Dot”. I understand that this is consistent with the concept of a CSS class description. However, as a reader of your text and as a developer using TailwindCSS, I am not defining these TailwindCSS classes, but just using them, which disallows typing their leading dot. It would be less distracting for me if all those dots just went away. Your blue bold lowercase is enough to set these concepts apart for me.

Also, when showing a named optional utility family, I think it would make more logical sense to pull the dash into the curly braces. For example, rather than showing text-{size}-{color}-{level} to indicate a family of text sizes, colors, and levels respectively, it would be easier on my eyes if this were written text{-size}{-color}{-level}, as everything within each {…} would logically go together. If no size were specified, there would be no dash for size; if no color were specified, there would be no dash for color; etc.

Most Liked

noelrappin

noelrappin

Author of Modern Front-End Development for Rails

Thanks for the feedback. I went back and forth on the both of those.

In the second case, I decided to match the way the Tailwind documentation does patterns, it keeps the dashes outside the braces.

The first case, I also thought I was matching the Tailwind documentation, but either they changed the formatting there, or I’m having a memory lapse, because they are not currently consistently using the leading dot to define classes, though they still use it in some places.

Where Next?

Popular Pragmatic Bookshelf topics Top

jon
Some minor things in the paper edition that says “3 2020” on the title page verso, not mentioned in the book’s errata online: p. 186 But...
New
jeffmcompsci
Title: Design and Build Great Web APIs - typo “https://company-atk.herokuapp.com/2258ie4t68jv” (page 19, third bullet in URL list) Typo:...
New
leonW
I ran this command after installing the sample application: $ cards add do something --owner Brian And got a file not found error: Fil...
New
jgchristopher
“The ProductLive.Index template calls a helper function, live_component/3, that in turn calls on the modal component. ” Excerpt From: Br...
New
jskubick
I’m under the impression that when the reader gets to page 136 (“View Data with the Database Inspector”), the code SHOULD be able to buil...
New
digitalbias
Title: Build a Weather Station with Elixir and Nerves: Problem connecting to Postgres with Grafana on (page 64) If you follow the defau...
New
brunogirin
When I run the coverage example to report on missing lines, I get: pytest --cov=cards --report=term-missing ch7 ERROR: usage: pytest [op...
New
brunogirin
When trying to run tox in parallel as explained on page 151, I got the following error: tox: error: argument -p/–parallel: expected one...
New
redconfetti
Docker-Machine became part of the Docker Toolbox, which was deprecated in 2020, long after Docker Desktop supported Docker Engine nativel...
New
dachristenson
@mfazio23 Android Studio will not accept anything I do when trying to use the Transformations class, as described on pp. 140-141. Googl...
New

Other popular topics Top

New
PragmaticBookshelf
Design and develop sophisticated 2D games that are as much fun to make as they are to play. From particle effects and pathfinding to soci...
New
New
PragmaticBookshelf
Tailwind CSS is an exciting new CSS framework that allows you to design your site by composing simple utility classes to create complex e...
New
PragmaticBookshelf
Create efficient, elegant software tests in pytest, Python's most powerful testing framework. Brian Okken @brianokken Edited by Kat...
New
PragmaticBookshelf
Use WebRTC to build web applications that stream media and data in real time directly from one user to another, all in the browser. ...
New
PragmaticBookshelf
Rails 7 completely redefines what it means to produce fantastic user experiences and provides a way to achieve all the benefits of single...
New
PragmaticBookshelf
Develop, deploy, and debug BEAM applications using BEAMOps: a new paradigm that focuses on scalability, fault tolerance, and owning each ...
New
AstonJ
This is a very quick guide, you just need to: Download LM Studio: https://lmstudio.ai/ Click on search Type DeepSeek, then select the o...
New
RobertRichards
Hair Salon Games for Girls Fun Girls Hair Saloon game is mainly developed for kids. This game allows users to select virtual avatars to ...
New

Sub Categories: