← Wszystkie wpisy

Poradniki

Poprawki GitHuba i stron dla programistów z JustZix

17 maja 2026 · autor JustZix Team

Jeśli czytasz kod cały dzień, domyślny układ GitHuba marnuje przestrzeń: wąskie kolumny diffów, nagłówki plików, które się przewijają, paski boczne, których nigdy nie używasz. Reguły JustZix ograniczone do github.com pozwalają dostroić doświadczenie czytania bez flag przeglądarki czy rozszerzeń, których nie możesz zaudytować.

Wykorzystaj pełną szerokość okna

GitHub ogranicza szerokość treści na wielu stronach. Na szerokim monitorze zostawia to ogromne puste marginesy wokół cienkiej kolumny kodu. Utwórz regułę CSS pasującą do *://github.com/* i odzyskaj przestrzeń.

/* Pozwol stronom repo i kodu rozciagnac sie na obszar widoku */
.container-xl,
.container-lg,
.repository-content {
  max-width: 100% !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

To zmiana wyłącznie układu. Nic w nawigacji ani funkcjonalności się nie rusza — po prostu przestajesz wpatrywać się w puste rynny.

Przypnij nagłówek pliku podczas przewijania

Gdy przewijasz przez długi plik, nagłówek z nazwą pliku, blame i linkami raw znika. Przyklejony nagłówek zachowuje twój kontekst. GitHub już oznacza pasek akcji pliku, więc potrzebujesz tylko pozycjonowania.

/* Utrzymaj pasek akcji pliku widocznym */
.file-header,
.react-blob-header-edit-and-raw-actions {
  position: sticky !important;
  top: 0;
  z-index: 20;
  background: var(--bgColor-default, #fff) !important;
}

W widoku diffu ten sam pomysł przypina nagłówek każdego pliku, więc zawsze wiesz, do którego pliku należy fragment:

/* Przyklejone naglowki per plik w diffach pull requestow */
.file.js-file .file-header {
  position: sticky !important;
  top: 0;
  z-index: 5;
}

Większy, czytelniejszy kod

Domyślny rozmiar czcionki kodu jest w porządku do przeglądania, mniej do recenzji. Zwiększ go i ściśnij wysokość wiersza w jednej regule.

/* Wygodna typografia kodu */
.blob-code-inner,
.react-code-text,
.CodeMirror,
pre code {
  font-size: 14px !important;
  line-height: 1.6 !important;
}

Wybierz rozmiar pasujący do twojego ekranu. Ponieważ reguła jest ograniczona do GitHuba, nigdy nie dotyka bloków kodu na innych stronach.

Ukryj to, czego nie używasz

Wiele paneli GitHuba to czysty hałas w codziennej pracy — odznaka "Używane przez", przyciski sponsorów, feed aktywności na twoim pulpicie. Przytnij je.

/* Balagan paska bocznego repo */
.BorderGrid-cell:has(a[href$="/network/dependents"]),
.js-sponsors-button,
.flash-warn.flash-full { display: none !important; }

Dostosuj listę do gustu — każda linia jest niezależna, więc usunięcie jednego selektora odkrywa tylko ten panel.

Skocz do diffu jednym naciśnięciem

Niewielka reguła JavaScript może dodać skrót. Ogranicz regułę JS do *://github.com/*/pull/* i naciśnij d, by przewinąć prosto do karty "Files changed".

document.addEventListener('keydown', (e) => {
  // Ignoruj pisanie w polach input i textarea.
  const tag = (e.target.tagName || '').toLowerCase();
  if (tag === 'input' || tag === 'textarea' || e.target.isContentEditable) {
    return;
  }
  if (e.key === 'd') {
    const filesTab = document.querySelector('a[href$="/files"]');
    if (filesTab) filesTab.click();
  }
});

Czyta tylko zdarzenia klawiszy i klika istniejący link — żadnych żądań sieci, nic nigdzie zapisywane. Czysta wygoda.

Zbuduj własny profil dla programisty

To samo podejście działa na GitLabie, MDN, Stack Overflow czy dowolnej stronie dokumentacji: ogranicz regułę CSS do domeny, poszerz treść, napraw typografię, ukryj chrome. Trzymaj reguły każdej strony osobno, by przeprojektowanie jednej nigdy nie zepsuło innej.

Znajdź więcej przepisów skupionych na programistach w naszych gotowych przykładach, a jeśli przychodzisz z menedżera userscriptów, przeczytaj migracja z Tampermonkey do JustZix. Gotowy zacząć? Pobierz JustZix i wklej najpierw regułę pełnej szerokości.