From ce653c51d3f1799e6519e76e4fb3aba08231f0c2 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Tue, 9 Jan 2024 11:07:32 -0500 Subject: [PATCH] Ensure max specificity of 0,0,1 for button and input Preflight rules (#12735) * Ensure max specificity of 001 in all Preflight rules * Update changelog * Update changelog --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com> Co-authored-by: Jordan Pittman --- CHANGELOG.md | 1 + src/css/preflight.css | 6 +++--- tests/plugins/__snapshots__/preflight.test.js.snap | 4 ++-- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 12185cd6ff25..8e0c8d8eafc2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed +- Ensure max specificity of `0,0,1` for button and input Preflight rules ([#12735](https://github.com/tailwindlabs/tailwindcss/pull/12735)) - Improve glob handling for folders with `(`, `)`, `[` or `]` in the file path ([#12715](https://github.com/tailwindlabs/tailwindcss/pull/12715)) ### Added diff --git a/src/css/preflight.css b/src/css/preflight.css index b4cb52b01288..bbdcbd21f35b 100644 --- a/src/css/preflight.css +++ b/src/css/preflight.css @@ -195,9 +195,9 @@ select { */ button, -[type='button'], -[type='reset'], -[type='submit'] { +input:where([type='button']), +input:where([type='reset']), +input:where([type='submit']) { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ diff --git a/tests/plugins/__snapshots__/preflight.test.js.snap b/tests/plugins/__snapshots__/preflight.test.js.snap index f57ab0ec5eed..76f57008aebe 100644 --- a/tests/plugins/__snapshots__/preflight.test.js.snap +++ b/tests/plugins/__snapshots__/preflight.test.js.snap @@ -100,7 +100,7 @@ button, select { text-transform: none; } -button, [type="button"], [type="reset"], [type="submit"] { +button, input:where([type="button"]), input:where([type="reset"]), input:where([type="submit"]) { -webkit-appearance: button; background-color: #0000; background-image: none; @@ -300,7 +300,7 @@ button, select { text-transform: none; } -button, [type="button"], [type="reset"], [type="submit"] { +button, input:where([type="button"]), input:where([type="reset"]), input:where([type="submit"]) { -webkit-appearance: button; background-color: #0000; background-image: none;