How do I change vote arrow buttons back?

Question

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

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.

Answer 1

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.