mirror of
https://github.com/Buriburizaem0n/admin-frontend-domain.git
synced 2026-02-05 21:20:07 +00:00
Dashboard Redesign (#48)
* feat: add user_template setting * style: header * style: page padding * style: header * feat: header now time * style: login page * feat: nav indicator * style: button inset shadow * style: footer text size * feat: header show login_ip * fix: error toast * fix: frontend_templates setting * fix: lint * feat: pr auto format * chore: auto-fix linting and formatting issues --------- Co-authored-by: hamster1963 <hamster1963@users.noreply.github.com>
This commit is contained in:
@@ -1,40 +1,45 @@
|
||||
import { ProfileCard } from "@/components/profile"
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { useMainStore } from "@/hooks/useMainStore"
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
||||
import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "@/components/ui/card"
|
||||
import { useMediaQuery } from "@/hooks/useMediaQuery";
|
||||
import { Server, Boxes } from "lucide-react";
|
||||
import { useServer } from "@/hooks/useServer";
|
||||
import { ProfileCard } from "@/components/profile";
|
||||
import { useMediaQuery } from "@/hooks/useMediaQuery"
|
||||
import { useServer } from "@/hooks/useServer"
|
||||
import { Boxes, Server } from "lucide-react"
|
||||
|
||||
export default function ProfilePage() {
|
||||
const { profile } = useMainStore();
|
||||
const { servers, serverGroups } = useServer();
|
||||
const { profile } = useMainStore()
|
||||
const { servers, serverGroups } = useServer()
|
||||
const isDesktop = useMediaQuery("(min-width: 890px)")
|
||||
|
||||
return (
|
||||
profile && (
|
||||
<div className={`flex p-8 gap-4 ${isDesktop ? 'ml-6' : 'flex-col'}`}>
|
||||
<div className={`flex ${isDesktop ? 'flex-col mr-6' : 'gap-4 w-full items-center'}`}>
|
||||
<Avatar className={`${isDesktop ? 'h-[300px] w-[300px]' : 'h-[150px] w-[150px]'} border-foreground border-[1px]`}>
|
||||
<AvatarImage src={'https://api.dicebear.com/7.x/notionists/svg?seed=' + profile.username} alt={profile.username} />
|
||||
<div className={`flex p-8 gap-4 ${isDesktop ? "ml-6" : "flex-col"}`}>
|
||||
<div
|
||||
className={`flex ${isDesktop ? "flex-col mr-6" : "gap-4 w-full items-center"}`}
|
||||
>
|
||||
<Avatar
|
||||
className={`${isDesktop ? "h-[300px] w-[300px]" : "h-[150px] w-[150px]"} border-foreground border-[1px]`}
|
||||
>
|
||||
<AvatarImage
|
||||
src={
|
||||
"https://api.dicebear.com/7.x/notionists/svg?seed=" +
|
||||
profile.username
|
||||
}
|
||||
alt={profile.username}
|
||||
/>
|
||||
<AvatarFallback>{profile.username}</AvatarFallback>
|
||||
</Avatar>
|
||||
<div>
|
||||
<p className="justify-center text-3xl font-semibold">{profile.username}</p>
|
||||
<p className="text-gray-400">IP: {profile.login_ip || 'Unknown'}</p>
|
||||
<p className="text-gray-400">IP: {profile.login_ip || "Unknown"}</p>
|
||||
</div>
|
||||
{isDesktop &&
|
||||
{isDesktop && (
|
||||
<ProfileCard className="flex mt-4 justify-center items-center max-w-[300px] rounded-lg" />
|
||||
}
|
||||
)}
|
||||
</div>
|
||||
{!isDesktop &&
|
||||
{!isDesktop && (
|
||||
<ProfileCard className="flex justify-center items-center max-w-full rounded-lg" />
|
||||
}
|
||||
)}
|
||||
<div className="w-full">
|
||||
<div className="flex flex-col gap-4">
|
||||
<Card className="w-full">
|
||||
@@ -61,5 +66,5 @@ export default function ProfilePage() {
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user