Hacker News new | ask | show | jobs
by humblebee 2185 days ago
Ya, I didn't understand this design choice. For a while I've had some custom css which also extends the width of the main content on github as well because I've always found reading some github issues with logs in them challenging.

This is the css I'm running now to fix this, as well as extend the width of the main content. The 1600px is such that when using i3 and having my browser be half the screen it consumes most of the screen space on my 4k monitor.

    :root {
        --width: 1600px;
    }

    .container-xl {
        max-width: var(--width);
    }
    .pagehead {
        padding-left: calc(50% - (var(--width) / 2));
        padding-right: calc(50% - (var(--width) / 2));
    }
3 comments

To center everything I added:

  .col-md-9 {
      width: 100%;
      margin-top: 1em;
  }

  .col-md-3 {
      width: 100% !important;
      margin-bottom: 1em;
  }

  .flex-md-row {
      flex-direction: column!important;
  }

  .flex-md-row {
      flex-direction: column-reverse!important;
  }

  .BorderGrid--spacious .BorderGrid-cell {
      padding-top: .2em;
      padding-bottom: .2em;
  }

  div.BorderGrid.BorderGrid--spacious > div:not(:first-child) {
      display: none;
  }
How can I use this code snippet? Apologies if it's obvious to everyone.
People have suggested extensions here, which is fine, but Firefox also supports this natively via custom css files that it can load for you on startup. They can be used for both styling Firefox itself and for modifying websites' styling.

https://superuser.com/a/319322/1173126 (be sure to read the comments of that answer too, these days you need to switch a flag in Ff settings to enable this feature)

You can use Stylus (https://addons.mozilla.org/en-US/firefox/addon/styl-us/) to add custom CSS to websites.
On Chrome, I use an extension called 'Stylebot'. Not sure about other platforms.
You can use Stylus on Firefox (and Chrome, too.)
Thank you, this works perfectly.