feat(web): upgrade to tailwind v4 (#1946)

* feat(web): tailwind v4 and removal of PostCSS

* chore(web): cleanup unused compatibility styles code

* fix(web): application settings border

* fix(web): indexer, list, notification and proxy forms including selects

* fix(web): apikey, download client, filter add form

* fix(web): select text input color

* fix(web): indexer form paddings

* fix(web): feed and notification update form

* fix(web): fix margins and paddings in various forms

* fix(web): fix proxy forms

* deps(web): remove PostCSS dependency

* web: remove hover animation on release tables

* fix(web): filter tab transitions

* fix(web): linting

* feat(web): drop filter tab transitions
This commit is contained in:
martylukyy 2025-01-27 19:38:28 +01:00 committed by GitHub
parent 024371e4eb
commit 5e2769639f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
64 changed files with 686 additions and 403 deletions

View file

@ -52,7 +52,7 @@ const ListboxFilter = ({
leaveTo="opacity-0"
>
<ListboxOptions
className="absolute z-10 w-full mt-1 overflow-auto text-base bg-white dark:bg-gray-800 rounded-md shadow-lg max-h-60 border border-opacity-5 border-black dark:border-gray-700 dark:border-opacity-40 focus:outline-none sm:text-sm"
className="absolute z-10 w-full mt-1 overflow-auto text-base bg-white dark:bg-gray-800 rounded-md shadow-lg max-h-60 border border-opacity-5 border-black dark:border-gray-700 dark:border-opacity-40 focus:outline-hidden sm:text-sm"
>
<FilterOption label="All" value="" />
{children}

View file

@ -267,7 +267,7 @@ export const ReleaseTable = () => {
key={header.id}
scope="col"
colSpan={header.colSpan}
className="first:pl-5 first:rounded-tl-md last:rounded-tr-md pl-3 pr-3 py-3 text-xs font-medium tracking-wider text-left uppercase group text-gray-600 dark:text-gray-400 transition hover:bg-gray-200 dark:hover:bg-gray-775"
className="first:pl-5 first:rounded-tl-md last:rounded-tr-md pl-3 pr-3 py-3 text-xs font-medium tracking-wider text-left uppercase group text-gray-600 dark:text-gray-400"
>
<div className="flex items-center justify-between">
{header.isPlaceholder
@ -333,7 +333,7 @@ export const ReleaseTable = () => {
<label>
<span className="sr-only bg-gray-700">Items Per Page</span>
<select
className="py-1 pl-2 pr-8 text-sm block w-full border-gray-300 rounded-md shadow-sm cursor-pointer transition-colors dark:bg-gray-800 dark:border-gray-600 dark:text-gray-400 dark:hover:text-gray-200 focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50"
className="py-1 pl-2 pr-8 text-sm block w-full border-gray-300 rounded-md shadow-xs cursor-pointer transition-colors dark:bg-gray-800 dark:border-gray-600 dark:text-gray-400 dark:hover:text-gray-200 focus:border-blue-300 focus:ring-3 focus:ring-blue-200 focus:ring-opacity-50"
value={tableInstance.getState().pagination.pageSize}
onChange={e => {
tableInstance.setPageSize(Number(e.target.value));
@ -348,7 +348,7 @@ export const ReleaseTable = () => {
</label>
</div>
<div>
<nav className="inline-flex -space-x-px rounded-md shadow-sm" aria-label="Pagination">
<nav className="inline-flex -space-x-px rounded-md shadow-xs" aria-label="Pagination">
<TablePageButton
className="rounded-l-md"
onClick={() => tableInstance.firstPage()}