Remove leftover arc overhang spacer below tab bars
SubHeaderBar switched to ArcBackground variant="rect" (commit 207794e7)
when navigation was restyled with V-angled bars, but 15 pages still
rendered a 20px ARC_OVERHANG_PX spacer div directly below the tab bar
to leave room for the now-removed downward arc. That spacer is the
empty band the user reported underneath the tabs.
Drop the spacer divs and their now-unused ARC_OVERHANG_PX imports across
Feed, Search, Notifications, Profile, Videos, Photos, Relay, Letters,
Music, ExternalContent, ArticleEditor, PeopleListDetail, BadgeDetail,
Communities, and Badges. FollowPage keeps the import because it still
renders an actual <ArcBackground variant="down" /> at the top of its
profile feed scrollbox.
This commit is contained in:
@@ -13,7 +13,6 @@ import { Skeleton } from '@/components/ui/skeleton';
|
||||
import { ComposeBox } from '@/components/ComposeBox';
|
||||
import { NoteCard } from '@/components/NoteCard';
|
||||
import { FlatThreadedReplyList } from '@/components/ThreadedReplyList';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { useAuthor } from '@/hooks/useAuthor';
|
||||
@@ -232,7 +231,6 @@ export function BadgeDetailContent({ event }: { event: NostrEvent }) {
|
||||
</SubHeaderBar>
|
||||
|
||||
{/* Tab content */}
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
{activeTab === 'awarded' ? (
|
||||
<AwardedToTab
|
||||
awardedPubkeys={awardedPubkeys}
|
||||
|
||||
@@ -23,7 +23,6 @@ import { useWorldFeed } from '@/hooks/useWorldFeed';
|
||||
import { shouldHideFeedEvent } from '@/lib/feedUtils';
|
||||
import { isEventMuted } from '@/lib/muteHelpers';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { useNavHidden } from '@/contexts/LayoutContext';
|
||||
@@ -281,7 +280,6 @@ export function Feed({ kinds, tagFilters, header, hideCompose, emptyMessage, fee
|
||||
)}
|
||||
|
||||
{/* Feed content — saved feed tab gets its own stream */}
|
||||
{user && <div style={{ height: ARC_OVERHANG_PX }} />}
|
||||
{activeSavedFeed ? (
|
||||
<SavedFeedContent feed={activeSavedFeed} />
|
||||
) : (
|
||||
|
||||
@@ -37,7 +37,6 @@ import { VerifiedNip05Text } from '@/components/Nip05Badge';
|
||||
import { AddMembersDialog } from '@/components/AddMembersDialog';
|
||||
import { ComposeBox } from '@/components/ComposeBox';
|
||||
import { FlatThreadedReplyList } from '@/components/ThreadedReplyList';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { PostActionBar } from '@/components/PostActionBar';
|
||||
import { NoteMoreMenu } from '@/components/NoteMoreMenu';
|
||||
import { FollowAllSplitButton } from '@/components/FollowAllSplitButton';
|
||||
@@ -513,9 +512,6 @@ export function PeopleListDetailContent({ event }: { event: NostrEvent }) {
|
||||
/>
|
||||
</SubHeaderBar>
|
||||
|
||||
{/* Spacer below the pinned tabs (matches ProfilePage / BadgeDetailContent). */}
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Owner "Add members" row — above members tab content */}
|
||||
{ownerCanRemove && activeTab === 'members' && (
|
||||
<div className="px-4 py-3 border-b border-border">
|
||||
|
||||
@@ -36,7 +36,6 @@ import {
|
||||
AlertDialogTitle,
|
||||
} from '@/components/ui/alert-dialog';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { FabButton } from '@/components/FabButton';
|
||||
import { toast } from '@/hooks/useToast';
|
||||
@@ -559,8 +558,6 @@ export function ArticleEditor({ initialData, editMode = false }: ArticleEditorPr
|
||||
/>
|
||||
</SubHeaderBar>
|
||||
</div>
|
||||
{/* Spacer for the arc overhang */}
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
<input
|
||||
ref={fileInputRef}
|
||||
|
||||
@@ -180,9 +180,6 @@ export function BadgesPage() {
|
||||
</SubHeaderBar>
|
||||
)}
|
||||
|
||||
{/* Arc overhang spacer (matches Feed.tsx) */}
|
||||
{user && <div style={{ height: 20 }} />}
|
||||
|
||||
{/* Tab content */}
|
||||
{activeTab === "mine" ? (
|
||||
<MyBadgesTab
|
||||
|
||||
@@ -122,9 +122,6 @@ export function CommunitiesPage() {
|
||||
</SubHeaderBar>
|
||||
)}
|
||||
|
||||
{/* Arc overhang spacer */}
|
||||
{user && <div style={{ height: 20 }} />}
|
||||
|
||||
{/* Tab content */}
|
||||
{activeTab === 'mine' ? (
|
||||
<MyCommunitiesTab />
|
||||
|
||||
@@ -17,7 +17,6 @@ import { BookReviewFormDialog } from '@/components/BookReviewForm';
|
||||
import { ProfileHoverCard } from '@/components/ProfileHoverCard';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import {
|
||||
UrlContentHeader,
|
||||
BookContentHeader,
|
||||
@@ -598,7 +597,6 @@ function BookContentTabs({ isbn, commentRoot, orderedReplies, commentsLoading }:
|
||||
onClick={() => setActiveTab('reviews')}
|
||||
/>
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{activeTab === 'comments' ? (
|
||||
<ExternalCommentsSection
|
||||
|
||||
@@ -17,7 +17,6 @@ import { LoginArea } from '@/components/auth/LoginArea';
|
||||
import { PageHeader } from '@/components/PageHeader';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { EnvelopeCard } from '@/components/letter/EnvelopeCard';
|
||||
import { LetterDetailSheet } from '@/components/letter/LetterDetailSheet';
|
||||
import type { Letter } from '@/lib/letterTypes';
|
||||
@@ -111,7 +110,6 @@ export function LettersPage() {
|
||||
<TabButton label="Inbox" active={tab === 'inbox'} onClick={() => setTab('inbox')} />
|
||||
<TabButton label="Sent" active={tab === 'sent'} onClick={() => setTab('sent')} />
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Envelope grid */}
|
||||
<div className="px-4 py-3">
|
||||
|
||||
@@ -5,7 +5,6 @@ import { KindInfoButton } from '@/components/KindInfoButton';
|
||||
import { PageHeader } from '@/components/PageHeader';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { useLayoutOptions } from '@/contexts/LayoutContext';
|
||||
import { useAppContext } from '@/hooks/useAppContext';
|
||||
import { useCurrentUser } from '@/hooks/useCurrentUser';
|
||||
@@ -61,7 +60,6 @@ export function MusicPage() {
|
||||
<TabButton label="Playlists" active={activeTab === 'playlists'} onClick={() => setActiveTab('playlists')} />
|
||||
<TabButton label="Artists" active={activeTab === 'artists'} onClick={() => setActiveTab('artists')} />
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Tab content */}
|
||||
{activeTab === 'discover' && (
|
||||
|
||||
@@ -43,7 +43,6 @@ import { BadgeContent } from '@/components/BadgeContent';
|
||||
import type { BadgeData } from '@/lib/parseBadgeDefinition';
|
||||
import { PageHeader } from '@/components/PageHeader';
|
||||
import { useLayoutOptions } from '@/contexts/LayoutContext';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
|
||||
type NotificationTab = 'all' | 'mentions';
|
||||
|
||||
@@ -233,7 +232,6 @@ export function NotificationsPage() {
|
||||
/>
|
||||
))}
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Content */}
|
||||
<PullToRefresh onRefresh={handleRefresh}>
|
||||
|
||||
@@ -17,7 +17,6 @@ import {
|
||||
MediaCollage,
|
||||
MediaCollageSkeleton,
|
||||
} from "@/components/MediaCollage";
|
||||
import { ARC_OVERHANG_PX } from "@/components/ArcBackground";
|
||||
import { PageHeader } from "@/components/PageHeader";
|
||||
import { PullToRefresh } from "@/components/PullToRefresh";
|
||||
import { SubHeaderBar } from "@/components/SubHeaderBar";
|
||||
@@ -138,7 +137,6 @@ export function PhotosFeedPage() {
|
||||
onClick={() => setActiveTab("global")}
|
||||
/>
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Grid */}
|
||||
<PullToRefresh onRefresh={handleRefresh}>
|
||||
|
||||
@@ -85,7 +85,6 @@ import { formatNumber } from '@/lib/formatNumber';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { useActiveTabIndicator } from '@/components/SubHeaderBarContext';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import type { AddrCoords } from '@/hooks/useEvent';
|
||||
import { sanitizeUrl } from '@/lib/sanitizeUrl';
|
||||
import { impactMedium } from '@/lib/haptics';
|
||||
@@ -2003,8 +2002,6 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
|
||||
)}
|
||||
</SubHeaderBar>
|
||||
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Add/edit single tab modal */}
|
||||
{pubkey && (
|
||||
<ProfileTabEditModal
|
||||
|
||||
@@ -4,7 +4,6 @@ import { Globe, Info, Mail, Shield, Zap, Server, Hash } from 'lucide-react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import { useNostr } from '@nostrify/react';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { NoteCard } from '@/components/NoteCard';
|
||||
import { PageHeader } from '@/components/PageHeader';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
@@ -110,8 +109,6 @@ export function RelayPage() {
|
||||
<RelayInfoPanel info={info} infoLoading={infoLoading} infoError={infoError} open={infoOpen} />
|
||||
<SubHeaderBar>{null}</SubHeaderBar>
|
||||
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Feed section */}
|
||||
<div>
|
||||
{eventsLoading ? (
|
||||
|
||||
@@ -48,7 +48,6 @@ import { genUserName } from '@/lib/genUserName';
|
||||
import { VerifiedNip05Text } from '@/components/Nip05Badge';
|
||||
import { SubHeaderBar } from '@/components/SubHeaderBar';
|
||||
import { TabButton } from '@/components/TabButton';
|
||||
import { ARC_OVERHANG_PX } from '@/components/ArcBackground';
|
||||
import { cn, parseKindFilter } from '@/lib/utils';
|
||||
import type { TabFilter } from '@/contexts/AppContext';
|
||||
import { useLayoutOptions, useNavHidden } from '@/contexts/LayoutContext';
|
||||
@@ -425,7 +424,6 @@ export function SearchPage() {
|
||||
<TabButton label="Posts" active={activeTab === 'posts'} onClick={() => setActiveTab('posts')} />
|
||||
<TabButton label="Accounts" active={activeTab === 'accounts'} onClick={() => setActiveTab('accounts')} />
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Search input bar — always rendered right after tabs, like ComposeBox on Feed */}
|
||||
<div className="px-4 py-3">
|
||||
|
||||
@@ -22,7 +22,6 @@ import { nip19 } from "nostr-tools";
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { Blurhash } from "react-blurhash";
|
||||
import { Link } from "react-router-dom";
|
||||
import { ARC_OVERHANG_PX } from "@/components/ArcBackground";
|
||||
import { FeedEmptyState } from "@/components/FeedEmptyState";
|
||||
import { KindInfoButton } from "@/components/KindInfoButton";
|
||||
import { PageHeader } from "@/components/PageHeader";
|
||||
@@ -950,7 +949,6 @@ export function VideosFeedPage() {
|
||||
onClick={() => setFeedTab("global")}
|
||||
/>
|
||||
</SubHeaderBar>
|
||||
<div style={{ height: ARC_OVERHANG_PX }} />
|
||||
|
||||
{/* Live streams strip — follows tab filters by followed authors */}
|
||||
<LiveStreamsStrip tab={feedTab} />
|
||||
|
||||
Reference in New Issue
Block a user