Not very customizable? I would appreciate it if you could open an issue on GitHub as I might need to tweak. I don't moderate/use everything reddit offers.
Reddit: Re-imagined by misspent
Details
Authormisspent
LicenseMIT
Categoryreddit
Created
Updated
Size196 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
This is currently a work in progress, and I would not advise downloading it expecting everything to be to your taste.
Preview
β Important! [READ]
π’ IMPORTANT: Disable Use new Reddit as my default experience
& allow subreddits to show me custom themes
in preferences.
π’ IMPORTANT: If you use Reddit Enhancement Suite, then enable the whole section.
π’ IMPORTANT: You MUST be signed in.
π’ Required: Your browser has to support :has selector for this and most of my other themes to work properly | Set layout.css.has-selector.enabled
to βtrueβ in about:config for Mozilla browsers.
π’ Support: If you have issues, please click the "Homepage" button and go to issues on the GitHub page or click this.
β Features
- βοΈ More Results
- βοΈ Actually dark
- βοΈ Supports Highlight New Comment Extension
- βοΈ Colour coded moderator and author messages
- β Can't change much of anything unless you know what you're doing.
- β Work in progress, not perfect and more than likely never will be.
- β I use LibreWolf & Floorp browsers.
- β This was mainly made for myself and a friend as we don't like bloat, white-space or scrolling.
π₯οΈ Scripts/Extension I use
Extensions
Reddit Comment Collapser - Collapse a comment and all of it's replies by clicking on the column of the comment you wish to collapse.
Reddit Enhancement Suite - Reddit Enhancement Suite (RES) is a suite of tools to enhance your Reddit browsing experience. This might be a pain to setup.
Themes
Reddit colored comments - Not needed if you install "Reddit Comment Collapser".
Theme I use with Reddit Enhancement Suite - Only use this if you use Reddit Enhancement Suite theme + have the section enabled in the reddit theme
π· More Screenshots
(Previews/screenshots may become out-of-date at some point)
Viewing Subreddit page
Viewing an actual post
π» My uBlock Origin Filters
β Add this to your "My Filters" page
! =====================================> Reddit <=====================================
! Reddit Media UI fix/tweak | https://www.reddit.com/r/uBlockOrigin/comments/176rrjv/can_i_block_the_reddit_media_ui
reddit.com##:matches-path(/media) :root:style(background-color: black !important;)
preview.redd.it##.theme-beta.fixed
i.redd.it##.theme-beta.fixed
i.redd.it##zoomable-img:style(top: 0 !important; padding: 0 !important; height: unset !important;)
i.redd.it##post-bottom-bar
preview.redd.it##zoomable-img:style(top: 0 !important; padding: 0 !important; height: unset !important;)
preview.redd.it##post-bottom-bar
reddit.com##zoomable-img:style(top: 0 !important; padding: 0 !important; height: unset !important;)
reddit.com##post-bottom-bar
preview.redd.it##.border-neutral-border-weak.border-solid
www.reddit.com##.pointer-events-auto.l\:px-lg.px-md.bg-neutral-background.v2
preview.reddit.com##.border-neutral-border-weak.border-solid.border-r-0.border-l-0.border-t-0.border-b-sm.pointer-events-auto.m\:px-lg.px-md.bg-neutral-background.v2
! Reddit Domain Cleaner | Should only clean your main page (I use Reddit Enhanced Suite instead of using this now)
reddit.com##.listing-page.with-listing-chooser.loggedin .thing:has(.domain:has-text(/youtu.be|youtube|igorslab.de/i))
! Reddit - You can now drag and drop text when signed out... Bye bye lock
www.reddit.com##+js(aeld, mousedown, isSelectionOutOfRange)
www.reddit.com##+js(aeld, mouseup, shouldShowButton)
! Removes deleted comments + Filters remove botted comments by users
reddit.com##.commentarea .deleted .entry:has(.usertext.grayed)
reddit.com##.commentarea .entry:has-text(This post/comment has been automatically overwritten)
! Ublock Filter For Hiding "Blocked account" Comments
reddit.com##.Comment [id^="UserInfoTooltip"]>:not([data-testid="comment_author_link"]):upward(.Comment)
! π¬ Reddit Chat Iframe | Stylus doesn't apply it; this does
chat.reddit.com##.theme-beta, .theme-light.theme-beta:style(--color-tone-6: #202020 !important; --color-tone-7: #202020 !important;)
chat.reddit.com##.button:hover:style(border-radius: 0px !important; background: #202020 !important; color: #ccc !important;)
chat.reddit.com##rs-app:style(background: #151515 !important;)
reddit.com##[src="https://chat.reddit.com"], .border-b-tone-5, rs-rooms-nav:style(border-color: #202020 !important;)
chat.reddit.com##.bg-\[var\(--color-tone-7\)\], .container:has(.avatar):style(background: #101010 !important;)
chat.reddit.com##.text-tone-1, .room-name, .text-neutral-content:style(color: cornflowerblue !important;)
chat.reddit.com##.container, .text-\[color\:var\(--color-tone-1\)\]:style(color: #ccc !important;)
chat.reddit.com##.timeline-event-menu-container:style(border-radius: 0px !important; color: #ccc !important;)
chat.reddit.com##.message-box:style(background: #090909 !important; border-radius: 0px !important;)
π Configurable & Extra's
β¨ Variables
In the "β Main content" section:
:root {
--Sidebar: initial; /* none = removed EVERYWHERE, initial = enabled */
--Comment-Box: block; /* none = removed, block = on */
--AutoModerator-Message: none; /* none = removed, block = on */
--Flat-list-buttons: inherit; /* none = removed unless entry is hovered over, inherit = normal | This is the bar with permalink, source,embed, save, etc */
/* Buttons | none = off, initial = on */
--Permalink-button: initial;
--Source-button: none;
--Embed-button: none;
--Report-button: none;
}
π¨ My settings
My Other Themes
π Credit
Credits: ggitaliano & brian6932
Base: Reddit Carbon Theme
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Reddit: Theme
@version 20241209.11.05
@namespace userstyles.world/user/misspent
@description Tis a theme for old reddit
@author misspent
@license MIT
==/UserStyle== */
@-moz-document domain("reddit.com") {
/* |=====> π Not Mine [Important] <=====| */ /* Source is this iirc: https://github.com/brian6932/Reddit-Carbon-Theme | 10/05/2023 */
/* .res-image-media.res-media-zoomable {max-width: 685px !important;} */
/* MINE -> TESTING THIS FOR IMAGES */
.res-expando-box .res-media-independent {position: relative !important;}
.res-image-media.res-media-zoomable {max-width: 100% !important;}
/* Makes it easier to Read? Damn this didn't half change the feel of it! */
.md textarea, .md .-text, .md p, .md pre > code, .md th, .md td, .md li {
font-size: 15px;
margin: 0px !important;
}
/* source https://b.thumbs.redditmedia.com/6OltOW6Xbz1dZNVKJfoWSbtycXGThq6mGDiNtEeOQTw.css */
body {
color: #ddd;
}
.comment .usertext .md p> a:visited,
.md a,
.res.res-nightmode .tagline a,
a,
h2 a:visited {
color: #3498db;
-webkit-transition: color .15s ease-in-out;
-moz-transition: color .15s ease-in-out;
-o-transition: color .15s ease-in-out;
transition: color .15s ease-in-out;
}
a:hover {
text-decoration: none !important;
}
.md {
color: #ddd;
}
.md blockquote {
padding: 5px;
margin-left: 0;
background: #292929;
border: 1px solid #3c3c3c;
border-left-width: 3px;
color: #ccc;
}
.md blockquote blockquote {
background: #262626;
border-color: #3c3c3c;
}
.md blockquote blockquote blockquote {
background: #292929;
border-color: #3c3c3c;
}
.md code,
.md pre {
background: #2c2c2c;
border-color: #3c3c3c;
border-radius: 0;
color: #ccc;
}
.link .usertext .md *> code,
.link .usertext .md pre,
.usertext.border div.md *> code,
.usertext.border div.md pre {
background: #2c2c2c;
}
.new-comment div.md *> code,
.new-comment div.md pre {
background: #282828;
}
.usertext.grayed .usertext-body {
padding: 0;
background: 0 0;
}
.md del,
.usertext.grayed .usertext-body .md {
color: #888;
}
.md table {
margin: 1em 0;
font-size: 12px;
}
.titlebox .md table {
font-size: 11px;
width: 100%;
}
.md table td,
.md table th {
padding: 5px 8px;
border: 1px solid #222222;
}
.md table th {
background: #191919;
}
.md table tbody tr:nth-of-type(odd) {
background: #151515;
}
.md table tbody tr:nth-of-type(even) {
background: #191919;
}
.md hr {
height: 1px;
background: #2d2d2d;
}
.linefield input[type=text],
.linefield textarea,
.pretty-form input[type=text],
.pretty-form textarea,
.roundfield input[type=text],
.roundfield input[type=url],
.roundfield input[type=password],
.roundfield input[type=number],
.roundfield textarea,
input[type=text],
input[type=url],
input[type=password],
input[type=number],
textarea {
background: #292929;
border: 1px solid #393939;
box-shadow: none;
font-family: sans-serif;
color: #eee;
}
.link .usertext-edit textarea {
padding: 5px 7px;
}
.comment .usertext-edit textarea,
.commentarea> .usertext .usertext-edit textarea {
padding: 3px 5px;
}
.stylesheet-customize-container textarea {
font-family: "Bitstream Vera Sans Mono", "Consolas", monospace;
}
.linefield input[type=text]:hover,
.pretty-form textarea:active,
.pretty-form textarea:focus,
.pretty-form textarea:hover,
input[type=text]:active,
input[type=text]:focus,
input[type=text]:hover,
input[type=url]:active,
input[type=url]:focus,
input[type=url]:hover,
textarea:active,
textarea:focus,
textarea:hover {
border-color: #494949;
outline: 0;
}
#header {
height: 90px;
background: #202020;
border-bottom: 1px solid #101010;
}
#header:before {
content: "";
height: 1px;
position: absolute;
top: 21px;
left: 0;
right: 0;
background: #272727;
}
#sr-header-area,
#sr-header-area a#sr-more-link {
height: 20px;
background: #1a1a1a;
border-bottom: 1px solid #101010;
font-family: sans-serif;
line-height: 22px;
}
#sr-header-area .sr-list .separator {
visibility: hidden;
}
#sr-header-area .selected {
padding-right: 0;
}
#sr-header-area .selected,
#sr-header-area .selected a,
#sr-header-area a {
background: 0 0;
color: #444;
-webkit-transition: color .3s;
-moz-transition: color .3s;
-o-transition: color .3s;
transition: color .3s;
}
#sr-header-area .drop-choices.srdrop.inuse a,
#sr-header-area:hover .selected,
#sr-header-area:hover .selected a,
#sr-header-area:hover a {
color: #777;
}
#sr-header-area .drop-choices.srdrop.inuse a:hover,
#sr-header-area .selected a:hover,
#sr-header-area .selected:hover,
#sr-header-area a:hover {
color: #fff;
}
#sr-header-area .drop-choices.srdrop.inuse {
padding: 1px;
margin: -1px 0 0;
background: #2b2b2b;
border: 1px solid #101010;
border-top: 0;
border-left: 0;
box-shadow: 0 0 1px rgba(16, 16, 16, .5);
}
#sr-header-area .drop-choices.srdrop.inuse a {
background: #252525;
}
#sr-header-area .drop-choices.srdrop.inuse a:hover {
background: #202020;
}
#sr-header-area .drop-choices.srdrop.inuse .choice.bottom-option {
border-color: #333;
color: #999;
}
#header-bottom-left {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: #202020;
border-bottom: 1px solid #272727;
}
#header-img-a #header-img {
width: 80px;
height: 28px;
margin: 0;
}
#header-img-a,
#header-img.default-header {
width: 80px;
height: 28px;
display: inline-block;
margin: 0 30px 0 0;
position: relative;
bottom: 17px;
left: 15px;
vertical-align: bottom;
}
.pagename {
margin: 0 15px 0 0;
display: inline-block;
font-family: "lato", "verdana", sans-serif;
font-size: 12px;
font-variant: normal;
font-weight: 400;
letter-spacing: 1px;
line-height: 46px;
text-transform: uppercase;
color: #fb8500;
}
.messages-page .pagename,
.profile-page .pagename {
color: #eee;
}
body.with-listing-chooser #header .pagename {
margin-left: 0 !important;
position: static;
}
.pagename a {
display: inline-block;
color: #eee;
}
.pagename a:hover {
color: #fff;
}
.pagename a:before {
content: "/R/";
color: #bbb;
}
#header .tabmenu {
margin: 0;
line-height: 46px;
text-align: center;
}
body.with-listing-chooser #header .tabmenu,
body.with-listing-chooser #header .tabmenu li:first-child.selected {
margin-left: 0;
}
#header .tabmenu li,
#header .tabmenu li a {
padding: 0;
margin: 0;
display: inline-block;
background: 0 0;
}
#header .tabmenu li a {
margin: 0 10px;
font-family: "lato", "verdana", sans-serif;
font-size: 12px;
font-weight: 400;
letter-spacing: 1px;
text-transform: uppercase;
color: #bbb;
-webkit-transition: .3s color, .2s background-position;
-moz-transition: .3s color, .2s background-position;
-o-transition: .3s color, .2s background-position;
transition: .3s color, .2s background-position;
position: relative;
}
#header .tabmenu li a:hover {
color: #eee;
}
#header .tabmenu li.selected a {
position: relative;
border: none;
color: #fb8500;
}
#header .tabmenu li.selected a:hover {
color: #fb8500;
}
#header .tabmenu li a:after,
#header .tabmenu li.selected a:after {
content: "";
width: 16px;
height: 10px;
margin: 0 auto;
position: absolute;
right: 0;
bottom: -2px;
left: 0;
background: url("https://b.thumbs.redditmedia.com/ByDpJS_TIsnHeHRX3mktRAB6RLKGCJ7etqHc-uYHU9s.png") -9999px -9999px no-repeat;
}
#header .tabmenu li a:after {
background-position: center 10px;
-webkit-transition: .2s background-position ease-in-out;
-moz-transition: .2s background-position ease-in-out;
-o-transition: .2s background-position ease-in-out;
transition: .2s background-position ease-in-out;
}
#header .tabmenu li a:hover:after,
#header .tabmenu li.selected a:after {
background-position: center 0;
}
#header .tabmenu li a[href$="/ads/"]:after {
right: 4px;
}
#header-bottom-right {
height: 40px;
padding: 0 15px 0 8px;
bottom: 0;
background: #1d1d1d;
border-top: 1px solid #272727;
border-bottom: 1px solid #222;
border-radius: 0;
font-family: "lato", "verdana", sans-serif;
font-size: 11px;
font-weight: 400;
letter-spacing: 1px;
line-height: 40px;
text-transform: uppercase;
}
.gold-only #header #header-bottom-right {
background: #1d1d1d;
}
#header-bottom-right:before {
content: "";
width: 21px;
height: 40px;
display: block;
position: absolute;
left: -21px;
background: url("https://b.thumbs.redditmedia.com/ByDpJS_TIsnHeHRX3mktRAB6RLKGCJ7etqHc-uYHU9s.png") 0 -367px no-repeat;
border-bottom: 1px solid #222;
}
#header-bottom-right .user,
#header-bottom-right a,
.gold-only #header #header-bottom-right a {
color: #bbb;
}
#header-bottom-right a:hover,
.gold-only #header #header-bottom-right a:hover {
color: #eee;
}
#header-bottom-right .pref-lang {
font-weight: 400;
}
#header-bottom-right .user a.login-required {
margin-left: 5px;
color: #fb8500;
}
.loggedin #header-bottom-right .user {
color: #1d1d1d;
}
#header-bottom-right .user .userkarma {
border: none;
color: #ddd;
}
#header-bottom-right .separator {
visibility: hidden;
}
#header-bottom-right #mail,
#header-bottom-right #modmail,
.gold-only #header #header-bottom-right #mail.havemail,
.gold-only #header #header-bottom-right #modmail.havemail {
background: url("https://b.thumbs.redditmedia.com/ByDpJS_TIsnHeHRX3mktRAB6RLKGCJ7etqHc-uYHU9s.png") -9999px -9999px no-repeat;
}
#header-bottom-right #mail {
top: 1px;
}
#header-bottom-right #mail.nohavemail {
background-position: 0 -50px;
}
#header-bottom-right #mail.havemail {
background-position: -16px -50px;
}
.gold-only #header #header-bottom-right #mail.havemail {
background-position: -32px -50px;
}
#header-bottom-right #modmail {
top: -3px;
}
#hea...