revert: remove header neon rails
Pulls out the left/right vertical rails and the top horizontal connector along with the supporting CSS.
This commit is contained in:
@@ -243,8 +243,7 @@ export default function Header() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bb-header-rails relative">
|
||||
<div className="bb-header-top-rail" aria-hidden />
|
||||
<div className="relative">
|
||||
{/* TOP BAR */}
|
||||
<div className="max-w-container mx-auto px-4">
|
||||
<div className="bg-[#1a2535] border-b border-[#2a3a50] h-8 flex items-center justify-between">
|
||||
|
||||
@@ -1545,46 +1545,6 @@ h1, h2, h3 {
|
||||
border-color: #00d4ff !important;
|
||||
}
|
||||
|
||||
/* ─── Header neon rails ──────────────────────────────────────────────────
|
||||
Two vertical neon-green lines pinned to the left + right edges of the
|
||||
centered max-w-container (1200px), running from the very top of the
|
||||
site down to the bottom of the browse bar. They line up exactly with
|
||||
the horizontal neon-green border under the "search all content
|
||||
sitewide" row, framing the whole header as a single bracket. */
|
||||
.bb-header-rails::before,
|
||||
.bb-header-rails::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 1px;
|
||||
background: rgba(0, 255, 159, 0.55);
|
||||
box-shadow: 0 0 2px rgba(0, 255, 159, 0.25);
|
||||
pointer-events: none;
|
||||
/* Must beat the sticky main-nav (z-50) and ticker sub-bars so the line
|
||||
paints across every sub-bar background, not behind them. */
|
||||
z-index: 60;
|
||||
}
|
||||
.bb-header-rails::before { left: max(12px, calc((100% - 1200px) / 2 + 12px)); }
|
||||
.bb-header-rails::after { right: max(12px, calc((100% - 1200px) / 2 + 12px)); }
|
||||
/* Top horizontal connector — closes the bracket along the very top of
|
||||
the site between the two vertical rails. */
|
||||
.bb-header-top-rail {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: max(12px, calc((100% - 1200px) / 2 + 12px));
|
||||
right: max(12px, calc((100% - 1200px) / 2 + 12px));
|
||||
height: 1px;
|
||||
background: rgba(0, 255, 159, 0.55);
|
||||
box-shadow: 0 0 2px rgba(0, 255, 159, 0.25);
|
||||
pointer-events: none;
|
||||
z-index: 61;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.bb-header-rails::before, .bb-header-rails::after,
|
||||
.bb-header-top-rail { display: none; }
|
||||
}
|
||||
|
||||
/* ─── Article body — NYT/WaPo-classy typography ──────────────────────────
|
||||
Apply this class alongside the existing `prose prose-invert` on the
|
||||
article body render in /news/[slug] and /articles/[slug]. */
|
||||
|
||||
Reference in New Issue
Block a user