fix: correct grid sizing for webkit on streaming services (#3248)

This commit is contained in:
Ryan Cohen
2023-01-16 21:04:55 +09:00
committed by GitHub
parent 1154156459
commit 6fd11cf425

View File

@@ -342,7 +342,7 @@ export const WatchProviderSelector = ({
{isLoading ? ( {isLoading ? (
<SmallLoadingSpinner /> <SmallLoadingSpinner />
) : ( ) : (
<> <div className="grid">
<div className="grid grid-cols-6 gap-2"> <div className="grid grid-cols-6 gap-2">
{initialProviders.map((provider) => { {initialProviders.map((provider) => {
const isActive = activeProvider.includes(provider.id); const isActive = activeProvider.includes(provider.id);
@@ -385,7 +385,7 @@ export const WatchProviderSelector = ({
})} })}
</div> </div>
{showMore && otherProviders.length > 0 && ( {showMore && otherProviders.length > 0 && (
<div className="relative -top-2 grid grid-cols-6 gap-2"> <div className="relative top-2 grid grid-cols-6 gap-2">
{otherProviders.map((provider) => { {otherProviders.map((provider) => {
const isActive = activeProvider.includes(provider.id); const isActive = activeProvider.includes(provider.id);
return ( return (
@@ -429,7 +429,7 @@ export const WatchProviderSelector = ({
)} )}
{otherProviders.length > 0 && ( {otherProviders.length > 0 && (
<button <button
className="mt-2 flex items-center justify-center space-x-2 text-sm text-gray-400 transition hover:text-gray-200" className="relative top-4 flex items-center justify-center space-x-2 text-sm text-gray-400 transition hover:text-gray-200"
onClick={() => setShowMore(!showMore)} onClick={() => setShowMore(!showMore)}
> >
<div className="h-0.5 flex-1 bg-gray-600" /> <div className="h-0.5 flex-1 bg-gray-600" />
@@ -449,7 +449,7 @@ export const WatchProviderSelector = ({
<div className="h-0.5 flex-1 bg-gray-600" /> <div className="h-0.5 flex-1 bg-gray-600" />
</button> </button>
)} )}
</> </div>
)} )}
</> </>
); );