mirror of
https://github.com/rishikanthc/Scriberr.git
synced 2026-03-03 00:27:01 +00:00
more mods
This commit is contained in:
committed by
Rishikanth Chandrasekaran
parent
14e0c54f21
commit
0393bfe617
@@ -121,22 +121,22 @@ export function Header({ onFileSelect, onMultiTrackClick, onDownloadComplete }:
|
||||
};
|
||||
|
||||
return (
|
||||
<header className="sticky top-6 z-50 glass rounded-[var(--radius-card)] px-6 py-4 mb-8 transition-all duration-500 shadow-[var(--shadow-float)] border border-[var(--border-subtle)]">
|
||||
<header className="sticky top-4 sm:top-6 z-50 glass rounded-[var(--radius-card)] px-4 py-3 sm:px-6 sm:py-4 transition-all duration-500 shadow-[var(--shadow-float)] border border-[var(--border-subtle)]">
|
||||
<div className="flex items-center justify-between">
|
||||
{/* Left side - Logo navigates home */}
|
||||
<ScriberrLogo onClick={handleHomeClick} />
|
||||
|
||||
{/* Right side - Plus (Add Audio), Grip Menu, Theme Switcher */}
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="flex items-center gap-2 sm:gap-3">
|
||||
{/* Add Audio (icon-only) */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button
|
||||
variant="default"
|
||||
size="icon"
|
||||
className="bg-transparent hover:bg-[var(--brand-light)] text-[var(--brand-solid)] border border-[var(--brand-solid)] h-10 w-10 rounded-[var(--radius-btn)] shadow-none transition-all hover:scale-105 active:scale-95 cursor-pointer"
|
||||
className="bg-transparent hover:bg-[var(--brand-light)] text-[var(--brand-solid)] border border-[var(--brand-solid)] h-8 w-8 sm:h-10 sm:w-10 rounded-[var(--radius-btn)] shadow-none transition-all hover:scale-105 active:scale-95 cursor-pointer"
|
||||
>
|
||||
<Plus className="h-5 w-5" />
|
||||
<Plus className="h-4 w-4 sm:h-5 sm:w-5" />
|
||||
<span className="sr-only">Add audio</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
@@ -237,9 +237,9 @@ export function Header({ onFileSelect, onMultiTrackClick, onDownloadComplete }:
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-10 w-10 hover:bg-[var(--secondary)] rounded-[var(--radius-btn)] cursor-pointer text-[var(--text-secondary)]"
|
||||
className="h-8 w-8 sm:h-10 sm:w-10 hover:bg-[var(--secondary)] rounded-[var(--radius-btn)] cursor-pointer text-[var(--text-secondary)]"
|
||||
>
|
||||
<Grip className="h-5 w-5" />
|
||||
<Grip className="h-4 w-4 sm:h-5 sm:w-5" />
|
||||
<span className="sr-only">Open menu</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
|
||||
@@ -12,7 +12,7 @@ export function Layout({ children }: LayoutProps) {
|
||||
|
||||
return (
|
||||
<div className="min-h-screen">
|
||||
<div className="mx-auto w-full max-w-6xl px-4 sm:px-6 lg:px-8 pb-12">
|
||||
<div className="mx-auto w-full max-w-6xl px-3 sm:px-6 lg:px-8 pb-12 space-y-4 sm:space-y-8">
|
||||
<Header onFileSelect={handleFileSelect} />
|
||||
<main className="animate-fade-in">
|
||||
{children}
|
||||
|
||||
@@ -33,7 +33,7 @@ export function ScriberrLogo({ className = "", onClick }: { className?: string;
|
||||
height="159.8615"
|
||||
viewBox="0 0 206.37398 159.8615"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-8 sm:h-10 w-auto select-none transition-all duration-300"
|
||||
className="h-6 sm:h-9 w-auto select-none transition-all duration-300"
|
||||
aria-label="Scriberr Icon"
|
||||
>
|
||||
<defs>
|
||||
@@ -53,7 +53,7 @@ export function ScriberrLogo({ className = "", onClick }: { className?: string;
|
||||
</svg>
|
||||
|
||||
{/* Text Logo */}
|
||||
<ScriberrTextLogo className="h-6 sm:h-7 w-auto" />
|
||||
<ScriberrTextLogo className="h-4 sm:h-6 w-auto" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -139,17 +139,17 @@ export const AudioDetailView = function AudioDetailView({ audioId: propAudioId }
|
||||
{/*
|
||||
1. Header Redesign:
|
||||
- Using shared Header component for consistency
|
||||
- Padding matches Dashboard (px-6)
|
||||
- Padding matches Dashboard (px-6) -> Reduced for mobile
|
||||
*/}
|
||||
<div className="max-w-[960px] mx-auto w-full px-6 py-8">
|
||||
<div className="max-w-[960px] mx-auto w-full px-3 py-4 sm:px-6 sm:py-8">
|
||||
<Header
|
||||
onFileSelect={() => { }} // No file upload in detail view
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Main Content */}
|
||||
<main className="flex-1 px-6 pb-32 max-w-[960px] mx-auto w-full">
|
||||
<div className="mx-auto space-y-8">
|
||||
<main className="flex-1 px-3 sm:px-6 pb-32 max-w-[960px] mx-auto w-full">
|
||||
<div className="mx-auto space-y-6 sm:space-y-8">
|
||||
|
||||
{/*
|
||||
2. Metadata Section (New):
|
||||
@@ -158,7 +158,7 @@ export const AudioDetailView = function AudioDetailView({ audioId: propAudioId }
|
||||
- Metadata Row (Date, Status, Actions)
|
||||
- Generous whitespace
|
||||
*/}
|
||||
<div className="space-y-6 pt-4">
|
||||
<div className="space-y-4 sm:space-y-6">
|
||||
{/* Top Row: Back Button REMOVED (Redundant) */}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user