Custom CSS user improvements for nu-Dex

[racofer]

Or remove the footer entirely:

.p-footer {
    display: none;
}

True, but you need it to be able to change the base page page layout, so I prefer to leave it there.

Thanks racofer for the baby troll hack. Looks much better now. Is there any way to hide the "last profile post" section? As far as I can tell, there are no dedicated css classes for it, so you cannot just hide it without massive splash damage.

Yes, you can block it explicitly with the path to the div element, like this:

.p-body-sidebar .block:nth-child(5) {
    display: none;
}

If at some point the ordering changes in the sidebar, then you have to fix it for the new ordering.

 

[racofer]

Wider alerts menu.

/* Wider alerts menu */
.menu.menu--structural.menu--right {
    width: 30%;
}

 

[ropulos]

For the ones that prefer left-aligned user info/avatar like in the old forum:

/* username and title on the left */

.message-name {
    text-align: left;
}

.message-userTitle {
    text-align: left;
}

/* avatars on the left */
.message-avatar {
    text-align: left;
}

 

[Twiglard]

I don't know how to use this I even installed several javascript injector add-ons and it does nothing

Just add a handler to the hover event doing $(".actionBar .sv-rating-type__text").click().

Wider alerts menu.

/* Wider alerts menu */
.menu.menu--structural.menu--right {
    width: 30%;
}

Real nice. I enabled this globally for the desktop/landscape layout.

 

[ropulos]

Just add a handler to the hover event doing $(".actionBar .sv-rating-type__text").click().

This is really erratic, the hover works 1/10 of the time, and for some reason it brofisted every message on the page I was testing it without me clicking on anything.

 

[Twiglard]

Just add a handler to the hover event doing $(".actionBar .sv-rating-type__text").click().

This is really erratic, the hover works 1/10 of the time, and for some reason it brofisted every message on the page I was testing it without me clicking on anything.

for (const x of $(".sv-rate-menu--type-tooltip")) {
    $(x).on("mouseenter", function() {
        if (x.innerText == "Brofist")
            $(".actionBar-action--sv-rate", x).click();
})}

The only problem is that it's instant, but let's leave that as an exercise to the reader.

 

[ropulos]

Only thing missing is to make the box auto-disappear in case you move the pointer away from the box without rating, right now it stays permanently unless you click outside or press ESC. But I'm a shitter with zero knowledge of programming so this is the best I can aspire to in this moment

Thanks for the help nonetheless.

EDIT: also hovering twice = auto-brofist. I'm leaving this disabled because it's gonna cause trouble.

 

[spekkio]

Is there any way to hide the "last profile post" section? As far as I can tell, there are no dedicated css classes for it, so you cannot just hide it without massive splash damage.

Yes, you can block it explicitly with the path to the div element, like this:

.p-body-sidebar .block:nth-child(5) {
    display: none;
}

If at some point the ordering changes in the sidebar, then you have to fix it for the new ordering.

For Ublock users, adding these filters:

! https://rpgcodex.net
rpgcodex.net###siropuChat
rpgcodex.net##.p-body-sidebar .block:nth-child(4)
rpgcodex.net##.p-body-sidebar .block:nth-child(6)

Nukes shitbox, latest posts & latest profile posts. Add less / more children if necessary.

Screenshot zoomed-out AF:

Thanks for this, racofer!

 

[Twiglard]

Try this instead.

div.block[data-widget-key="forum_overview_new_profile_posts"] {
    display: none;
}

 

[racofer]

Try this instead.

div.block[data-widget-key="forum_overview_new_profile_posts"] {
    display: none;
}

That's a much better away to apply the selector.

 

[ropulos]

Centered user info: https://rpgcodex.net/forums/threads...ite-blander-than-the-past.143436/post-7996571

 

[spekkio]

Try this instead.

div.block[data-widget-key="forum_overview_new_profile_posts"] {
    display: none;
}

This. Using racofer's / mine solution either via Stylus or Ublock is actually a bad idea, since "children's" numbers change depending on how many of them are visible. So, if "staff online" is visible, other children below get #3, 4, 5, etc. But when no gestapho is online, they get higher numbers (#2, 3, 4, etc).



