Skip to content

Implement code changes to enhance functionality and improve performance #182

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
swastik-apk wants to merge 1 commit into from
Closed

Implement code changes to enhance functionality and improve performance #182

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 16 additions & 3 deletions src/components/Hero.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -127,10 +127,23 @@ export function Hero() {
</h2>
<div className="mt-9 flex justify-center gap-4 xl:justify-start">
<Link
className="rounded-full bg-sky-300 px-4 py-2 text-sm font-semibold text-slate-900 hover:bg-sky-200 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-300/50 active:bg-sky-500"
className="group relative inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-sky-400 to-blue-500 px-6 py-3 text-base font-bold text-white shadow-lg shadow-sky-500/25 transition-all duration-300 hover:scale-105 hover:shadow-xl hover:shadow-sky-500/40 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-400 active:scale-95"
href="/docs"
>
Get Started
<span>Get Started</span>
<svg
className="h-6 w-6 transition-transform duration-300 group-hover:translate-x-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
strokeWidth={2}
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M13 7l5 5m0 0l-5 5m5-5H6"
/>
</svg>
</Link>
<Link
className="flex items-center gap-1 rounded-full bg-white bg-opacity-[0.08] px-4 py-1 text-sm font-semibold text-white transition-all duration-200 hover:bg-opacity-[.15]"
Expand Down Expand Up @@ -159,7 +172,7 @@ export function Hero() {
className={`text-sky-400`}
>
{' '}
block our calendar.
Block our calendar.
</Link>
</div>
</div>
Expand Down
5 changes: 3 additions & 2 deletions src/components/QuickLinks.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,13 @@ export function QuickLink({ title, description, icon, href }) {
return (
<Container
href={href}
className={`group relative rounded-xl border border-slate-200 dark:border-slate-800 block ${
className={`group relative rounded-xl border border-slate-200 dark:border-slate-800 block transition-all duration-300 ease-out hover:scale-110 hover:-translate-y-4 hover:shadow-2xl hover:shadow-slate-900/30 dark:hover:shadow-slate-900/50 ${
href ? 'no-underline hover:cursor-pointer' : ''
}`}
style={{ zIndex: 1 }}
>
<div className="absolute -inset-px rounded-xl border-2 border-transparent opacity-0 [background:linear-gradient(var(--quick-links-hover-bg,theme(colors.sky.50)),var(--quick-links-hover-bg,theme(colors.sky.50)))_padding-box,linear-gradient(to_top,theme(colors.indigo.400),theme(colors.cyan.400),theme(colors.sky.500))_border-box] group-hover:opacity-100 dark:[--quick-links-hover-bg:theme(colors.slate.800)]" />
<div className="relative overflow-hidden rounded-xl p-6">
<div className="relative overflow-hidden rounded-xl p-6 h-full">
<Icon icon={icon} className="h-8 w-8" />
<h2 className="mt-4 font-display text-base text-slate-900 dark:text-white">
{title}
Expand Down
Loading