Spaces:
Running
Running
Claude commited on
feat: bannière ASCII art PICARONES en 6px au-dessus du menu
Browse files- ASCII art 6 lignes en Courier New à font-size 6px (~38px de hauteur)
- Couleur turquoise (--accent), fond beige assorti aux fenêtres
- Sous-titre "OCR/HTR Benchmark Platform" en 9px uppercase
- Centré horizontalement, line-height 1.0 pour compacité
- Caché sur mobile (<768px) via media query
- user-select: none pour éviter la sélection accidentelle
https://claude.ai/code/session_01UtY7QGAcj2M7pAyU2nvzvn
- picarones/web/app.py +10 -0
- picarones/web/static/retro.css +32 -0
picarones/web/app.py
CHANGED
|
@@ -1589,6 +1589,16 @@ _HTML_TEMPLATE = r"""<!DOCTYPE html>
|
|
| 1589 |
</head>
|
| 1590 |
<body>
|
| 1591 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1592 |
<div id="header">
|
| 1593 |
<h1 data-i18n="app_title">Picarones <span class="version" id="app-version"></span></h1>
|
| 1594 |
<nav id="nav">
|
|
|
|
| 1589 |
</head>
|
| 1590 |
<body>
|
| 1591 |
|
| 1592 |
+
<div id="ascii-banner">
|
| 1593 |
+
<pre>██████╗ ██╗ ██████╗ █████╗ ██████╗ ██████╗ ███╗ ██╗███████╗███████╗
|
| 1594 |
+
██╔══██╗██║██╔════╝██╔══██╗██╔══██╗██╔═══██╗████╗ ██║██╔════╝██╔════╝
|
| 1595 |
+
██████╔╝██║██║ ███████║██████╔╝██║ ██║██╔██╗ ██║█████╗ ███████╗
|
| 1596 |
+
██╔═══╝ ██║██║ ██╔══██║██╔══██╗██║ ██║██║╚██╗██║██╔══╝ ╚════██║
|
| 1597 |
+
██║ ██║╚██████╗██║ ██║██║ ██║╚██████╔╝██║ ╚████║███████╗███████║
|
| 1598 |
+
╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═╝╚═╝ ╚═╝ ╚═════╝ ╚═╝ ╚═══╝╚══════╝╚══════╝</pre>
|
| 1599 |
+
<span class="ascii-subtitle">OCR/HTR Benchmark Platform</span>
|
| 1600 |
+
</div>
|
| 1601 |
+
|
| 1602 |
<div id="header">
|
| 1603 |
<h1 data-i18n="app_title">Picarones <span class="version" id="app-version"></span></h1>
|
| 1604 |
<nav id="nav">
|
picarones/web/static/retro.css
CHANGED
|
@@ -48,6 +48,38 @@ body {
|
|
| 48 |
a { color: var(--accent); text-decoration: none; }
|
| 49 |
a:hover { text-decoration: underline; }
|
| 50 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 51 |
/* ── Menu Bar ────────────────────────────────────────────────────────────── */
|
| 52 |
#header {
|
| 53 |
background: var(--win-bg);
|
|
|
|
| 48 |
a { color: var(--accent); text-decoration: none; }
|
| 49 |
a:hover { text-decoration: underline; }
|
| 50 |
|
| 51 |
+
/* ── ASCII Art Banner ────────────────────────────────────────────────────── */
|
| 52 |
+
#ascii-banner {
|
| 53 |
+
background: var(--win-bg);
|
| 54 |
+
border-bottom: 1px solid var(--border-light);
|
| 55 |
+
text-align: center;
|
| 56 |
+
padding: 6px 0 2px;
|
| 57 |
+
overflow: hidden;
|
| 58 |
+
}
|
| 59 |
+
#ascii-banner pre {
|
| 60 |
+
font-family: 'Courier New', 'Consolas', monospace;
|
| 61 |
+
font-size: 6px;
|
| 62 |
+
line-height: 1.0;
|
| 63 |
+
margin: 0;
|
| 64 |
+
color: var(--accent);
|
| 65 |
+
letter-spacing: -0.5px;
|
| 66 |
+
display: inline-block;
|
| 67 |
+
user-select: none;
|
| 68 |
+
}
|
| 69 |
+
#ascii-banner .ascii-subtitle {
|
| 70 |
+
display: block;
|
| 71 |
+
font-family: var(--font-ui);
|
| 72 |
+
font-size: 9px;
|
| 73 |
+
font-weight: 600;
|
| 74 |
+
color: var(--text-muted);
|
| 75 |
+
letter-spacing: 2px;
|
| 76 |
+
text-transform: uppercase;
|
| 77 |
+
margin-top: 1px;
|
| 78 |
+
}
|
| 79 |
+
@media (max-width: 768px) {
|
| 80 |
+
#ascii-banner { display: none; }
|
| 81 |
+
}
|
| 82 |
+
|
| 83 |
/* ── Menu Bar ────────────────────────────────────────────────────────────── */
|
| 84 |
#header {
|
| 85 |
background: var(--win-bg);
|