profile page extensions

This commit is contained in:
ashprit
2024-10-27 04:22:42 +00:00
parent cce9632b5f
commit cc65a7e82a
8 changed files with 85 additions and 117 deletions

View File

@@ -11,6 +11,11 @@ import {
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { motion } from 'framer-motion';
import { PreviousTicketComponent } from './previousTicket';
interface profileProps {
profileKey: string;
}
// Dark theme and animation setup
const cardVariants = {
@@ -18,7 +23,7 @@ const cardVariants = {
visible: { opacity: 1, y: 0 },
};
const Profile = () => {
const Profile = ({ profileKey }: profileProps) => {
return (
<motion.div
initial="hidden"
@@ -32,42 +37,21 @@ const Profile = () => {
initial={{ opacity: 0, y: -10 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: 0.1, duration: 0.5 }}
>
<CardTitle className="text-lg font-semibold">Profile</CardTitle>
</motion.div>
></motion.div>
</CardHeader>
<CardContent>
<form>
<div className="grid w-full items-center gap-4">
<motion.div
className="flex flex-col space-y-1.5"
initial={{ opacity: 0, x: -10 }}
animate={{ opacity: 1, x: 0 }}
transition={{ delay: 0.2, duration: 0.4 }}
>
<Label htmlFor="name" className="text-gray-300">
Name
</Label>
<Input
id="name"
placeholder="Name"
className="bg-[#2b3a4a] text-white placeholder-gray-400"
/>
</motion.div>
<motion.div
className="flex flex-col space-y-1.5"
initial={{ opacity: 0, x: -10 }}
animate={{ opacity: 1, x: 0 }}
transition={{ delay: 0.3, duration: 0.4 }}
>
<Label htmlFor="framework" className="text-gray-300">
MetaMask Public Key
<Label htmlFor="framework" className="text-gray-300 text-lg">
MetaMask Public Key:
</Label>
<Input
id="name"
placeholder="Key"
className="bg-[#2b3a4a] text-white placeholder-gray-400"
/>
<Label id="name">{'#9383r]3r32r2rni20r9'}</Label>
</motion.div>
</div>
</form>
@@ -77,11 +61,7 @@ const Profile = () => {
initial={{ opacity: 0, y: 10 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: 0.4, duration: 0.4 }}
>
<Button className="bg-[#365b85] text-white hover:bg-[#2b4a70]">
Save
</Button>
</motion.div>
></motion.div>
</CardFooter>
</Card>
</motion.div>