fix(mobile): check for responsiveness, add scrollarea support

This commit is contained in:
Amruth Pillai
2023-11-14 11:43:28 +01:00
parent 6303071410
commit 888b4db0bb
40 changed files with 491 additions and 397 deletions

View File

@ -490,7 +490,7 @@ export const Azurill = ({ columns, isFirstPage = false }: TemplateProps) => {
{isFirstPage && <Header />}
<div className="grid grid-cols-3 gap-x-4">
<div className="sidebar group col-span-1 space-y-4">
<div className="sidebar group space-y-4">
{sidebar.map((section) => (
<Fragment key={section}>{mapSectionToComponent(section)}</Fragment>
))}

View File

@ -79,7 +79,7 @@ const Summary = () => {
return (
<section id={section.id} className="grid grid-cols-5 border-t pt-2.5">
<div className="col-span-1">
<div>
<h4 className="text-base font-bold">{section.name}</h4>
</div>
@ -153,7 +153,7 @@ const Section = <T,>({
return (
<section id={section.id} className="grid grid-cols-5 border-t pt-2.5">
<div className="col-span-1">
<div>
<h4 className="text-base font-bold">{section.name}</h4>
</div>

View File

@ -503,7 +503,7 @@ export const Chikorita = ({ columns, isFirstPage = false }: TemplateProps) => {
))}
</div>
<div className="sidebar group col-span-1 space-y-4 text-background">
<div className="sidebar group space-y-4 text-background">
{sidebar.map((section) => (
<Fragment key={section}>{mapSectionToComponent(section)}</Fragment>
))}
@ -511,7 +511,7 @@ export const Chikorita = ({ columns, isFirstPage = false }: TemplateProps) => {
</div>
<div className="absolute inset-0 grid grid-cols-3" style={{ top: -margin }}>
<div className="col-span-1 col-start-3 ml-2 bg-primary"></div>
<div className="col-start-3 ml-2 bg-primary"></div>
</div>
</div>
);

View File

@ -30,7 +30,7 @@ const Header = () => {
return (
<div className="relative z-20 grid grid-cols-3 space-x-4">
<div className="col-span-1 mx-auto">
<div className="mx-auto">
<Picture />
</div>
@ -530,7 +530,7 @@ export const Ditto = ({ columns, isFirstPage = false }: TemplateProps) => {
{isFirstPage && <Header />}
<div className="grid grid-cols-3 space-x-4">
<div className="sidebar group col-span-1 space-y-4">
<div className="sidebar group space-y-4">
{sidebar.map((section) => (
<Fragment key={section}>{mapSectionToComponent(section)}</Fragment>
))}

View File

@ -526,7 +526,7 @@ export const Pikachu = ({ columns, isFirstPage = false }: TemplateProps) => {
return (
<div className="space-y-4">
<div className="grid grid-cols-3 space-x-6">
<div className="sidebar group col-span-1 space-y-4">
<div className="sidebar group space-y-4">
{isFirstPage && <Picture className="w-full !max-w-none" />}
{sidebar.map((section) => (