GitHub-Dark icon indicating copy to clipboard operation
GitHub-Dark copied to clipboard

[Enhancement] Include uBlock Origin format

Open Mottie opened this issue 4 years ago • 3 comments

I discovered that uBlock Origin & AdGuard include support for adding CSS to a page - reference

What do you all think about building a list along with the auto-updates?

Here is the GitHub Wide example copied from the reference above:

! Title: GitHub Wide — uBlock Origin version
! Version: 11July2019v1
! Updates: 30 days

! Basic layout
github.com##.container:style(width: 100% !important; padding-right: 30px !important; padding-left: 30px !important)

! Responsive containers on some pages
github.com##.container-lg:style(max-width: 100% !important; padding-right: 30px !important; padding-left: 30px !important)
github.com##.container-xl:style(max-width: 100% !important; padding-right: 30px !important; padding-left: 30px !important)

! Match the header to container padding
github.com##.Header:style(padding-right: 30px !important; padding-left: 30px !important)

! Profile pages
github.com##.pinned-repo-item:style(width: calc(50% - 10px) !important)
github.com##.org-pinned-repos-list .pinned-repo-item:style(width: calc(33.3% - 10px) !important)
github.com##.u-photo:style(max-width: 250px)
github.com##.user-status-container:style(max-width: 250px)
github.com##.u-photo .avatar:style(width: 100% !important; height: auto !important)

! Repo-specific stuff
github.com##.repository-content:style(width: 100% !important)

! Undo container changes for the Projects tab on repos which have unnecessary nested container-lg's
github.com##.repository-content > .container-lg:style(padding-right: 0 !important; padding-left: 0 !important)

! Issues/PRs
github.com##.discussion-sidebar:style(width: 280px !important)
github.com##.discussion-timeline:style(width: calc(100% - 300px) !important)
! Undo for profile timeline 
github.com##.contribution-activity-listing .discussion-timeline:style(width: 100% !important)

! Fix #18 - props: @auscompgeek
github.com##.file-header:after:style(clear: left !important)

! Network graph
github.com###network:style(max-width: 730px)

! Issues & Dashboard
github.com###dashboard:style(position: relative !important)
github.com##.new-issue-form:style(position: relative !important)
github.com##.new-issue-form .discussion-sidebar:style(position: absolute !important; top: 0 !important; right: 0 !important)
github.com##button.discussion-sidebar-toggle:style(width: 100% !important)
github.com##.timeline-new-comment:style(max-width: none !important)
! Commits: extended message under "..."
github.com##.commit-desc pre:style(max-width: none)

! Alert messages
github.com###js-flash-container .flash-messages:style(width: 100% !important; padding-left: 30px !important; padding-right: 30px !important)

Mottie avatar May 31 '20 15:05 Mottie

Whats the benefit of this format? Isnt GHD long enough already?

the-j0k3r avatar May 31 '20 15:05 the-j0k3r

If there's a tool to convert CSS to that format, I could maybe see us publishing that format but it will not support customization from the looks of it. Also we'd lose the ability to regex-match domains and I have my doubts whether this format really supports all CSS features (keyframes, media queries and the like).

silverwind avatar May 31 '20 19:05 silverwind

The law of diminishing returns, ublock origin users shouldnt load complex styles like this in that format, not only what @silverwind said, also it just adds confusion when ppl report issues on this style and those issues are caused by ublock origin stylesheets.

I for one dont have time (which is increasingly shorter these days) to guess/troubleshoot/support something like this.

Stylus is the right tool for the job not ublock origin. So I'll say this is too much work for any very very very small gains if any.

the-j0k3r avatar Jun 09 '20 08:06 the-j0k3r