[UXIT-2039] Upgrade to Tailwind V4 [skip percy] #1077
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
e34d136 to
055ff44
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
055ff44 to
96fb847
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
96fb847 to
3c1ba96
Compare
|
Haven't checked the code yet, but I've noticed 2 UI discrepancies
CleanShot.2025-02-10.at.10.13.05.mp4 |
|
Also, I don't know if it's on my side, but the laptop view seems to be broken on Safari (16.1 version) - it's showing mobile layout on every screen size? |
| @layer components { | ||
| .text-link { | ||
| @apply text-brand-300; | ||
|
|
||
| &:hover { | ||
| @apply underline; | ||
| } | ||
|
|
||
| &:focus { | ||
| @apply brand-outline; | ||
| } | ||
| } |
There was a problem hiding this comment.
Tailwind utility prose seems to be overwriting the text-link class?
There was a problem hiding this comment.
As discussed earlier, not sure how to override this differently at the moment.
There was a problem hiding this comment.
We could potentially use ! - I know we generally want to avoid !important, but in this case we want to overwrite an imported library so maybe it's justified? In that case we could get rid of --tw-prose-links and have 1 class responsible for all links. Just an idea.
There was a problem hiding this comment.
Maybe adding not-prose to our custom link?
// MarkdownLink in apps/site/src/app/_components/MarkdownContent.tsx
return (
<SmartTextLink href={href} className="not-prose">
{children}
</SmartTextLink>
)There was a problem hiding this comment.
There was a problem hiding this comment.
We could potentially use ! - I know we generally want to avoid !important, but in this case we want to overwrite an imported library so maybe it's justified? In that case we could get rid of --tw-prose-links and have 1 class responsible for all links. Just an idea.
Where would you add this? @barbaraperic
There was a problem hiding this comment.
@CharlyMartin - That works. It's a bit odd to add not-prose to something that is clearly prose but, at least, it's clear where it's coming from?
There was a problem hiding this comment.
Done - e25b269 - What do you both think?
There was a problem hiding this comment.
Works for me! (It's a bit odd indeed but it's clear at least yes)
| startDate: CalendarEventType['start']['dateTime'] | ||
| } | ||
|
|
||
| export function Calendar({ startDate }: CalendarProps) { |
There was a problem hiding this comment.
Sorry I seemed to missed this, we are temporarily not using this component? 🤔
There was a problem hiding this comment.
Yes - We have removed the Governance Community Call section per #1080
There was a problem hiding this comment.
Gotcha, thank you! Should we remove the component? Or the calls are planning to return?
There was a problem hiding this comment.
The component was already removed - So I'm guessing this is a conflict resolution issue. Thanks for catching.
mirhamasala
changed the title
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
5efed44 to
15c5654
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
15c5654 to
2da89ba
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
2da89ba to
067b7e6
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
067b7e6 to
fbe4e21
Compare
mirhamasala
force-pushed
the
mm/upgrade-tailwind
branch
from
246d9c2 to
4048a86
Compare
📝 Description
This PR upgrades the Tailwind configuration and aligns the project's styling approach with TailwindCSS 4 best practices.
🛠️ Key Changes
tailwind.config.jstoglobals.css.globals.css.text-linkandtoc-headerstyles toglobals.css, following Tailwind's recommendation against using CSS modules.tooltip.module.cssandtable.module.cssto plain css, following Tailwind's recommendation against using CSS modules.globals.cssunder@utility prose, based on this guidance.🔖 Resources
__
Note