Code blocks not rendered properly in smaller screens

オープン
#367 コメント 3 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
35/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
停滞
技術スタック
css
領域
frontend, web-dev

調査の方向性

リンク先の Git Developer Pages サイトにある「git log --oneline improvements」セクションから始め、スクリーンショットに示されている iPhone SE の解像度でレイアウトを再現してください。コードブロックに影響するレスポンシブスタイルを確認してください。完了の条件は、ページ全体にオーバーフローや空白を発生させず、コード自体が水平方向にスクロールすることです。

索引モデルが issue の本文から書いたものです。

説明

I noticed an issue in which the code block in the "git log --oneline improvements" section renders badly in smaller screen. Further it also breaks the single-pagedness of the website. As a consequence, one might have to zoom in to read the post and scrolling might take you to empty space in the right. Screen shots:

  • Desktop view:
    Screenshot from 2019-03-10 20-56-49

  • Mobile view (iPhone SE resolution)
    Screenshot from 2019-03-10 20-56-14

    Screenshot from 2019-03-10 21-03-46

    Note the scroll bar in the bottom of the page.

It would be nice to fix this by making the code blocks render in such a way that the code within the block is scrollable rather than the whole page being scrollable.

Note: Initially mentioned in https://github.com/git/git.github.io/pull/366#issuecomment-471316738

主要言語
CSS
スター
373
フォーク
325
平均マージ
4日 18時間
マージ済み PR（30日）
1

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

git/git.github.io のほかの issue

git/git.github.io の issue をすべて見る

似ている issue

Web Dev の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。