Fixed images on rtl mode
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import { useState } from 'react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import { Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide } from 'lucide-react';
|
||||
import { Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide, ChevronsLeft, ChevronsRight } from 'lucide-react';
|
||||
|
||||
import AppLayout from '@/Layouts/AppLayout.jsx';
|
||||
|
||||
@@ -12,7 +12,7 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
|
||||
export default function Chapters({ auth, comic, chapters, histories }) {
|
||||
export default function Chapters({ auth, comic, chapters, histories, offset }) {
|
||||
|
||||
const [group, setGroup] = useState('default');
|
||||
const [favourites, setFavourites] = useState(auth.user.favourites);
|
||||
@@ -113,11 +113,13 @@ export default function Chapters({ auth, comic, chapters, histories }) {
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="text-right pr-3">Authors</td>
|
||||
<td>{ comic.comic.author.map(a => (
|
||||
<td>
|
||||
{ comic.comic.author.map(a => (
|
||||
<Badge key={ a.path_word } className="m-2" variant="outline">
|
||||
<Link href={ route('comics.author', [a.path_word]) }>{ a.name }</Link>
|
||||
</Badge>
|
||||
) ) }</td>
|
||||
) ) }
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="text-right pr-3">Description</td>
|
||||
@@ -125,7 +127,11 @@ export default function Chapters({ auth, comic, chapters, histories }) {
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="text-right pr-3">Updated At</td>
|
||||
<td>{ comic.comic.datetime_updated }</td>
|
||||
<td>
|
||||
<Link href={ route('comics.read', [comic.comic.path_word, comic.comic.last_chapter.uuid])}>
|
||||
{ comic.comic.datetime_updated } - { comic.comic.last_chapter.name }
|
||||
</Link>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -151,9 +157,23 @@ export default function Chapters({ auth, comic, chapters, histories }) {
|
||||
</div>
|
||||
<TabsContent value={ group }>
|
||||
<div className="w-full grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 xl:grid-cols-12 gap-1">
|
||||
{ (chapters.total > chapters.limit && chapters.offset > 0) && (
|
||||
<Button size="sm" variant="outline" asChild>
|
||||
<Link href="?" only={['chapters', 'offset']} headers={{ offset: parseInt(chapters.offset) - chapters.limit }}>
|
||||
<ChevronsLeft /> Prev
|
||||
</Link>
|
||||
</Button>
|
||||
) }
|
||||
{ chapters.list.sort((a, b) => ascending ? (a.index - b.index) : (b.index - a.index)).map(c => (
|
||||
<ComicChapterLink key={ c.uuid } { ...c } />
|
||||
) ) }
|
||||
{ (chapters.total > chapters.limit && chapters.offset === 0) && (
|
||||
<Button size="sm" variant="outline" asChild>
|
||||
<Link href="?" only={['chapters', 'offset']} headers={{ offset: parseInt(chapters.offset) + chapters.limit }}>
|
||||
Next <ChevronsRight />
|
||||
</Link>
|
||||
</Button>
|
||||
) }
|
||||
</div>
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
|
||||
Reference in New Issue
Block a user