web-dev-qa-db-ja.com

GitHubでタブサイズを変更する方法

GitHubでファイルを表示すると、タブが8つのスペースとして表示されます。

例:

example

この構成を2つまたは4つのスペースに変更することは可能ですか?

246
Misha Moroshko

更新

はい。 mortenpiで述べられているように、これは追加のクエリパラメーターによって実行できます。詳細については his answer をご覧ください。

元の答え

この構成を2つまたは4つのスペースに変更することは可能ですか?

いいえ。 Ace エディターを使用して編集機能の一部としてのみ使用でき、変更は保持されません。

この ブログ投稿 は、組み込みIDEに関する詳細情報を提供します。

ただし、確認するブロブ(ファイル)のURLがわかっている場合は、blobを変更することで簡単に編集モードに切り替えることができますeditセグメントのあるセグメントを選択し、ドロップダウンを使用して好みのタブサイズを選択します。

tabSize

19
nulltoken

?ts=2または?ts=4をURLに追加して、タブサイズを変更できます。

例: https://github.com/jquery/jquery/blob/master/src/core.js?ts=2

値は1〜12の範囲であるようです。ただし、Gistsや生のファイルビューでは機能しません。

ソース: GitHub Cheat Sheet

313
mortenpi

リポジトリのデフォルトの表示タブサイズを設定します

リポジトリに 。editorconfig がある場合、GitHubでコードを表示するときにそれを尊重します。

indent_style = tabおよびindent_size = 4は、8列ではなく4列のタブを表示します https://github.com/isaacs/github/issues/170#issuecomment-150489692

例.editorconfig JetBrainsの製品で動作する複数の拡張機能の場合:

root = true

[*]
end_of_line = lf
insert_final_newline = true

# Matches multiple files with brace expansion notation
[*.{js,jsx,html,sass}]
charset = utf-8
indent_style = tab
indent_size = 4
trim_trailing_whitespace = true

[*.md]
trim_trailing_whitespace = false

他のリポジトリのタブの表示方法を変更する

ブラウザに stylish をインストールし、インストール GitHub:コード内のタブのサイズを大きくする をインストールします。

Google Chrome拡張機能もあります。

242
rofrol

実際には、ブラウザ拡張機能を使用して実行できます。 スタイリッシュ (in Firefox または Chrome )をインストールしてから、このユーザースタイルをインストールします:“ GitHub:コード内のタブのサイズを改善 」。

一部の言語では機能しない場合があります。たとえば、JavaScriptファイルを表示していましたが、変更に気付きませんでした。そこで、著者のスタイルを削除し、次の行を追加しました。

.tab-size {
  -webkit-tab-size: 4 !important;
     -moz-tab-size: 4 !important;
       -o-tab-size: 4 !important;
          tab-size: 4 !important;
}

そして、Chrome( screenshot )で機能しました。

スクリーンショットからわかるように、ワイドスクリーンモードも有効にして、配色をSolarizedに変更しました。 Chromeのスタイリッシュな拡張機能 を使用して、GitHubページで3つのユーザースタイルを実行しています。これが誰かの役に立つことを願っています。

66
aledujke

UserScriptsに興味があるなら、これは私のためにそれをしました:

// ==UserScript==
// @name         GitHub Tabs
// @namespace    http://foldoc.org/
// @version      1
// @description  Set sensible tabs on GitHub
// @author       Denis Howe
// @match        https://github.com/*
// ==/UserScript==

document.querySelectorAll('table').forEach(t => { t.dataset.tabSize = 2 });
0
Denis Howe

Stylishのアップデートを以下に示します。 .tab-sizeを.diff-viewerに置き換えたaledujkeの答えです。

.diff-viewer {
  -webkit-tab-size: 4 !important;
     -moz-tab-size: 4 !important;
       -o-tab-size: 4 !important;
          tab-size: 4 !important;
}
0
Aaron