github-starred/better-auth
2
0
Fork 0
mirror of https://github.com/better-auth/better-auth.git synced 2026-07-31 20:05:38 -05:00
Code Issues 2.5k Packages Projects Releases 112 Wiki Activity

docs: hero section alignment with feature section on big screens (#4018)

Browse Source 
* fix: hero section alignment with feature section on big screens

* fix

---------

Co-authored-by: Bereket Engida <Bekacru@gmail.com>
This commit is contained in:
KinfeMichael Tariku
2025-08-14 18:45:57 -07:00
committed by GitHub
co-authored by Bereket Engida
parent 1cbea683d8
commit dbaae0ab2b
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/components/features.tsx
+3 -3
View File
@@ -71,7 +71,7 @@ const features = [
export default function Features({ stars }: { stars: string | null }) {
return (
<div className="md:w-10/12 mt-10 mx-auto font-geist relative md:border-l-0 md:border-b-0 md:border-[1.2px] rounded-none -pr-2 dark:bg-black/[0.95]">
<div className="md:w-10/12 mt-10 mx-auto font-geist relative md:border-l-0 md:border-b-0 md:border-[1.2px] rounded-none -pr-2 dark:bg-black/[0.95] ">
<div className="w-full md:mx-0">
<div className="grid grid-cols-1 relative md:grid-rows-2 md:grid-cols-3 border-b-[1.2px]">
<div className="hidden md:grid top-1/2 left-0 -translate-y-1/2 w-full grid-cols-3 z-10 pointer-events-none select-none absolute">
@@ -82,7 +82,7 @@ export default function Features({ stars }: { stars: string | null }) {
<div
key={feature.id}
className={cn(
"justify-center border-l-[1.2px] md:min-h-[240px] border-t-[1.2px] md:border-t-0 transform-gpu flex flex-col p-10",
"justify-center border-l-[1.2px] md:min-h-[240px] border-t-[1.2px] md:border-t-0 transform-gpu flex flex-col p-10 2xl:p-12",
index >= 3 && "md:border-t-[1.2px]",
)}
>
@@ -117,7 +117,7 @@ export default function Features({ stars }: { stars: string | null }) {
<Testimonial />
</div>
<div className="relative col-span-3 border-t-[1.2px] border-l-[1.2px] md:border-b-[1.2px] dark:border-b-0 h-full py-20">
<div className="w-full h-full p-16 pt-10 md:px-10">
<div className="w-full h-full p-16 pt-10 md:px-10 2xl:px-16">
<div className="flex flex-col items-center justify-center w-full h-full gap-3">
<div className="flex items-center gap-2">
<Globe2Icon className="w-4 h-4" />
docs/components/landing/hero.tsx
+5 -5
View File
@@ -49,13 +49,13 @@ function TrafficLightsIcon(props: React.ComponentPropsWithoutRef<"svg">) {
export default function Hero() {
return (
<section className="max-h-[40rem] relative w-full md:w-11/12 md:mx-auto flex md:items-center md:justify-center dark:bg-black/[0.96] antialiased bg-grid-white/[0.02] overflow-hidden md:min-h-[40rem]">
<section className="max-h-[40rem] relative w-full flex md:items-center md:justify-center dark:bg-black/[0.96] antialiased bg-grid-white/[0.02] overflow-hidden md:min-h-[40rem]">
<Spotlight />
<div className="overflow-hidden bg-transparent md:px-10 dark:-mb-32 dark:mt-[-4.75rem] dark:pb-32 dark:pt-[4.75rem]">
<div className="lg:max-w-8xl mx-auto grid max-w-full grid-cols-1 items-center gap-x-8 gap-y-16 px-4 py-2 lg:grid-cols-2 lg:px-8 lg:py-4 xl:gap-x-16 xl:px-12">
<div className="relative z-10 md:text-center lg:text-left">
<div className="overflow-hidden px-2 bg-transparent dark:-mb-32 dark:mt-[-4.75rem] dark:pb-32 dark:pt-[4.75rem] md:w-10/12 mx-auto">
<div className="mx-auto grid lg:max-w-8xl xl:max-w-full grid-cols-1 items-center gap-x-8 gap-y-16 px-4 py-2 lg:grid-cols-2 lg:px-8 lg:py-4 xl:gap-x-16 xl:px-0">
<div className="relative z-10 text-left mt-0 sm:mt-2 md:mt-8 lg:mt-0 md:text-center lg:text-left">
<div className="relative">
<div className="flex flex-col items-start gap-2">
<div className="flex flex-col items-center lg:items-start gap-2">
<div className="flex items-end gap-1 mt-2 ">
<div className="flex items-center gap-1">
<svg