9

Sometimes in Questions/Answers on Stackoverflow I really would like to have two easily distinguishable forms of emphasing (e.g. Code vs. Console Output). Unfortunately quotes and codeblocks look way too much alike so that they are of no much help, especially when having only short snippets of code where not much syntax highlighting is applied.

a quote block

a code block

I would like to see a subtle change of colors between these two and/or an additional "border-left" for the quote block to be able to distinguish these two elements better.

This might not be a perfect example, but you can take a look at this question.

In fact several other stackexchange sites differentiate quotes and codeblocks quite well.

Improve this question
6
  • 1
    I dunno, is this really necessary? The fonts are already different, you can use extra tags to highlight the code, and if the quote block is sufficiently long enough, you can tell it's a quote block because it will wrap around (code blocks don't do this).
    – LittleBobbyTables - Au Revoir
    Commented Mar 4, 2013 at 16:48
  • Can you point to a post where you see this as an issue.
    – Some Helpful Commenter
    Commented Mar 4, 2013 at 16:52
  • @LittleBobbyTables as I already stated, sometimes the code does not really hightlight, perhaps it's only pseudocode and/or the quote is not long enough. Sure it's a different font but just by having the rgb differ by lets say 10 points, it would probably already be enough to make it easier to distinguish.
    – Christoph
    Commented Mar 4, 2013 at 16:55
  • 1
    What makes a left border a quote and not code (or vice-versa)? I'm pretty meh about this; I don't really see what the issue is in the linked question.
    – Dave Newton
    Commented Mar 4, 2013 at 17:18
  • @Dave I think you are missing the point... it does not matter which style applies to which block. It's just for better visual distinction.
    – Christoph
    Commented Mar 4, 2013 at 19:20
  • 1
    @Christoph No, I disagree with the point. I've never been confused trying to decide if I was looking at a quote or a code block.
    – Dave Newton
    Commented Mar 4, 2013 at 19:32

2 Answers 2

Reset to default
8

The border-left concept used on Super User for quotes is pretty nice (though I preferred it in the original blue):

SU quote

Improve this answer
1
  • This is what i mean!
    – Christoph
    Commented Mar 4, 2013 at 17:00
-1

Why? What difference would that make?

The point of code-block (other than the obvious syntax highlighting), is to provide with a monospaced font for easy reading of code. It doesn't really matter the color of it, or how similar it is to other elements.

But I guess it wouldn't be that much of a problem to add some sort of border-left: 3px #BADA55 solid;.

Improve this answer
13
  • 5
    I was rather let down #BADA55 is not a particaularly badass color.
    – Servy
    Commented Mar 4, 2013 at 16:55
  • @Servy: But still, THE NAME!
    – Madara's Ghost
    Commented Mar 4, 2013 at 16:56
  • I know, the name is epic, which is why I was so let down to see the color...not be. I wish the color was something I could actually use in a lot of places.
    – Servy
    Commented Mar 4, 2013 at 16:57
  • -1 Color and background choice does make a big difference when designing a website, your tone is overly dismissive.
    – user159834
    Commented Mar 4, 2013 at 16:58
  • @WesleyMurch: But in this context it doesn't really matter in my opinion.
    – Madara's Ghost
    Commented Mar 4, 2013 at 16:59
  • 5
    @Servy if it helps, try not laugh reading this: color-hex.com/color/bada55
    – User1000547
    Commented Mar 4, 2013 at 16:59
  • 1
    @mikeTheLiar I failed.
    – Servy
    Commented Mar 4, 2013 at 17:01
  • @mikeTheLiar: lol @ shades of badass.
    – Madara's Ghost
    Commented Mar 4, 2013 at 17:01
  • "This div background color is #bada55"
    – Servy
    Commented Mar 4, 2013 at 17:02
  • 1
    Everyone knows the best color is chucknorris.
    – user159834
    Commented Mar 4, 2013 at 17:03
  • 2
    @Servy I get a little pop-up on the bottom right: "Love #bada55 color? +1"
    – User1000547
    Commented Mar 4, 2013 at 17:03
  • 1
    "I want you to reach into the internet and get my page out." "Which one is yours?" "It's the one that says 'background-color: #bada55;'" youtube.com/watch?v=6_tbKQ0wS34
    – User1000547
    Commented Mar 4, 2013 at 17:11
  • 50 shades of #bada55
    – Dave Newton
    Commented Mar 4, 2013 at 17:31

You must log in to answer this question.

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