Skip to content
This repository was archived by the owner on Feb 14, 2022. It is now read-only.

Commit 20ad752

Browse files
committed
Fix anchors
1 parent 2b8e4e4 commit 20ad752

File tree

1 file changed

+21
-13
lines changed

1 file changed

+21
-13
lines changed

src/pages/tailwindcss-v2/index.mdx

Lines changed: 21 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ Also how about that [brand new website](https://tailwindcss.com) eh? Hot damn.
5555

5656
---
5757

58-
## All-new color palette
58+
<h2 id="all-new-color-palette">All-new color palette</h2>
5959

6060
We've learned a lot about color since the first time we tried to design a general purpose color palette back in the Tailwind CSS v0.1.0 days, and v2.0 represents our best attempt so far.
6161

@@ -95,7 +95,7 @@ Learn more in the new [customizing colors documentation](https://tailwindcss.com
9595

9696
---
9797

98-
## Dark mode
98+
<h2 id="dark-mode">Dark mode</h2>
9999

100100
Ever since iOS added native dark mode all you dark mode nerds haven't been able to leave me alone about adding it to Tailwind. Well you did it, it's here, you win.
101101

@@ -150,7 +150,7 @@ Check out the [dark mode docs](https://tailwindcss.com/docs/dark-mode) for all t
150150

151151
---
152152

153-
## Extra wide 2XL breakpoint
153+
<h2 id="extra-wide-2-xl-breakpoint">Extra wide 2XL breakpoint</h2>
154154

155155
I'm pretty sure they make an iPhone that is 1280px wide now, so it's time to step it up.
156156

@@ -164,7 +164,7 @@ Exciting I know but also let's be serious [you've been able to add this yourself
164164

165165
---
166166

167-
## New outline ring utilities
167+
<h2 id="new-outline-ring-utilities">New outline ring utilities</h2>
168168

169169
You know how the `outline` property ignores border radius and pretty much just always looks bad? The `ring` utilities are our attempt to will a better solution into existence through blood, sweat, and tears.
170170

@@ -200,7 +200,7 @@ The [ring width documentation](https://tailwindcss.com/docs/ring-width) is the b
200200

201201
---
202202

203-
## Utility-friendly form styles
203+
<h2 id="utility-friendly-form-styles">Utility-friendly form styles</h2>
204204

205205
One thing I am constantly surprised by is how few people complain about how unbelievably useless form elements are out of the box with Tailwind. They literally look awful and you can't do anything about it without writing custom CSS full of weird background-image SVG tricks and worrying about obscure edge cases that require CSS properties you've never heard of before like `color-adjust`.
206206

@@ -230,7 +230,9 @@ Check out [the @tailwindcss/forms documentation](https://github.com/tailwindlabs
230230

231231
---
232232

233-
## Default line-heights per font-size
233+
<h2 id="default-line-heights-per-font-size">
234+
Default line-heights per font-size
235+
</h2>
234236

235237
Every font-size utility in Tailwind now comes paired with a sensible default line-height:
236238

@@ -274,7 +276,9 @@ Check out the [font size documentation](https://tailwindcss.com/docs/font-size#p
274276

275277
---
276278

277-
## Extended spacing, typography, and opacity scales
279+
<h2 id="extended-spacing-typography-and-opacity-scales">
280+
Extended spacing, typography, and opacity scales
281+
</h2>
278282

279283
We've extended the default spacing scale to include a bunch of micro values like `0.5`, `1.5`, `2.5`, and `3.5`:
280284

@@ -315,7 +319,7 @@ Peruse the entire [default config file](https://github.com/tailwindlabs/tailwind
315319

316320
---
317321

318-
## Use @apply with anything
322+
<h2 id="use-apply-with-anything">Use @apply with anything</h2>
319323

320324
By far the most common question I've gotten over the years is "why doesn't `@apply hover:bg-black` work?"
321325

@@ -333,7 +337,7 @@ Check out [the updated @apply documentation](https://tailwindcss.com/docs/functi
333337

334338
---
335339

336-
## New text overflow utilities
340+
<h2 id="new-text-overflow-utilities">New text overflow utilities</h2>
337341

338342
Up until v2.0, if you wanted to control overflowing text all we really gave you was the fairly heavy-handed `truncate` utility.
339343

@@ -349,7 +353,7 @@ Check out the new [text overflow documentation](https://tailwindcss.com/docs/tex
349353

350354
---
351355

352-
## Extend variants
356+
<h2 id="extend-variants">Extend variants</h2>
353357

354358
You know what sucks? Wanting to enable `focus-visible` for `backgroundColor` but having to list _every single default variant_ just to add one extra one:
355359

@@ -381,7 +385,9 @@ module.exports = {
381385

382386
---
383387

384-
## Group-hover and focus-within by default
388+
<h2 id="group-hover-and-focus-within-by-default">
389+
Group-hover and focus-within by default
390+
</h2>
385391

386392
One of the things we learned working on [Tailwind UI](https://tailwindui.com/components) is that `group-hover` and `focus-within` aren't nice-to-haves, they're must-haves.
387393

@@ -397,7 +403,9 @@ Check out [the default variants reference](https://tailwindcss.com/docs/configur
397403

398404
---
399405

400-
## Default transition duration and easing curve
406+
<h2 id="default-transition-duration-and-easing-curve">
407+
Default transition duration and easing curve
408+
</h2>
401409

402410
Until now, any time you wanted to add a transition in Tailwind you typically needed to add three classes:
403411

@@ -441,7 +449,7 @@ Learn more about transitions in the [transition property documentation](https://
441449

442450
---
443451

444-
## Incompatibility with IE11
452+
<h2 id="incompatibility-with-ie11">Incompatibility with IE11</h2>
445453

446454
We've decided to unburden ourselves with caring about IE11 at all, which has allowed us to fully embrace CSS custom properties for [all sorts of crazy stuff](https://adamwathan.me/composing-the-uncomposable-with-css-variables/) and is what makes things like the new `ring` utilities even possible.
447455

0 commit comments

Comments
 (0)