プロジェクト

全般

プロフィール

Bug(バグ) #1107

ニックネームが長いと日記詳細画面で表示が崩れる

Mutsumi Imamuraほぼ14年前に追加. 13年以上前に更新.

ステータス:
New(新規)
優先度:
Normal(通常)
担当者:
-
対象バージョン:
-
開始日:
2010-05-25
期日:
進捗率:

0%

3.6 で発生するか:
Yes
[QA]バグ通知済:
いいえ
3.8 で発生するか:
Unknown (未調査)

説明

Overview (現象)

ニックネームが長いと日記詳細画面で表示が崩れる

再現環境

  • OpenPNE3.4.x

その他のバージョンは未確認です。

再現方法

  1. ニックネームを「0123456789abcdefghijklmnopqrstuvwxyzABCD」のように長く設定する(40文字)
  2. 日記詳細画面にアクセスする

Causes (原因)

Way to fix (修正内容)

nickname_long_2010-5-25_19-20.png 表示 - ニックネーム長い場合 (28.3 KB) Mutsumi Imamura, 2010-05-25 19:21

履歴

#1 Minoru Takaiほぼ14年前に更新

OpenPNE2.12 以上では、見出し部に背景画像を用いておらず、文字列が長い場合には折り返して複数行になるという仕様になっています。

3系の opDiaryPlugin のCSSを確認しました。

  • opDiaryPlugin/web/css/diary.css 470行目付近
    /*----------------------------------------------
     * Parts Heading
     *--------------------------------------------*/
    div.partsHeading {
      margin-bottom: 5px;
      padding: 2px 8px 2px 10px;
      height: 30px;
      background: transparent url(../images/bg_parts_heading_720.gif) no-repeat 0 0;
      line-height: 26px;
      color: #FFFFFF;
      font-size: 100%;
      text-align: left;
    }
    

少なくとも日本語設定の場合は「$nicknameさんの日記」という文言が見出しに使われているため、$nickname (名前)が長ければ見出しの末尾を省略・隠すという対応は好ましくないと思われます(「さんの日記」という部分は表示すべきであるはずなので)。

このことを考えると、名前が長い場合には折り返すことを想定するか、名前自体を(チケットの例であれば「0123456789abc... さんの日記」のように)適当な長さで trim すべきです。

折り返しを想定するのであれば、以下のようなCSSの修正が現時点で提案できます。

div.partsHeading {
  margin-bottom: 5px;
  padding: 0px 8px 0px 10px;
  background: transparent url(../images/bg_parts_heading_720.gif) no-repeat 0 0;
  line-height: 30px;
  color: #FFFFFF;
  font-size: 100%;
  text-align: left;
}
  • 上下の padding を 0 にする
  • height プロパティ指定をしない
  • line-height プロパティ値を 30px にする(見出しが1行のときの背景画像の表示部分の高さ)
  • ../images/bg_parts_heading_720.gif を加工して、見出しが2行以上になる場合に表示される背景部分を用意する(背景画像の下方を作る)
    • この画像自体は、opDiaryPlugin 以外でも使われている共通のファイルなので、opDiaryPlugin が独自に対応するのであれば独自のファイルとして扱う必要があります。

これは、現状のデザインに対して修正する形ですが、抜本的にデザインを見直すという対応も考えられます。

本件は、バグ修正というよりも仕様改定の内容と考えられるので、対応はプラグイン作者あるいは有志にお任せします。

#2 Mutsumi Imamuraほぼ14年前に更新

  • プロジェクトOpenPNE 3 から opDiaryPlugin に変更

#3 Mutsumi Imamuraほぼ14年前に更新

opDiaryPlugin1.2.0で再現を確認しました。

#4 Rimpei Ogawa13年以上前に更新

  • 3.6 で発生するかYes にセット

他の形式にエクスポート: Atom PDF