We launched the new Stack Exchange Beta theme on our Judaism site a few weeks ago. Starting today, we'll be gradually rolling it out to the rest of the Beta sites. Yes, we're retiring "Sketchy," R.I.P.

This post is to serve as a central place for reporting all new Beta theme related CSS and styling issues.

p.s. to keep the feedbacks tidy, I'll be deleting answers that have been fixed/addressed

This post is to serve as a central place for reporting all new Beta theme related CSS and styling issues. Erm, why not one post per issue? Like we've always done for every other category of issue, ever?
–
Lightness Races in OrbitMar 20 '12 at 18:39

@JeremyBanks: Indeed, I can't see how it could possibly end up any other way.
–
Lightness Races in OrbitMar 20 '12 at 23:42

1

@LightnessRacesinOrbit you mean to have each Beta site's community reporting a css bug as one individual post on their Metas? Do you not see the inefficiency in that due to dupes?
–
Jin♦Mar 21 '12 at 0:59

3

@LightnessRacesinOrbit for now, meta.so is where network wide issues are reported and discussed, which is the case for the new beta theme.
–
Jin♦Mar 21 '12 at 1:03

2

So...when you say you're deleting answers that have been "addressed", does that include those which you've declined to address? If so, I'd say that's inappropriate. The community should still be able to vote on those suggestions. If you feel it necessary, you could edit the suggestion to add a horizontal rule and add the status-declined tag, and ideally, a short explanation of the rationale. I think that would be much more constructive than simply deleting them. (Obviously I understand deleting stuff that's been fixed and rendered completely obsolete.)
–
Cody GrayMar 28 '12 at 4:32

1

@JonEricson: I can't see deleted posts, but I remember seeing an answer here about the accept button before.
–
hammarApr 4 '12 at 23:52

This has been bugging me too, especially when I have a bunch tabs open for main sites and their chats. It's on my list to do to create a separate set of favicons for chatrooms. (maybe a tiny chat bubble overlaying main site's favicon for chat).
–
Jin♦Mar 20 '12 at 0:54

I would actually like to have something common that distinguish it for all sites caht rooms - not just for beta. I would suggest an overlay on the main icon as a small talk bubble in the lower right corner.
–
aweMar 27 '12 at 12:15

@awe agreed. In my last comment I meant for doing this for ALL SE sites.
–
Jin♦Mar 27 '12 at 15:46

1

@Jin How about removing the speech bubble from the beta site icons, which would allow the font to be bigger and thus make them more readable? Leave the bubbles for the chat icons.
–
GillesMar 29 '12 at 23:23

The "followed" link color is distinctly brighter than the "fresh" link color:

(This answer was the link I'd already visited and this question was the link I hadn't visited.)

I noticed because I followed the link to the answer and was confused about which link I'd already followed. Just to be sure I wasn't going crazy, I checked the look of both link types on Stack Overflow:

So the first link, which I'd followed, looks "stale" and the second link draws my eye to it. This matches my intuition.

But the beta links are reversed to my eye. Neither color is particularly faded in the way I have come to expect from followed links. If you are going to have different colors for followed and unfollowed links (a good idea I'd say) you might as well highlight the difference.

The color for unvisited links should be more vivid, bright, and saturated than the color for visited links, which should look "used" (dull and washed out).

The two colors should be variants or shades of the same color, so that they're clearly related. Using drastically different colors (say, orange and green) makes it hard for users to understand the relationship between the two types of links and to identify which color is the "used" version of the other.

Shades of blue provide the strongest signal for links, but other colors work almost as well.

As always, when using color to signal information, you should provide redundant cues for color-blind users. Making unvisited links brighter and more luminous than visited links will usually accomplish this goal.

Actually, it's worse on the main page where questions I've read look like they are unread and vice versa.
–
Jon Ericson♦Mar 26 '12 at 18:34

1

Strongly agree. I visit beta sites semi-regularly, and each time I do I'm immediately confused by the link colours. It's very frustrating.
–
Jeremy BanksSep 13 '12 at 19:52

The problem I think is that the "vivid version" of the link color on the beta sites is too bright, so it looks actually less vivid against the white background (and this is even more a problem to the light-blue background of favorite-tagged questions). In the scetchy theme, the colors were originally switched, but this was no better as there is still a problem.
–
aweFeb 12 '14 at 13:19

On the tags page, if one row doesn't contain any tag with the "x questions asked this month" line, the spacing changes on hover because the edit link is inserted. This leads to sudden movements of the whole page when moving the mouse across the tags.

Some sites' color schemes use a way-too-light background color for highlighting questions with tracked tags - e.g. Code Review. There's almost zero contrast with the normal question background, making it nearly impossible to see at a glance which questions have favorite tags (and thus making that feature basically useless).

The active selected is just a red box, and the other page buttons are styled round buttons but with a rectangular shadow behind. It would be nice to have just the round style, and remove the rectangular shadow below. Also make a round shape for the red active one.

As I reported when chinese.stackexchange.com launched, there is still a problem with asian fonts being selected incorrectly in some browsers. This can be solved by setting language attributes in html, or by specifying asian font stacks properly (possibly with webfonts?).