summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorsoryu-co <bot@soryu.co>2026-05-06 15:24:01 +0000
committersoryu-co <bot@soryu.co>2026-05-06 15:24:01 +0000
commit27d8b9e2aa07bc38a134d0d3c9a6488ec423bfb1 (patch)
tree5496ea1f9aa27d39eca9dc3a892975eeb627556f
parentc99ad2bcc75e330fc66d78452d604747cf2d3443 (diff)
downloadsoryu-27d8b9e2aa07bc38a134d0d3c9a6488ec423bfb1.tar.gz
soryu-27d8b9e2aa07bc38a134d0d3c9a6488ec423bfb1.zip
Remove vertical accent rule from Mission/MAKIMA text columns
The 2px amber/magenta border-left + 18px indent on the right-column text was reading as another border running parallel to the SVG image on the left. The animated SVG already supplies all the framing the panels need, so the rule is now redundant noise. Removed in three places: - .mission-screen wrapper (base + .makima-screen variant) - desktop (>=1025px) per-block rule on headline + paragraph - mobile (<=768px) leftover padding-left: 14px on headline Verified: borderLeft = 0 on wrapper, headline, and paragraph(s) on both Mission and MAKIMA. Headline + body now sit flush with the badge at the same column edge (x=680 at 1280px).
-rw-r--r--frontend/src/styles/heisei.css28
1 files changed, 11 insertions, 17 deletions
diff --git a/frontend/src/styles/heisei.css b/frontend/src/styles/heisei.css
index e90e492..3ccec4d 100644
--- a/frontend/src/styles/heisei.css
+++ b/frontend/src/styles/heisei.css
@@ -407,16 +407,15 @@ body { background: var(--hz-night); color: var(--hz-ink); }
7. Mission / Makima screens — Heisei magazine column
---------------------------------------------------------------- */
-/* Move the accent rule + indent onto the wrapper so headline, image,
- and body share one consistent column edge */
+/* No more wrapper-level accent rule — body text sits flat without a
+ coloured indent line (the SVG owns the only visible frame on the page) */
.mission-screen {
gap: 20px;
- padding-left: 18px;
- border-left: 2px solid var(--hz-amber);
+ padding-left: 0;
+ border-left: 0;
max-width: 720px;
}
.mission-screen.makima-screen {
- border-left-color: var(--hz-mag);
gap: 14px;
}
@@ -485,11 +484,12 @@ body { background: var(--hz-night); color: var(--hz-ink); }
/* SVG owns its frame — keep only the soft drop-shadow for elevation */
box-shadow: 0 24px 60px -24px rgba(8, 10, 24, 0.85);
}
- /* Right-column text: each block owns its own accent rule */
+ /* Right-column text: no accent rule — keep the layout clean.
+ The SVG image on the left supplies all the framing. */
.mission-screen .mission-headline,
.mission-screen .mission-paragraph {
- padding-left: 18px;
- border-left: 2px solid var(--hz-amber);
+ padding-left: 0;
+ border-left: 0;
margin: 0;
}
.mission-screen .mission-headline + .mission-paragraph {
@@ -498,16 +498,10 @@ body { background: var(--hz-night); color: var(--hz-ink); }
.mission-screen .mission-paragraph + .mission-paragraph {
margin-top: 8px;
}
- /* Makima — magenta rule */
- .mission-screen.makima-screen .mission-headline,
- .mission-screen.makima-screen .mission-paragraph {
- border-left-color: var(--hz-mag);
- }
- /* Badge: align with the rule's left edge, sit above the headline.
- JSX order is headline→badge→…; reorder visually with flex order. */
+ /* Badge: align with the rest of the right-column flow (no indent). */
.mission-screen.makima-screen .makima-badge {
align-self: flex-start;
- margin: 0 0 12px 18px;
+ margin: 0 0 12px 0;
order: -1;
}
.mission-screen.makima-screen .mission-headline { order: 0; }
@@ -820,7 +814,7 @@ body { background: var(--hz-night); color: var(--hz-ink); }
.modern-landing-page.manga-style .masthead-vertical .jp { font-size: 24px; }
.modern-landing-page.manga-style .masthead-vertical .en { font-size: 8px; }
- .mission-headline { font-size: 22px; padding-left: 14px; }
+ .mission-headline { font-size: 22px; padding-left: 0; }
.mission-paragraph { font-size: 13px; }
.modern-landing-page.manga-style .hero::after { font-size: 9px; letter-spacing: 0.2em; }