mirror of
https://github.com/Xevion/rdap.git
synced 2025-12-07 01:16:08 -06:00
build: upgrade Tailwind CSS from v3 to v4
- Migrate from Tailwind CSS 3.x to 4.1.15 - Replace autoprefixer with @tailwindcss/postcss 4.1.15 - Update PostCSS configuration for Tailwind v4 compatibility - Convert globals.scss to globals.css for CSS-first configuration - Remove legacy tailwind.config.cjs in favor of CSS-based config - Update all component imports to use new globals.css - Remove old.tsx.disabled file
This commit is contained in:
@@ -29,7 +29,7 @@ const AbstractCard: FunctionComponent<AbstractCardProps> = ({
|
||||
<div className="mb-4 overflow-clip rounded bg-zinc-800 shadow">
|
||||
{header != undefined || data != undefined ? (
|
||||
<div className="flex bg-zinc-700 p-2 pl-3 md:pl-5">
|
||||
<div className="grow space-x-2">{header}</div>
|
||||
<div className="flex grow gap-2">{header}</div>
|
||||
{url != undefined ? (
|
||||
<div className="pr-2">
|
||||
<a href={url} target="_blank" rel="noreferrer">
|
||||
@@ -96,7 +96,7 @@ const AbstractCard: FunctionComponent<AbstractCardProps> = ({
|
||||
)}
|
||||
</div>
|
||||
{footer != null ? (
|
||||
<div className="space-x-2 bg-zinc-700 p-2 pl-5">{footer}</div>
|
||||
<div className="flex gap-2 bg-zinc-700 p-2 pl-5">{footer}</div>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -23,7 +23,7 @@ const ErrorCard: FunctionComponent<ErrorCardProps> = ({
|
||||
)}
|
||||
>
|
||||
<div className="flex">
|
||||
<div className="flex-shrink-0">
|
||||
<div className="shrink-0">
|
||||
<XCircleIcon className="h-5 w-5 text-red-300" aria-hidden="true" />
|
||||
</div>
|
||||
<div className="ml-3 w-full text-sm text-red-300">
|
||||
@@ -35,7 +35,7 @@ const ErrorCard: FunctionComponent<ErrorCardProps> = ({
|
||||
) : null}
|
||||
<div className="mt-2">
|
||||
{issues != undefined ? (
|
||||
<ul role="list" className="list-disc space-y-1 pl-5">
|
||||
<ul role="list" className="flex list-disc flex-col gap-1 pl-5">
|
||||
{issues.map((issueText, index) => (
|
||||
<li key={index}>{issueText}</li>
|
||||
))}
|
||||
|
||||
@@ -146,7 +146,7 @@ const LookupInput: FunctionComponent<LookupInputProps> = ({
|
||||
className={clsx(
|
||||
"lg:py-4.5 block w-full rounded-l-md border border-transparent",
|
||||
"bg-zinc-700 py-2 pl-10 pr-1.5 text-sm placeholder-zinc-400 placeholder:translate-y-2 focus:text-zinc-200",
|
||||
" focus:outline-none sm:text-sm md:py-3 md:text-base lg:text-lg"
|
||||
" focus:outline-hidden sm:text-sm md:py-3 md:text-base lg:text-lg"
|
||||
)}
|
||||
disabled={isLoading}
|
||||
placeholder={placeholders[selected]}
|
||||
@@ -184,8 +184,8 @@ const LookupInput: FunctionComponent<LookupInputProps> = ({
|
||||
<ListboxButton
|
||||
className={clsx(
|
||||
"relative h-full w-full cursor-default whitespace-nowrap rounded-r-lg bg-zinc-700 py-2 pl-1 pr-10 text-right",
|
||||
"text-xs focus:outline-none focus-visible:border-indigo-500 sm:text-sm md:text-base lg:text-lg",
|
||||
"focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 focus-visible:ring-offset-2 focus-visible:ring-offset-orange-300 "
|
||||
"text-xs focus:outline-hidden focus-visible:border-indigo-500 sm:text-sm md:text-base lg:text-lg",
|
||||
"focus-visible:ring-2 focus-visible:ring-white/75 focus-visible:ring-offset-2 focus-visible:ring-offset-orange-300 "
|
||||
)}
|
||||
>
|
||||
{/* Fetch special text for 'auto' mode, otherwise just use the options. */}
|
||||
@@ -229,7 +229,7 @@ const LookupInput: FunctionComponent<LookupInputProps> = ({
|
||||
<ListboxOptions
|
||||
className={clsx(
|
||||
"scrollbar-thin absolute right-0 mt-1 max-h-60 min-w-full overflow-auto rounded-md bg-zinc-700 py-1",
|
||||
"text-zinc-200 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm"
|
||||
"text-zinc-200 shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-sm"
|
||||
)}
|
||||
>
|
||||
{Object.entries(objectNames).map(([key, value]) => (
|
||||
|
||||
Reference in New Issue
Block a user