Skip to content

Instantly share code, notes, and snippets.

@LunarTwilight
Last active June 30, 2023 10:02
Show Gist options
  • Save LunarTwilight/44c05e0a7d6163ec3266e0283aec1e8c to your computer and use it in GitHub Desktop.
Save LunarTwilight/44c05e0a7d6163ec3266e0283aec1e8c to your computer and use it in GitHub Desktop.
/* ==UserStyle==
@name Github redesign fixes
@namespace github.com/openstyles/stylus
@version 2.0.0
@description Fixes various issues with Github's redesign
@author LunarTwilight
@updateURL https://gist.github.com/LunarTwilight/44c05e0a7d6163ec3266e0283aec1e8c/raw/github-redesign-fixes.user.css
@preprocessor less
@var color background "Readme header background color" #f1f8ff
@var color border "Readme header border color" #e6e4e4
@var text paddingRegular "Amount of padding used on the header on regular pages" 66.5px
@var text paddingFullWidth "Amount of padding used on the header on full width pages" 32px
@var checkbox readme "Enable giving the readme header a background" 1
==/UserStyle== */
@-moz-document domain("github.com") {
/* Make header not full width */
.padding(@amount) {
.AppHeader > div {
padding-left: @amount;
padding-right: @amount;
}
}
body:not(.notifications-v2) {
&:not(.full-width) {
.padding(@paddingRegular);
}
&.full-width {
.padding(@paddingFullWidth);
}
}
/*
- Readme header background
- Make the bottom of the readme not have extra padding
*/
#readme {
> div:first-child when (@readme = 1) {
background-color: @background !important;
border-bottom: 1px solid @border !important;
}
> div:last-child {
padding-bottom: 8px !important;
}
}
}
@afontenot
Copy link

Thanks for this, it's the best one I've been able to find so far. I forked it and added several changes which improve the alignment a bit and also align the header when you're logged in. Feel free to use them or not, as you like. https://gist.github.com/afontenot/212cfb0e7f8eb90bac683509b6a0c68d

@LunarTwilight
Copy link
Author

LunarTwilight commented Sep 10, 2020

@afontenot Ah thanks, kinda surprised that people other than just me use it heh. I looked at your changes and incorporated the change for resizing the header to match the page content width. The header(s?) are a bit wider than the page content for gists, but I think that if I were to make them smaller I might run into issues with the username + gist title length.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment