hanzoai/tailwindcss-typography
2
0
Fork 0
mirror of https://github.com/hanzoai/tailwindcss-typography.git synced 2026-09-24 17:03:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Don't apply margins to <br> elements contained in an <li> in FF (#350)

Browse Source 
* Only fixup margins in `p` tags when inside a list item

The intent of these selectors are to only target `p` tags but we are targeting `*:first-child` and `*:last-child`. This has a side effect of causing `<br>` elements inside the list item to gain a margin _only in Firefox_. Other browsers treat the `<br>` element as properly inline and as such don’t apply margins but FF does not seem to.

* Update changelog
This commit is contained in:
Jordan Pittman
2024-04-24 19:38:06 -04:00
committed by GitHub
parent 9b248e0985
commit 0f6d77ccad
2 changed files with 23 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CHANGELOG.md
+3 -1
View File
@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [Unreleased]
- Nothing yet!
### Fixed
- Don't apply margins to `<br>` elements contained in an `<li>` in FF ([#350](https://github.com/tailwindlabs/tailwindcss-typography/pull/350))
## [0.5.12] - 2024-03-27
src/styles.js
+20 -20
View File
@@ -128,16 +128,16 @@ let defaultModifiers = {
marginTop: em(8, 14),
marginBottom: em(8, 14),
},
'> ul > li > *:first-child': {
'> ul > li > p:first-child': {
marginTop: em(16, 14),
},
'> ul > li > *:last-child': {
'> ul > li > p:last-child': {
marginBottom: em(16, 14),
},
'> ol > li > *:first-child': {
'> ol > li > p:first-child': {
marginTop: em(16, 14),
},
'> ol > li > *:last-child': {
'> ol > li > p:last-child': {
marginBottom: em(16, 14),
},
'ul ul, ul ol, ol ul, ol ol': {
@@ -333,16 +333,16 @@ let defaultModifiers = {
marginTop: em(12, 16),
marginBottom: em(12, 16),
},
'> ul > li > *:first-child': {
'> ul > li > p:first-child': {
marginTop: em(20, 16),
},
'> ul > li > *:last-child': {
'> ul > li > p:last-child': {
marginBottom: em(20, 16),
},
'> ol > li > *:first-child': {
'> ol > li > p:first-child': {
marginTop: em(20, 16),
},
'> ol > li > *:last-child': {
'> ol > li > p:last-child': {
marginBottom: em(20, 16),
},
'ul ul, ul ol, ol ul, ol ol': {
@@ -538,16 +538,16 @@ let defaultModifiers = {
marginTop: em(16, 18),
marginBottom: em(16, 18),
},
'> ul > li > *:first-child': {
'> ul > li > p:first-child': {
marginTop: em(24, 18),
},
'> ul > li > *:last-child': {
'> ul > li > p:last-child': {
marginBottom: em(24, 18),
},
'> ol > li > *:first-child': {
'> ol > li > p:first-child': {
marginTop: em(24, 18),
},
'> ol > li > *:last-child': {
'> ol > li > p:last-child': {
marginBottom: em(24, 18),
},
'ul ul, ul ol, ol ul, ol ol': {
@@ -743,16 +743,16 @@ let defaultModifiers = {
marginTop: em(16, 20),
marginBottom: em(16, 20),
},
'> ul > li > *:first-child': {
'> ul > li > p:first-child': {
marginTop: em(24, 20),
},
'> ul > li > *:last-child': {
'> ul > li > p:last-child': {
marginBottom: em(24, 20),
},
'> ol > li > *:first-child': {
'> ol > li > p:first-child': {
marginTop: em(24, 20),
},
'> ol > li > *:last-child': {
'> ol > li > p:last-child': {
marginBottom: em(24, 20),
},
'ul ul, ul ol, ol ul, ol ol': {
@@ -948,16 +948,16 @@ let defaultModifiers = {
marginTop: em(20, 24),
marginBottom: em(20, 24),
},
'> ul > li > *:first-child': {
'> ul > li > p:first-child': {
marginTop: em(32, 24),
},
'> ul > li > *:last-child': {
'> ul > li > p:last-child': {
marginBottom: em(32, 24),
},
'> ol > li > *:first-child': {
'> ol > li > p:first-child': {
marginTop: em(32, 24),
},
'> ol > li > *:last-child': {
'> ol > li > p:last-child': {
marginBottom: em(32, 24),
},
'ul ul, ul ol, ol ul, ol ol': {