omswebsite-backups/oms-website-nextjs
1
0
Fork 0
mirror of https://github.com/OwethuManagedServices/oms-website-nextjs.git synced 2025-12-17 17:28:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor newsletter subscription form layout for better responsiveness

Browse Source
This commit is contained in:
JohannesOmsDev
2025-05-27 16:43:21 +02:00
parent b908926912
commit ae6e2b020c
1 changed files with 24 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
components/Footer.tsx
View File

@ -157,40 +157,39 @@ const Footer = () => {
</p> </p>
<form className="flex flex-col sm:flex-row gap-2"> <form className="flex flex-col sm:flex-row gap-2">
{/* Input needs dark background styles */} {/* Input needs dark background styles */}
<div className="relative"> <div className="relative max-w-md mx-auto w-full">
<input <input
type="email" type="email"
placeholder="Enter your email" placeholder="Enter your email"
aria-label="Email for newsletter" aria-label="Email for newsletter"
className=" className="
w-full w-full
pr-24 pr-24
px-4 py-2
px-4 py-2 rounded-lg
rounded-lg bg-[var(--dark-input)]
bg-[var(--dark-input)] border border-[var(--dark-border)]
border border-[var(--dark-border)] text-[var(--dark-foreground)]
text-[var(--dark-foreground)] placeholder:text-[var(--dark-muted-foreground)]
placeholder:text-[var(--dark-muted-foreground)] focus:outline-none focus:ring-2 focus:ring-ring
focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-[var(--oms-black)]
focus:ring-offset-2 focus:ring-offset-[var(--oms-black)] "
"
/> />
<button <button
type="submit" type="submit"
className=" className="
absolute top-0 right-0 absolute top-0 right-0
h-full h-full
px-4 px-4
rounded-r-lg rounded-r-lg
bg-[linear-gradient(to_right,#e6cd4b,#fff8b3,#e0b843)] bg-[linear-gradient(to_right,#e6cd4b,#fff8b3,#e0b843)]
text-primary-foreground text-primary-foreground
font-semibold font-semibold
hover:bg-opacity-90 hover:bg-opacity-90
transition-colors transition-colors
focus:outline-none focus:ring-2 focus:ring-ring focus:outline-none focus:ring-2 focus:ring-ring
focus:ring-offset-2 focus:ring-offset-[var(--oms-black)] focus:ring-offset-2 focus:ring-offset-[var(--oms-black)]
" "
> >
Subscribe Subscribe
</button> </button>