So, if you want to nuke "New posts" and "New profile posts" to avoid random guro showing up on the main page, use this style in Stylus:

div.block[data-widget-key="forum_overview_new_profile_posts"] {
    display: none;
}

div.block[data-widget-key="forum_overview_new_posts"] {
    display: none;
}

Props go to Twiglard

 

[Twiglard]

Why not something this, but forced for everyone:

div.block[data-widget-key="forum_overview_new_profile_posts"] .contentRow-main .contentRow-faderContainer img {
    display: none;
}

Post a profile image and see whether it matches anything.

 

[ropulos]

FYI, I've been adding smaller improvements in the original post so don't forget to check them out, as well as changing some stuff that got broken with recent updates by Twig.

This is how peak 'dex looks like:

 

[ItsChon]

This is how peak 'dex looks like:

Admittedly, that actually looks kinda good...

EDIT: If I wanted to give it a try, what the fuck do I do? Do you have a guide from scratch for retards? ropulos

 

[Tavar]

This is how peak 'dex looks like:

Admittedly, that actually looks kinda good...

EDIT: If I wanted to give it a try, what the fuck do I do? Do you have a guide from scratch for retards? ropulos

See my post here. Use the script in the first post of this thread. Stylus is also available for Chrome if you use that.

 

[ItsChon]

This is how peak 'dex looks like:

Admittedly, that actually looks kinda good...

EDIT: If I wanted to give it a try, what the fuck do I do? Do you have a guide from scratch for retards? ropulos

See my post here. Use the script in the first post of this thread. Stylus is also available for Chrome if you use that.

Thanks! But how do I get the background that's in ropulos's screenshot?

 

[ropulos]

Thanks! But how do I get the background that's in @ropulos's screenshot?

html {
background: #383838 url('https://i.ibb.co/r54zN5z/57035.png') repeat;
}

 

[Punished Rean]

Thanks! But how do I get the background that's in @ropulos's screenshot?

Try

html {
background: #383838 url('https://i.ibb.co/tPHxxkS/image.png') repeat;
}

 

[ItsChon]

ropulos Are you going to fix the stretched out Codex troll on the top left? I love the script you wrote and it would be great to keep using it without that little imperfection.

 

[ropulos]

ropulos Are you going to fix the stretched out Codex troll on the top left? I love the script you wrote and it would be great to keep using it without that little imperfection.

...works on my machine, not sure what you mean. Try making a screenshot.

Remove this or set it to its original 135px to see if it fixes your problem:

.codexTroll {
    width: 100px;
}

 

[ItsChon]

ropulos Are you going to fix the stretched out Codex troll on the top left? I love the script you wrote and it would be great to keep using it without that little imperfection.

...works on my machine, not sure what you mean. Try making a screenshot.

Remove this or set it to its original 135px to see if it fixes your problem:

.codexTroll {
    width: 100px;
}

It looks super compressed like this. I tried pasting the code that you put in but it didn't change anything.

 

[ropulos]

It looks super compressed like this. I tried pasting the code that you put in but it didn't change anything.

No, you should have the code in your CSS already so what you did was duplicating it and therefore it did nothing. This code was to make the troll smaller but something got broken with recent updates, I'll amend it. What you need to do is to look in Stylus for that nugget of code and delete it, it should work and look like it was before.

If you don't want to delete it for some reason, look for it and change it to this:

.codexTroll {
    width: 135px; /* this is original size, adjust to your tastes */
    height: auto;
}

The height setting should fix the weird stretching issues, and then you can adjust the width to your desired size.

 

[ItsChon]

Your work is much appreciated, and I prefer the new Codex with your improvements to the old Codex. Thank you mate!

 

[ropulos]

If you've finally had it with DU's stupid obsession with adding the most stupid and horrible looking buttons possible, you can do this:

/* bye bye ratings */

.sv-rating-type--inline {
    display: none;
}

ul.sv-rating-bar__ratings {
    display: none;
}

However you will still be notified of reactions received unless you deactivate all button alerts.