49

I have noticed that the vote arrow buttons have changed to this:

enter image description here

This change has been implemented on all Stack Exchange sites.

I didn't consent to the change, I don't like the new style. The styling of the vote arrows should be a matter of personal preference, and I personally dislike the new style and prefer the old style.

So how do I change it back? I don't see any option to do this.

Improve this question
12
  • 3
    related: We are graduating the updated button styling for vote arrows
    – samcarter_is_at_topanswers.xyz
    Commented May 30, 2023 at 15:17
  • 11
    Somebody is working on a userscript ...
    – Glorfindel Mod
    Commented May 30, 2023 at 15:18
  • 47
    I didn't consent to the change ... That is not how it works. Build your own Q/A site or get hired by SE as a designer if you want a say in what features look like.
    – rene
    Commented May 30, 2023 at 15:34
  • See also this user style I wrote last year to address this: stackapps.com/questions/9443 originally it was SO only but I've updated it now to apply to all network sites.
    – TylerH
    Commented May 30, 2023 at 18:42
  • "I don't see any option to do this." That's because there is none. You probably already guessed it.
    – NoDataDumpNoContribution
    Commented May 30, 2023 at 19:02
  • Something is always going to happen when it comes to the bottom line. Apple was the first one to discontinue the headphone jack, everyone followed suit. Twitter was the first one kind of to ban all third-party clients. Reddit and others are following suit. SE changed the voting arrows. it will get resistance probably for a week then everyone on the site will follow suit. It sucks but it happens. Not saying I like it, it's weird but it's reality.
    – Big Joe
    Commented May 30, 2023 at 21:36
  • 2
    @BigJoe well, if there was something that was better and and changed something worse, and if you remember this then you will get a face of what the .. is this? I still, prefer the old question left side.... Yes, there was a problem with mobile usage, current this not solved the issue and make it worse, they only need more padding on the mobile!
    – kelalaka
    Commented May 31, 2023 at 9:27
  • 1
    @kelalaka I miss old mobile compact view. So much detail and information on the screen
    – Big Joe
    Commented May 31, 2023 at 16:21
  • 4
    @rene Shockingly, the fact that organizations can force their whims on people without recourse is not, in fact, any sort of ethical defense. "I didn't consent" is a perfectly valid defense, and if the system is not set up in such a way to allow that to matter that is a problem with the system.
    – linkhyrule5
    Commented Jun 3, 2023 at 7:55
  • 3
    @linkhyrule5 organizations are not forcing anything on anyone. Stack Exchange is changing its product and of course does not have to ask you for consent to do that. "I didn't consent" in this case is plain entitlement, as rene's comment points out.
    – wimi
    Commented Oct 7, 2023 at 8:58
  • 2
    Only if you view this site as a product owned by Stack Exchange, rather than a community that happens to have a corporation leeching money off of it. That argument would be much more reasonable if Stack Exchange was providing anything other than the server time. As it is, I really wish we'd made a nonprofit instead.
    – linkhyrule5
    Commented Oct 7, 2023 at 22:39
  • They changed again, probably due to this 2023-10-19 change.
    – This_is_NOT_a_forum
    Commented Oct 25, 2023 at 16:26

1 Answer 1

Reset to default
49
+50

This is a user style that I managed to come up with in about 15 minutes, based on a cached copy of a question with old styles (since then gone from cache).

button:is(.js-vote-down-btn, .js-vote-up-btn, .js-upvote-btn, .js-downvote-btn) {
    border: none !important;
    border-radius: 0 !important;
    background: none !important;
    padding: 0 !important;
}

button:is(.js-vote-down-btn, .js-vote-up-btn, .js-upvote-btn, .js-downvote-btn):hover {
    background: none !important;
}

/* 
 * As of October 2023, each post voting button carries the following attributes:
 *
 * data-selected-classes="fc-theme-primary-500 bc-theme-primary-500 bg-theme-primary-100"
 * data-selected-classes="fc-theme-primary bc-theme-primary bg-theme-primary-100"
 * data-unselected-classes="bc-black-225 fc-black-500 h:bg-theme-primary-200" (both)
 *
 * Apparently some JavaScript toggles all of those at once when votes are cast or withdrawn.
 *
 * The lengths to which some people go to avoid writing semantic CSS classes are astounding.
 */
button:is(.js-vote-down-btn, .js-vote-up-btn, .js-upvote-btn, .js-downvote-btn) {
    color: inherit !important;
}

button:is(.js-vote-down-btn, .js-vote-up-btn, .js-upvote-btn, .js-downvote-btn)[aria-pressed="true"] {
    color: var(--theme-primary) !important;
}

This only resets the button appearance; to also revert the new style of the vote counts, you need to also add:

.js-vote-count {
    color: var(--black-500) !important;
    font-size: var(--fs-title) !important;
    padding: 0 !important;
    font-weight: normal !important;
}

Install it with your favourite user style manager; as of this writing, I use Stylus. As of version 120, Firefox for Android has finally re-enabled most extensions and Stylus can be installed there.

Improve this answer
10
  • 8
    I see a lot is not important. That is important.
    – rene
    Commented May 30, 2023 at 15:50
  • I'm using Firefox on Android, and it doesn't look like I can use Stylus. Am I possibly wrong, or does anyone know any other user styling options?
    – JonathanZ
    Commented May 31, 2023 at 5:37
  • 1
    You can try uBlock Origin’s :style(…) syntax, but it will be rather unwieldy.
    – user3840170
    Commented May 31, 2023 at 6:06
  • In case anyone would like to use custom icons instead of triangles, I posted a variation of this script at tex.meta.stackexchange.com/q/10080/36296
    – samcarter_is_at_topanswers.xyz
    Commented May 31, 2023 at 14:47
  • I really recommend you put this up at userstyles.world! In the meantime I've manually mirrored this myself at userstyles.world/style/10712
    – Aaron Liu
    Commented Oct 21, 2023 at 18:16
  • @JonathanZ Just curious: did you find a way to add this to Firefox on Android?
    – samcarter_is_at_topanswers.xyz
    Commented Oct 22, 2023 at 14:35
  • @samcarter_is_at_topanswers.xyz - Sadly no. But back then I think I was still using the beta version of Firefox-Android. Thing could easily have changed.
    – JonathanZ
    Commented Oct 22, 2023 at 14:40
  • 1
    @samcarter_is_at_topanswers.xyz - Thanks for putting on the bounty. It really is ridiculous, isn't it?
    – JonathanZ
    Commented Oct 22, 2023 at 14:44
  • 1
    @JonathanZ Yes, indeed. I was travelling without my laptop for a few days and was reminded how unusable the unmodified icons are...
    – samcarter_is_at_topanswers.xyz
    Commented Oct 22, 2023 at 14:45
  • 2
    After a recent update that changed the CSS classes I had to replace :not(.fc-black-500) by [aria-pressed="true"].
    – janw
    Commented Mar 21 at 12:44

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .