// ───────────────────────────────────────────────────────────────────────────── // Page: File Co-change Coupling (.cp-* layout) // File: src/scss/pages/_coupling.scss // // STRUCTURAL LAYOUT ONLY — zero colors, zero typography here. // Visual rules live in components/_coupling.scss. // ───────────────────────────────────────────────────────────────────────────── .cp-wrap { padding: 0; } // ── Intel page header ───────────────────────────────────────────────────────── .intel-page-header { margin-bottom: 1.25rem; } // ── Filter bar ──────────────────────────────────────────────────────────────── .cp-filter-bar { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; } .cp-filter-group { display: flex; align-items: center; gap: 0.4rem; } // ── Pair list ───────────────────────────────────────────────────────────────── .cp-list { display: flex; flex-direction: column; } .cp-pair-row { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 0.35rem 0.75rem; padding: 0.75rem 1rem; align-items: center; } // ── File path pair — inline ─────────────────────────────────────────────────── .cp-files { grid-column: 1; grid-row: 1; display: flex; align-items: baseline; gap: 0.5rem; min-width: 0; overflow: hidden; font-family: var(--font-mono); font-size: 0.8rem; } .cp-file-a, .cp-file-b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 1; } // ── Count ───────────────────────────────────────────────────────────────────── .cp-count { grid-column: 2; grid-row: 1; flex-shrink: 0; align-self: center; } // ── Bar ─────────────────────────────────────────────────────────────────────── .cp-bar-wrap { grid-column: 1 / span 2; grid-row: 2; } .cp-bar-track { width: 100%; height: 3px; }