xF2 Style Shades of Grey 2.2.10

At first glance, it may look the same as the previous version, but it is not ...Well, not exactly, anyway. I took the time to further blend the colors and shades to make it look the best I could. I also moved much of the CSS into the style properties area so as to make the "extra.less" file less crowded.

It was brought to my attention that the font color displayed with the BB Code was hard to read, so I changed all of them to pastel colors. They stand out better now and are easier read against the dark background. If you never use the "Code" BB Code insert, you don't need this update.

This is the how it looks now with the new pastel colors

Added a narrow dark colored scrollbar
Made some minor color changes to be complaint with XenForo 2.1

Edit: Accidentally uploaded previous version (oops). New files are now uploaded...
Edit #2: I found an issue with one of the templates templates and a CSS color, so I needed to update again

The last version (2.5) had an enlargement setting in the CSS for avatar size. This caused an issue with the mobile avatar size, and because of this, I have removed the snippet of code and re-uploaded the Shades of Grey files. If you don't feel like downloading and re-installing, all you have to is delete this code snippet as explained below, and the default XenForo Avatar size will go back to default.

Simply go to:

Appearance > Styles > Shades of Grey > Templates

and search for "extra.less" and look for

Code:

.avatar.avatar--m {
     width: 120px !important;
     height: 120px !important;
}

Delete this code snippet and that should fix the problem.​

Okay, I located the issue with my personal logos and favicons and all should be removed now. I also changed the "Style type" to "Dark." When I originally created the style, I didn't think it really made a difference what was checked, or the purpose of the two different types, but after downloading an "Add-on" I recently purchased, I realized what the setting was actually used for. Apparently, some add-ons may call for the style to match a dark or light theme, so it can be used in multiple themes.

I recommend that all users download and upload the latest version of the style.

Sorry again for the repeated updates, but I had to make it right.

NOTE: To better illustrate the "Style type" settings, check out these two links on my site while paying particular attention to the "Discord" Widget

XenForo Light
Shades of Grey (cream text)

I accidentally left my personal Logo URL in the style, so this version has it removed. Sorry about that.

If you have already installed version 2.3, just simply go to Admin CP > Appearance > Shades of Grey > Basic Options and check "Revert customized value" to clear my personal logos. You probably already figured that out, so no big deal. If not, I have uploaded version 2.4 which has this already cleared.

I made a few enhancements to the styling in an effort to make the style look better. You can check out my Demo site to see the changes I made if you like. For example, I changed the solid line separating stickeys into a dashed line with a different color. Its a little more subdued now and I think it looks better. I also added a dark colored background for those who enable the character counter in the Xenforo editor. I made other small updates and changes, so I hope you like them. Again, stop by the site and see if it's something for you. If not, have a great day.

• Changed Button hover color to grey background (looks better)
• Changed Ratings Stars (unselected) to medium grey (they were not visible prior to this change) ** !Important **
• Increased brightness of Text Editor background to a lighter shade of grey for better contrast (easier to see)

Here is a video showing the changes

Made all of the tabbed areas consistent throughout the style. For example, you will notice the "Search" area in the previous versions has a light grey background and other tabbed areas do not. I noticed it when I added a tabbed side block widget to my website, so I fixed it to display the tabs as seen below:

Although not included in this style, the tabbed block on my site was created using the resource "How to make a tabbed widget" You might want to check it out.

I also fixed the shaded area for the "start" and "end" of tab areas when you run out of of room on tabs as seen below:
(it was white/light grey before without the fix)

Added "Icons for Login and Registration" by BassMan

Fixed: It was brought to my attention that when highlighting text in the editor, the highlighted text was the same color as background so it could not be seen. (This occurred when using Firefox and IE). To fix the issue I made the background Green and text color White for all browsers.