I fixed the "hide" link for posts on Reddit and now all I see is fresh content

remmargorp64 · 2 hours ago

I'm someone who likes to hide posts on Reddit after I see them. That way, I never have to worry about seeing the same stuff over and over when I load reddit later. With this technique, the ONLY thing I see are fresh posts.

One problem: The "hide" link on posts is tiny, and appears in a different location under each post (depending on how many comments that post has, etc).

After suffering with this annoyance for over 10 years, I finally fixed the issue by deploying a custom CSS snippet inside of Reddit Enhancement Suite.

And here is the CSS code snippet, in case anyone wants to use it for their own RES config:

    /* Only apply custom hide button styling on listing pages */
    .listing-page .entry {
       position: relative;
       padding-right: 100px;
    }
    
    .listing-page .top-matter {
       margin-right: 10px;
    }
    
    .listing-page .hide-button {
       position: absolute;
       transform: translateY(-50%);
       width: 100px;
       height: 94%;
       right: 4px;
       top: 48%;
       margin-bottom: 5px;
    }
    
    .listing-page .hide-button a {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 100%;
       height: 100%;
       background: #1a1a1b;
       color: #909090;
       border-radius: 3px;
       text-decoration: none;
       font-size: 14px;
       font-weight: 500;
       border: 1px solid #343536;
       transition: all 0.2s ease;
    }
    
    .listing-page .hide-button a:hover {
       background: #272729;
       color: #d7dadc;
       border-color: #d7dadc;
    }

Where to put the CSS snippet:

RES settings console → Appearance → Stylesheet Loader (stylesheet) → Load Stylesheets (loadStylesheets)

Side note: I highly recommend combining this with the "Fix Hide Links" and "Hide Link Instant" feature toggles in Reddit Enhancement Suite. Clicking the "hide" link to a post should just instantly hide the post.

reply

remmargorp64 · 2 hours ago

And here is a bonus CSS Snippet to plug into your RES config. You will never guess what it does:

.promotedlink { display: none !important; }

reply