Enhancement（機能追加・改善） #1472
完了
Global navigation becomes 2 lines when wide-font is used (幅広フォントの場合にグローバルナビゲーションが2行になる)
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 以上のバージョンが本件の対象になると考えられます。
ファイル
Minoru Takai さんが13年以上前に更新
- ステータス を New（新規） から Pending Review（レビュー待ち） に変更
- 進捗率 を 0 から 50 に変更
更新履歴 7085a17be5084193a5304646aa55e441f3a3695f で適用されました。
Minoru Takai さんが13年以上前に更新
- 担当者 を Minoru Takai にセット
この問題は、共通テンプレートのデザインを見直すことが本質的な解決となりますが、とりあえず現状のデザインにおいて OpenPNE-3.6 系以上でインストール後にグローバルナビが2段になってしまうことを防ぐ修正を施します。
#globalNav li a に対して与えられている padding の左右の値を 10px から 8px に変更します。 8px という値は Mac OS で表示を確認しながら1段に収まるようにし、必要以上に padding が狭まらないようにと考えた値であり、これ以上の根拠はありません。
Minoru Takai さんが13年以上前に更新
- ステータス を Pending Review（レビュー待ち） から Pending Testing（テスト待ち） に変更
- 進捗率 を 50 から 70 に変更
修正方針に対するコミット内容に問題はないと判断し、テスト待ちにステータスを変更します。
Minoru Takai さんが13年以上前に更新
この内容のテストについて¶
このチケットを作成した時点で問題となっていたことは次のものです。
- 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 など他の環境で、グローバルナビの項目間が異様に狭くなっていたり不自然な表示になっていない。
Yuma Sakata さんが約13年前に更新
- ステータス を Pending Testing（テスト待ち） から Fixed（完了） に変更
- 進捗率 を 70 から 100 に変更
テストOKです。