ui(footer): move "Built with hubris" byline into LeftSidebar

Pulled the hubris/Roman-year line out of the TopBar and into a new
Footer component rendered below the Settings button in the left
sidebar bottom panel, where it reads as a quiet attribution rather
than competing with the title plate up top.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-15 22:11:00 +02:00
parent 68d8a6d064
commit b9916866b3
3 changed files with 30 additions and 22 deletions

View File

@@ -0,0 +1,26 @@
const ROMAN_PAIRS: [number, string][] = [
[1000, 'M'], [900, 'CM'], [500, 'D'], [400, 'CD'],
[100, 'C'], [90, 'XC'], [50, 'L'], [40, 'XL'],
[10, 'X'], [9, 'IX'], [5, 'V'], [4, 'IV'], [1, 'I'],
]
function toRoman(n: number): string {
let result = ''
for (const [value, symbol] of ROMAN_PAIRS) {
while (n >= value) {
result += symbol
n -= value
}
}
return result
}
/** Slim end-of-page byline — sits below every section's content as a
* quiet attribution line. */
export function Footer() {
return (
<div className="px-2 pt-1 text-right text-[9px] font-serif italic text-text-faint">
Built with hubris · {toRoman(new Date().getFullYear())}
</div>
)
}

View File

@@ -27,6 +27,7 @@ import {
Download as DownloadIcon,
} from 'lucide-react'
import { DateRangePicker } from '../filter/DateRangePicker'
import { Footer } from './Footer'
import { cn } from '@/lib/utils'
import { sourceFolders, photos as photosApi, downloads, type FolderTreeNode } from '../../services/api'
import { useMutation, useQueryClient } from '@tanstack/react-query'
@@ -639,6 +640,7 @@ export function LeftSidebar() {
const showOnFolders =
isSectionHeader && item.id === 'folders' && scanActivity.active
const showOnFolderRow =
scanActivity.isScanning &&
!!item.path &&
!!scanActivity.currentFolder &&
scanActivity.currentFolder.startsWith(item.path)
@@ -943,6 +945,8 @@ export function LeftSidebar() {
Settings
</button>
)}
<Footer />
</div>
<DeleteFolderDialog

View File

@@ -7,23 +7,6 @@ const MULIMAGO_ASCII = `▖ ▖ ▜ ▘
▛▖▞▌▌▌▐ ▌▛▛▌▀▌▛▌█▌
▌▝ ▌▙▌▐▖▌▌▌▌█▌▙▌▙▖`
const ROMAN_PAIRS: [number, string][] = [
[1000, 'M'], [900, 'CM'], [500, 'D'], [400, 'CD'],
[100, 'C'], [90, 'XC'], [50, 'L'], [40, 'XL'],
[10, 'X'], [9, 'IX'], [5, 'V'], [4, 'IV'], [1, 'I'],
]
function toRoman(n: number): string {
let result = ''
for (const [value, symbol] of ROMAN_PAIRS) {
while (n >= value) {
result += symbol
n -= value
}
}
return result
}
/**
* Slim top bar — animated walking mule on the left over a tiled desert
* backdrop. Sidebar toggle buttons live on the FilterBar.
@@ -65,11 +48,6 @@ export function TopBar() {
{MULIMAGO_ASCII}
</pre>
</div>
<div className="flex items-center gap-2">
<span className="text-[10px] font-serif text-black/80">
Built with hubris {toRoman(new Date().getFullYear())}
</span>
</div>
</header>
)
}