プロジェクト

全般

プロフィール

チケット一覧のヘッダー行を固定

あゆみ さんが9日前に追加

Googleのスプシのようにヘッダー行固定とかすると便利そう・・と思って
AIに聞きながらViewCustomizeで編集したところ、以下の方法でうまくいったので共有です〜〜
みなさんも何かいいカスタマイとかあれば教えてほしいですm(_ _)m

ChatGPTには「スプレッドシートのヘッダー行固定機能のようなものをRedmineのチケット一覧で対応したい!ViewCustomizeでCustomizeできますか?画面のスクロールは動かないよう固定してほしいです」
と伝えてみました(^o^)

適用したい範囲が人によって異なると思うので。。チケット一覧ページであれば全域で、、クエリが適用された状態でものような条件で確認してみました。

パスのパターン (?:^|/)(?:projects/[^/]+/)?issues(?:$|?)
挿入位置 全ページのヘッダ
種別 CSS

/* issues#index 固定ヘッダー & スクロール統一 */

/* 1) ページ本体は縦スクロールさせない(スクロール担当は .autoscroll) */
body.controller-issues.action-index #content {
  overflow-y: visible !important;  /* ← これが効けば sticky 復活 */
  overflow-x: hidden !important;   /* ページ全体の横スクロールは抑止 */
  min-width: 0 !important;         /* flex 子のはみ出し防止(Redmineのレイアウト対策) */
}

/* 2) 表コンテナが縦横スクロールを担当 */
.controller-issues .autoscroll {
  max-height: 70vh;
  overflow: auto;
  position: relative;               /* sticky の基準 */
}

/* 3) sticky を邪魔する overflow:hidden を無効化(念のため) */
body.controller-issues.action-index table.list.issues {
  overflow: visible !important;
}

/* 4) ヘッダー固定 */
.controller-issues table.list.issues thead th {
  position: sticky;
  top: 0;                           /* 必要ならメニュー高に合わせて調整 */
  z-index: 2;
  background: #fff;
}

いいね!0