shpaq/sct-overseerr
1
0
Fork 0
mirror of https://github.com/sct/overseerr.git synced 2025-09-17 17:24:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(frontend): changed plex, request, and cog buttons to align properly on smaller mobile UIs (#928)

Browse Source
This commit is contained in:
Brandon Cohen
2021-02-16 02:16:14 -05:00
committed by GitHub
parent 019622aab1
commit f1c335815f
2 changed files with 161 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/MovieDetails/index.tsx
View File

@@ -352,7 +352,7 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
<div className="flex flex-col flex-1 mt-4 text-center text-white lg:mr-4 lg:mt-0 lg:text-left"> <div className="flex flex-col flex-1 mt-4 text-center text-white lg:mr-4 lg:mt-0 lg:text-left">
<div className="mb-2"> <div className="mb-2">
{data.mediaInfo && data.mediaInfo.status !== MediaStatus.UNKNOWN && ( {data.mediaInfo && data.mediaInfo.status !== MediaStatus.UNKNOWN && (
<span className="mr-2"> <span className="lg:mr-2">
<StatusBadge <StatusBadge
status={data.mediaInfo?.status} status={data.mediaInfo?.status}
inProgress={(data.mediaInfo.downloadStatus ?? []).length > 0} inProgress={(data.mediaInfo.downloadStatus ?? []).length > 0}
@@ -394,10 +394,11 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
))} ))}
</span> </span>
</div> </div>
<div className="relative z-10 flex flex-wrap justify-center flex-shrink-0 mt-4 sm:justify-end sm:flex-nowrap lg:mt-0"> <div className="relative z-10 flex flex-wrap justify-center flex-shrink-0 mt-2 space-y-2 sm:space-y-0 sm:justify-end sm:flex-nowrap sm:mt-4">
{(trailerUrl || {(trailerUrl ||
data.mediaInfo?.plexUrl || data.mediaInfo?.plexUrl ||
data.mediaInfo?.plexUrl4k) && ( data.mediaInfo?.plexUrl4k) && (
<div className="mt-2 sm:mt-0">
<ButtonWithDropdown <ButtonWithDropdown
buttonType="ghost" buttonType="ghost"
text={ text={
@@ -481,6 +482,7 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
</> </>
) : null} ) : null}
</ButtonWithDropdown> </ButtonWithDropdown>
</div>
)} )}
<div className="mb-3 sm:mb-0"> <div className="mb-3 sm:mb-0">
<RequestButton <RequestButton

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

@@ -378,7 +378,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
<div className="flex flex-col flex-1 mt-4 text-center text-white lg:mr-4 lg:mt-0 lg:text-left"> <div className="flex flex-col flex-1 mt-4 text-center text-white lg:mr-4 lg:mt-0 lg:text-left">
<div className="mb-2"> <div className="mb-2">
{data.mediaInfo && data.mediaInfo.status !== MediaStatus.UNKNOWN && ( {data.mediaInfo && data.mediaInfo.status !== MediaStatus.UNKNOWN && (
<span className="mr-2"> <span className="lg:mr-2">
<StatusBadge <StatusBadge
status={data.mediaInfo?.status} status={data.mediaInfo?.status}
inProgress={(data.mediaInfo.downloadStatus ?? []).length > 0} inProgress={(data.mediaInfo.downloadStatus ?? []).length > 0}
@@ -422,10 +422,11 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
))} ))}
</span> </span>
</div> </div>
<div className="flex flex-wrap justify-center flex-shrink-0 mt-4 sm:flex-nowrap sm:justify-end lg:mt-0"> <div className="flex flex-wrap justify-center flex-shrink-0 mt-2 space-y-2 sm:space-y-0 sm:flex-nowrap sm:justify-end sm:mt-4">
{(trailerUrl || {(trailerUrl ||
data.mediaInfo?.plexUrl || data.mediaInfo?.plexUrl ||
data.mediaInfo?.plexUrl4k) && ( data.mediaInfo?.plexUrl4k) && (
<div className="mt-2 sm:mt-0">
<ButtonWithDropdown <ButtonWithDropdown
buttonType="ghost" buttonType="ghost"
text={ text={
@@ -509,6 +510,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
</> </>
) : null} ) : null}
</ButtonWithDropdown> </ButtonWithDropdown>
</div>
)} )}
<div className="mb-3 sm:mb-0"> <div className="mb-3 sm:mb-0">
<RequestButton <RequestButton