mirrors/jellyseerr
1
0
Fork 0
mirror of https://github.com/fallenbagel/jellyseerr.git synced 2026-01-04 05:38:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): uniform-size checkboxes, vertically-aligned form labels, and fixes for other UI imperfections/inconsistencies (#737)

Browse Source
This commit is contained in:
TheCatLady
2021-02-02 02:20:05 -05:00
committed by GitHub
parent bfe25d9755
commit e34fbf72fd
55 changed files with 1230 additions and 1542 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/TvDetails/TvCast/index.tsx
View File

@@ -32,21 +32,23 @@ const TvCast: React.FC = () => {
return (
<>
<Header
subtext={
<Link href={`/tv/${data.id}`}>
<a className="hover:underline">{data.name}</a>
</Link>
}
>
{intl.formatMessage(messages.fullseriescast)}
</Header>
<div className="mt-1 mb-5">
<Header
subtext={
<Link href={`/tv/${data.id}`}>
<a className="hover:underline">{data.name}</a>
</Link>
}
>
{intl.formatMessage(messages.fullseriescast)}
</Header>
</div>
<ul className="grid grid-cols-2 gap-6 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-7 2xl:grid-cols-8">
{data?.credits.cast.map((person) => {
return (
<li
key={person.id}
className="col-span-1 flex flex-col text-center items-center"
className="flex flex-col items-center col-span-1 text-center"
>
<PersonCard
name={person.name}

20
src/components/TvDetails/TvCrew/index.tsx
View File

@@ -32,15 +32,17 @@ const TvCrew: React.FC = () => {
return (
<>
<Header
subtext={
<Link href={`/tv/${data.id}`}>
<a className="hover:underline">{data.name}</a>
</Link>
}
>
{intl.formatMessage(messages.fullseriescrew)}
</Header>
<div className="mt-1 mb-5">
<Header
subtext={
<Link href={`/tv/${data.id}`}>
<a className="hover:underline">{data.name}</a>
</Link>
}
>
{intl.formatMessage(messages.fullseriescrew)}
</Header>
</div>
<ul className="grid grid-cols-2 gap-6 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-7 2xl:grid-cols-8">
{data?.credits.crew.map((person, index) => {
return (

24
src/components/TvDetails/TvRecommendations.tsx
View File

@@ -77,17 +77,19 @@ const TvRecommendations: React.FC = () => {
return (
<>
<Header
subtext={
tvData && !tvError
? intl.formatMessage(messages.recommendationssubtext, {
title: tvData.name,
})
: ''
}
>
<FormattedMessage {...messages.recommendations} />
</Header>
<div className="mt-1 mb-5">
<Header
subtext={
tvData && !tvError
? intl.formatMessage(messages.recommendationssubtext, {
title: tvData.name,
})
: ''
}
>
<FormattedMessage {...messages.recommendations} />
</Header>
</div>
<ListView
items={titles}
isEmpty={isEmpty}

24
src/components/TvDetails/TvSimilar.tsx
View File

@@ -77,17 +77,19 @@ const TvSimilar: React.FC = () => {
return (
<>
<Header
subtext={
tvData && !tvError
? intl.formatMessage(messages.similarsubtext, {
title: tvData.name,
})
: undefined
}
>
<FormattedMessage {...messages.similar} />
</Header>
<div className="mt-1 mb-5">
<Header
subtext={
tvData && !tvError
? intl.formatMessage(messages.similarsubtext, {
title: tvData.name,
})
: undefined
}
>
<FormattedMessage {...messages.similar} />
</Header>
</div>
<ListView
items={titles}
isEmpty={isEmpty}

22
src/components/TvDetails/index.tsx
View File

@@ -207,12 +207,12 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
(data.mediaInfo.status !== MediaStatus.AVAILABLE ||
data.mediaInfo.status4k !== MediaStatus.AVAILABLE) && (
<div className="mb-6">
<div className="flex flex-col sm:flex-row flex-nowrap">
{data?.mediaInfo &&
data?.mediaInfo.status !== MediaStatus.AVAILABLE && (
{data?.mediaInfo &&
data?.mediaInfo.status !== MediaStatus.AVAILABLE && (
<div className="flex flex-col sm:flex-row flex-nowrap mb-2">
<Button
onClick={() => markAvailable()}
className="w-full mb-2 sm:mb-0 sm:mr-1 last:mr-0"
className="w-full sm:mb-0"
buttonType="success"
>
<svg
@@ -229,12 +229,14 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
</svg>
<span>{intl.formatMessage(messages.markavailable)}</span>
</Button>
)}
{data?.mediaInfo &&
data?.mediaInfo.status4k !== MediaStatus.AVAILABLE && (
</div>
)}
{data?.mediaInfo &&
data?.mediaInfo.status4k !== MediaStatus.AVAILABLE && (
<div className="flex flex-col sm:flex-row flex-nowrap mb-2">
<Button
onClick={() => markAvailable(true)}
className="w-full sm:ml-1 first:ml-0"
className="w-full sm:mb-0"
buttonType="success"
>
<svg
@@ -253,8 +255,8 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
{intl.formatMessage(messages.mark4kavailable)}
</span>
</Button>
)}
</div>
</div>
)}
<div className="mt-3 text-xs text-gray-300">
{intl.formatMessage(messages.allseasonsmarkedavailable)}
</div>