Improve shop UX, starting balance, and top bar branding.
Give new users 100 free points, allow shop previews regardless of balance, rename clothing items with descriptive labels, and show only the HaBit logo in the top-left.
This commit is contained in:
@@ -3,7 +3,6 @@
|
||||
import { usePathname } from "next/navigation";
|
||||
|
||||
import { HabitBrand } from "@/components/layout/habit-brand";
|
||||
import { HomeLogoLink } from "@/components/layout/home-logo-link";
|
||||
import { routes } from "@/lib/routes";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
@@ -26,12 +25,8 @@ export function AppTopBar({ className }: AppTopBarProps) {
|
||||
paddingTop: "env(safe-area-inset-top, 0px)",
|
||||
}}
|
||||
>
|
||||
<div className="mx-auto flex h-full max-w-6xl items-center justify-between px-4">
|
||||
<HomeLogoLink
|
||||
className="mt-0"
|
||||
aria-current={isHome ? "page" : undefined}
|
||||
/>
|
||||
<HabitBrand />
|
||||
<div className="mx-auto flex h-full max-w-6xl items-center px-4">
|
||||
<HabitBrand aria-current={isHome ? "page" : undefined} />
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
|
||||
@@ -1,25 +1,35 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
|
||||
import { routes } from "@/lib/routes";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const HABIT_LOGO_SRC = "/habit-logo.png";
|
||||
|
||||
type HabitBrandProps = {
|
||||
className?: string;
|
||||
href?: string;
|
||||
"aria-current"?: "page" | undefined;
|
||||
};
|
||||
|
||||
export function HabitBrand({ className }: HabitBrandProps) {
|
||||
export function HabitBrand({
|
||||
className,
|
||||
href = routes.avatar,
|
||||
"aria-current": ariaCurrent,
|
||||
}: HabitBrandProps) {
|
||||
const [useText, setUseText] = useState(false);
|
||||
|
||||
return (
|
||||
<div
|
||||
<Link
|
||||
href={href}
|
||||
aria-label="Go to home"
|
||||
aria-current={ariaCurrent}
|
||||
className={cn(
|
||||
"flex shrink-0 items-center justify-center border-2 border-border bg-card/80 px-3 py-1.5 shadow-[var(--retro-shadow-sm)]",
|
||||
"group flex shrink-0 items-center justify-center border-2 border-border bg-card/80 px-3 py-1.5 shadow-[var(--retro-shadow-sm)] transition-transform hover:-translate-y-0.5 hover:border-primary/60",
|
||||
className,
|
||||
)}
|
||||
aria-label="HaBit"
|
||||
>
|
||||
{!useText ? (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
@@ -37,6 +47,6 @@ export function HabitBrand({ className }: HabitBrandProps) {
|
||||
HaBit
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user