7

In SEDE, using Chrome on Windows, comments and strings are both formatted in the same shade of green:

SEDE snip

(Snip is from this query)

Now, I'm sure many out there will have bones to pick with my query syntax and formatting and whatnot, but all of that harassment aside: it seems to me that this would be much easier to read if the comments and strings were colored differently.

I don't know what all colors are currently allocated in SEDE, but if nothing else two different shades of green would help. Even that bit of contrast would provide some useful semantic differentiation.

2 Answers 2

6

I have prepared two three commits to change the color for the span.cm-sql-literal in CodeMirrors theme.css that is used by SEDE to apply syntax highlighting.

Follow lang-sql

The first option is to use the color used in lang-sql as suggested by TRiG:

enter image description here

The commit is here

Follow SQL Server Management studio

SSMS is the client side tool for interacting with SqlServer. Its syntax highlighting looks like this: https://i.stack.imgur.com/mcskX.png

If I apply the same red to the CodeMirror theme.css this will be the result:

enter image description here

The commit is here

The Compromise

The bright red scared some users so with different colors offered back and forth this might be acceptable to all parties involved:

enter image description here

The commit is here.

Give feedback

Let me know which of the commits (or none of them) needs to be promoted to a Pull Request so Nick can merge and deploy in 6 to 8 weeks.

Pull Request

I have gone ahead and submitted a Pull Request on GitHub for the last option, the compromise. Now we wait.

19
  • Of the two, I prefer the SSMS due to the stark contrast. The dark red color of lang-sql strings is too close to that already in use for variable names (e.g., @Tag in the sample image). More broadly, I would prefer either something like a light blue-green (~ #9ce2da) or a light orange-red (~ #ff944d), though these might be unacceptable due to not being like other existing schemes.
    – hBy2Py
    Mar 29, 2017 at 15:02
  • Yeah, I didn't plan on offering the UX minded guru's the opportunity to dream-up an new color scheme. Let's stick as close as possible to its initial intent. Assuming that SSMS is the original intent.
    – rene
    Mar 29, 2017 at 15:05
  • I prefer that strings not get in my face shouting like that that second version, but either is better than having no distinction between comments and strings. And if there's a standard that SEDE is following already, we should take that into account. Mar 29, 2017 at 15:17
  • Uhh yeah, the strings should be the second red (per my copying of SSMS, anyway, I wouldn't mind a less bright option if people prefer that), I honestly have no idea why they weren't in the first place and how I've looked at them hundreds of times and not considered this
    – Tim Stone
    Mar 29, 2017 at 15:32
  • What you have works for me since I'm used to it, but I understand @MonicaCellio's concern too
    – Tim Stone
    Mar 29, 2017 at 15:36
  • @TimStone How about a more muted light red, somewhere around #e87b7b?
    – hBy2Py
    Mar 29, 2017 at 15:37
  • @hBy2Py that is rather ugly TBH: i.stack.imgur.com/V724a.png
    – rene
    Mar 29, 2017 at 15:39
  • @hBy2Py I'd probably go a bit darker & redder for contrast, at least somewhere around #C72929
    – Tim Stone
    Mar 29, 2017 at 15:40
  • rene, that's why I originally proposed the #9ce2da and #ff944d; the light red in general seems ill suited for attractive display. On the whole I'd rather take the liberty of departing substantially from SSMS in this instance. I understand the UI/UX motivation for staying close to it, though.
    – hBy2Py
    Mar 29, 2017 at 15:41
  • 1
    @TimStone I like that one better yes: i.stack.imgur.com/Kkwpa.png
    – rene
    Mar 29, 2017 at 15:42
  • @TimStone Works for me, rene
    – hBy2Py
    Mar 29, 2017 at 15:44
  • Um... red - green is a really bad combination for users with colorblindness. I recommend you do some review of colorblind-friendly color schemes...
    – Catija StaffMod
    Mar 30, 2017 at 20:21
  • 1
    @Catija the green/green was probably the same already for the colorblind so nothing will improve for them? And what you suiggest will need a complete overhaul of all colors which can be done but wasn't the intent of the question and my answer. sorry.
    – rene
    Mar 30, 2017 at 21:11
  • I think the colors as they are are already pretty OK in regards to the colorblind... I'm not an expert, granted, but blue and green are generally distinguishable and pink can usually be discerned from green because they're different values. But the red and green are indistinguishable. It'd just be nice that, if you're introducing a new color, if it could be one that a wider audience could make use of - i.e. not red.
    – Catija StaffMod
    Mar 30, 2017 at 21:16
  • 1
    Then I think nothing in their UX experience will change for them in that case. There was no distinction between the comments and strings earlier, there is now for users that can see colors and for the colorblind it will look similar as as they can't distinguish green from red... I think it is important that this change doesn't make it worse which, based on your feedback, seems to hold.
    – rene
    Mar 30, 2017 at 21:22
1

This site uses the standard prettify, which produces very different colours (strings are red and comments are grey). The code block below is marked with lang-sql:

-- Tag: Tag for co-tag frequency search
DECLARE @Tag nvarchar(100) = ##Tag:string##

-- Make it a case-insensitive search
SET @Tag = LOWER(@Tag)

-- Co-tag name, count of co-tag instances, and links
-- First link is to site search, finding all questions with at minimum
--  the two specified tags
-- Second link is to a SEDE query, finding all questions with ONLY
--  the two specified tags, and no more.
SELECT t.TagName AS 'Co-Tag', COUNT(t.TagName) AS 'Occurrences',

    'site://questions/tagged/' + @Tag + '+' + t.TagName + 
      '|[' + @Tag + '] [' + t.TagName + ']'
      AS 'Posts w/At Least These Tags (Site Search)',

    'http://data.stackexchange.com/chemistry/query/650075/' +
    'questions-with-exactly-two-specified-tags?Tag1=' + @Tag + 
    '&Tag2=' + t.TagName + '&OpenQs=Y&ClosedQs=Y|[' +
    @Tag + '] [' + t.TagName + ']'
    AS 'Posts w/Just These Two Tags (SEDE)'

-- Pull from the entire list of posts first
FROM Posts p

-- Keep all post information; keep only tag info where relevant to the
--   posts that are returned. I think the LEFT JOIN speeds up the search
--   relative to a regular JOIN...?
-- Regardless, this returns one query record for each **tag** (not question),
--   allowing for the "COUNT(...)" above and "GROUP BY ..." below to work 
LEFT JOIN Tags t ON p.Tags LIKE '%<' + t.TagName + '>%'

-- Only keep questions; only keep questions that are tagged with the 
--   primary tag of interest; discard records marking the occurrences
--   of the primary tag of interest
WHERE p.PostTypeId = 1 AND p.Tags LIKE '%<' + @Tag + '>%'
      AND t.TagName <> @Tag

-- Group the results by the secondary tags, enabling the above COUNT
GROUP BY t.TagName

-- Most to least common co-tags
ORDER BY COUNT(t.TagName) DESC
5
  • I'd think SEDE would have to use a custom colorset, since it has some extra features ... the parameters & such?
    – hBy2Py
    Mar 29, 2017 at 13:19
  • @hBy2Py Yeah, SEDE tries to follow the color scheme used in SQL Server Management Studio: i.stack.imgur.com/mcskX.png
    – rene
    Mar 29, 2017 at 13:43
  • @rene Save for the glaringly red color used there for strings. I'd prefer something less stark, a cerulean or coral, maybe, but even that angry red would be fine -- clear contrast!
    – hBy2Py
    Mar 29, 2017 at 13:45
  • TRIG, is there a list somewhere of all the langs that are available for code prettifying?
    – hBy2Py
    Mar 29, 2017 at 13:46
  • 1
    @hBy2Py here
    – rene
    Mar 29, 2017 at 13:52

You must log in to answer this question.

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