AT Xen2.0 Stylus (Addon) Themes

[Jaskalas]

CSS Changes for Custom Anandtech Xenforo Forum Themes

Theme Modification 2.0
New Forum Software means new themes! I am re-posting a new version of a years old topic, with themes specifically for this current version of the forums. Older themes no longer work, and/or are entirely broken. We should start fresh, to avoid any confusion, bad links, or outdated info.

About:
Is that a blinding white screen? Suffer no longer. Learn how to edit a website's CSS style yourself, with the help of an addon to your browser. For this topic we are specifically using Stylus but there may be other options out there. Simply copy or write some CSS code into the addon to transform any website of your choice.

Browser Addon Links:

• Firefox
• Chrome
• Safari
• Opera

Current Light Themes:

• AT Xen Tan 2.2

How to Use:

• Install a browser addon for user-defined CSS.
• Copy the CSS code provided to use as a "Theme".
• Paste that code into Stylus, and apply it to forums.anandtech.com
• Toggle it on/off at your discretion.

Important!
Make sure you use the associated light / dark base theme provided by Anandtech first. Stylus themes are meant to edit those, and there are major changes between the base themes. A "Light" theme will not work over a "Dark" theme, or vise vera.

Disclaimer:
This topic and its contents are provided AS IS with no warranty or support. I am not responsible for or affiliated with in anyway the Stylus Addon, its developer, or its associates. Use at your own risk. Content, Addon, and Themes may change or cease to exist at anytime. Changes to a website are likely to render Themes broken, unusable, or obsolete. There are no guarantees here or in life. Enjoy! (maybe...)

Community Support:
I fully welcome the participation of others in creating additions, tweaks, changes, or entire Themes to this project. I would publish complete or decent Themes in the OP alongside my own. Helping provide everyone else as much customization as we can find a use for. Replies to share code snippets are welcomed.

My own Themes are a work in progress, and there is more work to be done. The first Theme was published in about ~36 hours of its beginning.

Q&A

Where's my Dark Theme?
It appears Anandtech now provides a Dark Theme. Modifications to that may be useful. We'll see if that goes anywhere. No promises.

Tan theme is incomplete!
Glad you noticed! Yes, it's a work in progress. I decided to share it when 1: My eyes were no longer bleeding, 2: I was comfortable with its general use myself. There remains work to do on it.

I hate Tan!
Yeah... I was inspired by another forum that shall remain nameless, but I understand it's not for everyone. Also, I made some font and other style changes that may be suitable to my own tastes, but perhaps not your own. That's okay, it can all be customized.

Feel free to suggest other fonts and colors!

Assuming you don't mind me trying some changes?
Think of this as open source. You are free to edit everything / anything as you like. I posted this as a resource to help others.

 

[Jaskalas]

AT Xen Tan 2.2

Changelog:

• 2.1 -> Posts: New font style, larger font size.
• 2.2 -> Initial updates to conform with latest forum version.

Expanded:

Collapsed:

Reserved Space...

 

[Ken g6]

Why are there fkkn ads in the postses?

The updated forum software puts a preview of the links people post, is that what you're talking about?

View attachment 10885

Yeah, I don't like it at all. I've been trying to link my links as text-only links, but sometimes it seems to override them. Oh well. Embrace the meh future.

Or fight the future, with my user style! It turns those blocks back into almost-normal links.

@-moz-document domain("forums.anandtech.com") {
.fauxBlockLink[data-url] > .contentRow > *, .fauxBlockLink[data-url] > .contentRow div { display: none; }
.fauxBlockLink[data-url] > .contentRow > .contentRow-main.contentRow-main { display: block; }
.fauxBlockLink[data-url].fauxBlockLink {
    background: transparent;
    border: none;
    margin: 0 0 1.4em 0;
    padding: 0;
    width: auto;
    display: inline-block;
}

.fauxBlockLink[data-url]:after {
    content: attr(data-url);
    color: #22229C;
    text-decoration: underline;
}

.fauxBlockLink[data-url] .fauxBlockLink-blockLink {
    display: block;
    line-height: 0;
    text-indent: -9999px;
    overflow: hidden;
}
}

Edit: Fixed to allow alerts to work.

 

[GrumpyMan]

Thanks for this, I was about to delete the Forums until I found this fix. I bumbled my way through it, but in the end it is soooooo much better for my old worn out eyes. Thank you!!! Now I have to apply at work...heh heh heh...

 

[Jaskalas]

Oh, in case that was regarding the Tan theme, I have now posted an update (2.2) that fixes the more annoying mismatches between it and the latest forum version. Not everything is as it was, or intended, but it's a lot closer.