From 15002046cc7adbdb3765e32dfa573f1c71f8dbd2 Mon Sep 17 00:00:00 2001 From: Travis Vachon Date: Tue, 26 Mar 2024 15:46:15 -0700 Subject: [PATCH] fix: pin tailwind to version used in production I've been trying to get the file list in the my development version working, and was struggling even after pointing the website at the production version. It turns out that when this website was updated from Tachyons to Tailwind, a stray `collapse` style was left on the file list table: https://github.com/nftstorage/nft.storage/commit/1a29aa96597f2d92014a7e2af560af7ceead5f08#diff-f8b81b815feea0a351b1a42218602943bda2f0d4cd44b009dbbbb5f7c8c35ddaR462 At the time this was fine! Tailwind didn't have a `collapse` style until version 3.2 and 3.0/3.1 were current at the time of the transition. The production site uses Tailwind 3.1 and works just fine. However! The version specification for the `tailwind` package in the `website` project's package.json uses a "compatible with version" specifier (https://stackoverflow.com/a/22345808) which will bring in new minor versions as they're released, so my development version used Tailwind 3.4 which _does_ have a `collapse` style that is unfortunately _very different from the Tachyon style_ - rather than mapping to the `border-collapse: collapse` style as Tachyon does, `collapse` in Tailwind translates to `visibility: collapse` - a CSS attribute intended to let developers hide specific table rows. When applied to a whole table it results in the entire table being hidden. This was the source of the bug. This PR: 1) moves to the `border-collapse` Tailwind style to match the original intent 2) pins Tailwind to the version specified in `yarn.lock` and any patch releases (which should not introduce or remove new styles) --- packages/website/package.json | 2 +- packages/website/pages/files.js | 2 +- yarn.lock | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/website/package.json b/packages/website/package.json index 26836d1f4f..b788e7d185 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -40,7 +40,7 @@ "react-query": "^3.34.15", "react-tiny-popover": "^7.0.1", "swagger-ui-react": "^4.1.3", - "tailwindcss": "^3.0.23" + "tailwindcss": "~3.1.8" }, "devDependencies": { "@babel/core": "^7.17.9", diff --git a/packages/website/pages/files.js b/packages/website/pages/files.js index 521f75e94c..edc882db70 100644 --- a/packages/website/pages/files.js +++ b/packages/website/pages/files.js @@ -393,7 +393,7 @@ export default function Files({ user }) { <> - +
diff --git a/yarn.lock b/yarn.lock index 3a5827f624..febe9508bc 100644 --- a/yarn.lock +++ b/yarn.lock @@ -19429,7 +19429,7 @@ synchronous-promise@^2.0.15: resolved "https://registry.yarnpkg.com/synchronous-promise/-/synchronous-promise-2.0.16.tgz#669b75e86b4295fdcc1bb0498de9ac1af6fd51a9" integrity sha512-qImOD23aDfnIDNqlG1NOehdB9IYsn1V9oByPjKY1nakv2MQYCEMyX033/q+aEtYCpmYK1cv2+NTmlH+ra6GA5A== -tailwindcss@^3.0.23: +tailwindcss@~3.1.8: version "3.1.8" resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.1.8.tgz#4f8520550d67a835d32f2f4021580f9fddb7b741" integrity sha512-YSneUCZSFDYMwk+TGq8qYFdCA3yfBRdBlS7txSq0LUmzyeqRe3a8fBQzbz9M3WS/iFT4BNf/nmw9mEzrnSaC0g==
Date