mirror of
https://github.com/better-auth/better-auth.git
synced 2026-10-20 20:26:55 -05:00
docs: use viewport height for split layouts (#8460)
This commit is contained in:
@@ -420,11 +420,11 @@ export function CareersPageClient() {
|
||||
>(null);
|
||||
|
||||
return (
|
||||
<div className="relative h-full overflow-x-hidden pt-14 lg:pt-0">
|
||||
<div className="relative text-foreground h-full">
|
||||
<div className="flex flex-col lg:flex-row h-full">
|
||||
<div className="relative min-h-dvh overflow-x-hidden pt-14 lg:h-dvh lg:overflow-hidden lg:pt-0">
|
||||
<div className="relative text-foreground lg:h-full">
|
||||
<div className="flex flex-col lg:h-full lg:flex-row">
|
||||
{/* Left side */}
|
||||
<div className="hidden lg:block relative w-full lg:w-[30%] border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block relative w-full shrink-0 lg:w-[30%] lg:h-full border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block">
|
||||
<HalftoneBackground />
|
||||
</div>
|
||||
@@ -432,7 +432,7 @@ export function CareersPageClient() {
|
||||
</div>
|
||||
|
||||
{/* Right side */}
|
||||
<div className="relative w-full lg:w-[70%] overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="relative w-full lg:w-[70%] lg:h-full lg:overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="p-5 sm:p-6 lg:p-8 pt-8 lg:pt-16 pb-32 space-y-10">
|
||||
{/* Mobile header */}
|
||||
<div className="flex lg:hidden items-center gap-1.5">
|
||||
|
||||
@@ -401,11 +401,11 @@ function PlatformCard({
|
||||
|
||||
export function CommunityPageClient({ stats }: { stats: CommunityStats }) {
|
||||
return (
|
||||
<div className="relative h-full overflow-x-hidden pt-14 lg:pt-0">
|
||||
<div className="relative text-foreground h-full">
|
||||
<div className="flex flex-col lg:flex-row h-full">
|
||||
<div className="relative min-h-dvh overflow-x-hidden pt-14 lg:h-dvh lg:overflow-hidden lg:pt-0">
|
||||
<div className="relative text-foreground lg:h-full">
|
||||
<div className="flex flex-col lg:h-full lg:flex-row">
|
||||
{/* Left side — Community hero */}
|
||||
<div className="hidden lg:block relative w-full lg:w-[30%] border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block relative w-full shrink-0 lg:w-[30%] lg:h-full border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block">
|
||||
<HalftoneBackground />
|
||||
</div>
|
||||
@@ -413,7 +413,7 @@ export function CommunityPageClient({ stats }: { stats: CommunityStats }) {
|
||||
</div>
|
||||
|
||||
{/* Right side — Stats & platforms */}
|
||||
<div className="relative w-full lg:w-[70%] overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="relative w-full lg:w-[70%] lg:h-full lg:overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="p-5 sm:p-6 lg:p-8 pt-8 lg:pt-16 pb-32 space-y-8">
|
||||
{/* Mobile header */}
|
||||
<div className="flex lg:hidden items-center gap-1.5">
|
||||
|
||||
@@ -130,11 +130,11 @@ export function EnterprisePageClient() {
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="relative h-full overflow-x-hidden pt-14 lg:pt-0">
|
||||
<div className="relative text-foreground h-full">
|
||||
<div className="flex flex-col lg:flex-row h-full">
|
||||
<div className="relative min-h-dvh overflow-x-hidden pt-14 lg:h-dvh lg:overflow-hidden lg:pt-0">
|
||||
<div className="relative text-foreground lg:h-full">
|
||||
<div className="flex flex-col lg:h-full lg:flex-row">
|
||||
{/* Left side — Enterprise hero */}
|
||||
<div className="hidden lg:block relative w-full lg:w-[40%] border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-y-auto overflow-x-hidden no-scrollbar px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block relative w-full shrink-0 lg:w-[40%] lg:h-full border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block">
|
||||
<HalftoneBackground />
|
||||
</div>
|
||||
@@ -142,7 +142,7 @@ export function EnterprisePageClient() {
|
||||
</div>
|
||||
|
||||
{/* Right side — Contact form */}
|
||||
<div className="relative w-full lg:w-[60%] overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="relative w-full lg:w-[60%] lg:h-full lg:overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="p-5 sm:p-6 lg:p-8 pt-8 lg:pt-16 pb-32 space-y-8 ">
|
||||
{/* Mobile header */}
|
||||
<div className="flex lg:hidden items-center gap-1.5">
|
||||
|
||||
@@ -201,11 +201,11 @@ export function ProductsShell({
|
||||
const isInfrastructure = tab === "infrastructure";
|
||||
|
||||
return (
|
||||
<div className="relative h-full overflow-x-hidden">
|
||||
<div className="relative text-foreground h-full">
|
||||
<div className="flex flex-col lg:flex-row h-full">
|
||||
<div className="relative min-h-dvh overflow-x-hidden pt-14 lg:h-dvh lg:overflow-hidden lg:pt-0">
|
||||
<div className="relative text-foreground lg:h-full">
|
||||
<div className="flex flex-col lg:h-full lg:flex-row">
|
||||
{/* Left side — Hero */}
|
||||
<div className="hidden lg:block relative w-full lg:w-[30%] border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block relative w-full shrink-0 lg:w-[30%] lg:h-full border-b lg:border-b-0 lg:border-r border-foreground/[0.06] overflow-hidden px-5 sm:px-6 lg:px-10">
|
||||
<div className="hidden lg:block">
|
||||
<HalftoneBackground />
|
||||
</div>
|
||||
@@ -237,7 +237,7 @@ export function ProductsShell({
|
||||
</div>
|
||||
|
||||
{/* Right side — Content */}
|
||||
<div className="relative w-full lg:w-[70%] overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="relative w-full lg:w-[70%] lg:h-full lg:overflow-y-auto overflow-x-hidden no-scrollbar">
|
||||
<div className="px-5 sm:px-6 lg:px-8 pt-16 lg:pt-16 pb-4">
|
||||
<AnimatePresence mode="wait">
|
||||
<motion.h2
|
||||
|
||||
Reference in New Issue
Block a user