fix: alignement du filtre à droite sur mobile

This commit is contained in:
Julien Froidefond
2025-02-12 21:18:36 +01:00
parent 98228e24b6
commit ddeed31488
3 changed files with 10 additions and 7 deletions

View File

@@ -69,8 +69,8 @@ export function PaginatedSeriesGrid({
return ( return (
<div className="space-y-8"> <div className="space-y-8">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between flex-wrap gap-4">
<p className="text-sm text-muted-foreground"> <p className="text-sm text-muted-foreground flex-1 min-w-[200px]">
{totalElements > 0 ? ( {totalElements > 0 ? (
<> <>
Affichage des séries <span className="font-medium">{startIndex}</span> à{" "} Affichage des séries <span className="font-medium">{startIndex}</span> à{" "}
@@ -83,7 +83,7 @@ export function PaginatedSeriesGrid({
</p> </p>
<button <button
onClick={handleUnreadFilter} onClick={handleUnreadFilter}
className="flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg hover:bg-accent hover:text-accent-foreground" className="inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg hover:bg-accent hover:text-accent-foreground whitespace-nowrap ml-auto"
> >
<Filter className="h-4 w-4" /> <Filter className="h-4 w-4" />
{showOnlyUnread ? "Afficher tout" : "À lire"} {showOnlyUnread ? "Afficher tout" : "À lire"}

View File

@@ -82,8 +82,8 @@ export function PaginatedBookGrid({
return ( return (
<div className="space-y-8"> <div className="space-y-8">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between flex-wrap gap-4">
<p className="text-sm text-muted-foreground"> <p className="text-sm text-muted-foreground flex-1 min-w-[200px]">
{totalElements > 0 ? ( {totalElements > 0 ? (
<> <>
Affichage des tomes <span className="font-medium">{startIndex}</span> à{" "} Affichage des tomes <span className="font-medium">{startIndex}</span> à{" "}
@@ -96,7 +96,7 @@ export function PaginatedBookGrid({
</p> </p>
<button <button
onClick={handleUnreadFilter} onClick={handleUnreadFilter}
className="flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg hover:bg-accent hover:text-accent-foreground" className="inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg hover:bg-accent hover:text-accent-foreground whitespace-nowrap ml-auto"
> >
<Filter className="h-4 w-4" /> <Filter className="h-4 w-4" />
{showOnlyUnread ? "Afficher tout" : "À lire"} {showOnlyUnread ? "Afficher tout" : "À lire"}

View File

@@ -12,7 +12,10 @@ const config = {
theme: { theme: {
container: { container: {
center: true, center: true,
padding: "2rem", padding: {
DEFAULT: "1rem",
sm: "2rem",
},
screens: { screens: {
"2xl": "1400px", "2xl": "1400px",
}, },