Spaces:
Running
Running
overflow xs
Browse files- app/page.tsx +1 -1
- components/form.tsx +2 -2
app/page.tsx
CHANGED
@@ -15,7 +15,7 @@ export default function Home() {
|
|
15 |
</h2>
|
16 |
</header>
|
17 |
</Form>
|
18 |
-
<div className="w-full lg:w-[400px] h-[400px] bg-gradient-to-br from-amber-300 to-amber-600 absolute left-0 top-0 -z-[1] blur-[
|
19 |
</section>
|
20 |
);
|
21 |
}
|
|
|
15 |
</h2>
|
16 |
</header>
|
17 |
</Form>
|
18 |
+
<div className="w-full lg:w-[400px] h-[400px] bg-gradient-to-br from-amber-300 to-amber-600 absolute left-0 top-0 -z-[1] blur-[100px] lg:blur-[230px]" />
|
19 |
</section>
|
20 |
);
|
21 |
}
|
components/form.tsx
CHANGED
@@ -154,7 +154,7 @@ export const Form = ({ children }: { children: React.ReactNode }) => {
|
|
154 |
onChange={(value) => setForm({ ...form, mood: value })}
|
155 |
/>
|
156 |
</div>
|
157 |
-
<div>
|
158 |
<div className="w-full sticky top-0">
|
159 |
<div className="border rounded-xl p-6 bg-stone-900/40 border-white/5">
|
160 |
<p className="text-amber-200 font-semibold text-xs uppercase mb-3">
|
@@ -227,7 +227,7 @@ export const Form = ({ children }: { children: React.ReactNode }) => {
|
|
227 |
</div>
|
228 |
<div
|
229 |
className={classNames(
|
230 |
-
"fixed lg:right-10
|
231 |
{
|
232 |
"opacity-0 pointer-events-none translate-y-full": modelLoaded,
|
233 |
}
|
|
|
154 |
onChange={(value) => setForm({ ...form, mood: value })}
|
155 |
/>
|
156 |
</div>
|
157 |
+
<div className="max-lg:pb-12">
|
158 |
<div className="w-full sticky top-0">
|
159 |
<div className="border rounded-xl p-6 bg-stone-900/40 border-white/5">
|
160 |
<p className="text-amber-200 font-semibold text-xs uppercase mb-3">
|
|
|
227 |
</div>
|
228 |
<div
|
229 |
className={classNames(
|
230 |
+
"fixed lg:right-10 w-[calc(100%-24px)] max-lg:top-6 lg:bottom-10 max-lg:left-1/2 max-lg:-translate-x-1/2 z-20 lg:w-full max-w-sm border rounded-xl p-6 bg-stone-950 lg:bg-amber-900/10 border-white/10 overflow-hidden transition-all duration-200",
|
231 |
{
|
232 |
"opacity-0 pointer-events-none translate-y-full": modelLoaded,
|
233 |
}
|