プロジェクト

全般

プロフィール

Enhancement(機能追加・改善) #1472

Global navigation becomes 2 lines when wide-font is used (幅広フォントの場合にグローバルナビゲーションが2行になる)

Minoru Takai13年以上前に追加. 12年以上前に更新.

ステータス:
Fixed(完了)
優先度:
Normal(通常)
担当者:
対象バージョン:
開始日:
2010-08-03
期日:
進捗率:

100%


説明

Overview

Mac OS などでは標準的な幅広のフォントが使われていると、グローバルナビゲーションが折り返されてしまう。
ナビゲーションをカスタマイズしていないプリセットの状態であっても折り返されているのは見栄えが悪いので改善したい。
折り返される実態は添付画像を参照してください。

Way to fix

ナビ項目の文言を変更して文字列を減らすことで対応することも可能ですが、対応前のマイナーバージョンと異なる文言にしてしまうことが気に掛かるので、ナビ項目の文字列を括る要素に指定されている横の余白を少なくすることで対応するのが好ましいと考えます。

Version

この問題が顕著化したのは、グローバルナビゲーションに「ランキング」という項目が追加された時点であると考えられます。

手元で確認した限りでは 3.2.x ではランキングは含まれておらず、 3.4.x から含まれているようです。
よって、 3.4.x 以上のバージョンが本件の対象になると考えられます。

  • 2010/09/29修正

バージョンについて、以前手元で確認した際に 3.4 に含まれると書きましたが、手元のソースをカスタマイズしており錯覚していました。

http://trac.openpne.jp/browser/OpenPNE3/bandled-plugins-list

バンドルプラグインリストに opRankingPlugin が含まれるのは以下の通りでした。(以下のリストは、上記バンドルプラグインリストのリポジトリをチェックアウトし、"opRankingPlugin" という文字列を含むファイル名を列挙した結果です)

3.5.3-dev.yml
3.5.3.yml
3.6beta1-dev.yml
3.6beta1.yml
3.6beta2-dev.yml
3.6beta2.yml
3.6beta3-dev.yml
3.6beta3.yml
3.6beta4-dev.yml
3.6beta4.yml
3.6beta5-dev.yml
3.6beta5.yml
3.6beta6-dev.yml
3.7.0-dev.yml

よって、(3.5.3 は除いて)3.6.x 以上のバージョンが本件の対象になると考えられます。

globalNav_inMac.png 表示 - Mac OS で確認した globalNav (ナビのボックスを灰色で着色しています) (52.4 KB) Minoru Takai, 2010-08-03 17:26


関連するチケット

関連している OpenPNE 3 - Backport(バックポート) #2262: Global navigation becomes 2 lines when wide-font is used (幅広フォントの場合にグローバルナビゲーションが2行になる) Fixed(完了) 2011-07-06

関係しているリビジョン

リビジョン 7085a17b (差分)
Minoru Takai12年以上前に追加

(fixed #1472) changed padding 10px to 8px, for globalNav > ul > li > a

履歴

#1 Minoru Takai12年以上前に更新

  • ステータスNew(新規) から Pending Review(レビュー待ち) に変更
  • 進捗率0 から 50 に変更

更新履歴 7085a17be5084193a5304646aa55e441f3a3695f で適用されました。

#2 Minoru Takai12年以上前に更新

  • 担当者Minoru Takai にセット

この問題は、共通テンプレートのデザインを見直すことが本質的な解決となりますが、とりあえず現状のデザインにおいて OpenPNE-3.6 系以上でインストール後にグローバルナビが2段になってしまうことを防ぐ修正を施します。

#globalNav li a に対して与えられている padding の左右の値を 10px から 8px に変更します。 8px という値は Mac OS で表示を確認しながら1段に収まるようにし、必要以上に padding が狭まらないようにと考えた値であり、これ以上の根拠はありません。

#3 Minoru Takai12年以上前に更新

  • ステータスPending Review(レビュー待ち) から Pending Testing(テスト待ち) に変更
  • 進捗率50 から 70 に変更

修正方針に対するコミット内容に問題はないと判断し、テスト待ちにステータスを変更します。

#4 Minoru Takai12年以上前に更新

この内容のテストについて

このチケットを作成した時点で問題となっていたことは次のものです。

  • OpenPNE 3.6 以上をインストールし、任意のメンバーでログインしたとき、ズームや文字サイズの拡大を行っていない場合でも Mac OS ではグローバルナビが2行になってしまう。
    • ブラウザは Safari, Firefox など(バージョンやブラウザの種類にかかわらず、Mac OS で一般的に使われるフォントであれば2行になる可能性が高いです。

なお、Windows OS であれば(一般的な)フォントの幅は Mac OS に比べて狭いので1行に収まっているようです。Windows でも Osaka フォントなどを適用すれば2行になります。

テストすべきは以下の2点です。

  • Mac OS で(ブラウザ側の設定でフォントサイズなどを特に変更しない状態で)マイページを表示した際に、(デフォルトのままの)グローバルナビが1行に収まる。
  • Windows OS など他の環境で、グローバルナビの項目間が異様に狭くなっていたり不自然な表示になっていない。

#5 Shingo Yamada12年以上前に更新

  • 360対象RC1 にセット

#6 Yuma Sakata12年以上前に更新

  • 360対象 を削除 (RC1)

#7 Yuma Sakata12年以上前に更新

  • 360対象RC1 にセット

#8 Yuma Sakata12年以上前に更新

  • ステータスPending Testing(テスト待ち) から Fixed(完了) に変更
  • 進捗率70 から 100 に変更

テストOKです。

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