tweak CSS for pre

Idea

+priority
Tickets By Priority  

Low priority tickets

+tag
expand_more layout and styling
When you're editing cards, above the text box you'll often see a toolbar containing buttons and a menu.   ...
expand_more easyticket
When you add an idea and you think it'll be trivial or easy for us to agree to make it a ticket, ...
Customize styles for Skin. Scroll down for more about CSS and Wagn.
 
This wagn contains the following
...

 

 

+solution

Currently we have:

background-color: #EEEEFF;
font-size: 11px;
padding: 10px;
white-space: pre-wrap;
word-wrap: break-word;

Suggested changes:

font-family: Monaco, "Lucida Console", "DejaVu Sans Mono", monospace;

font-size: 12px; (We're often adding strong by hand; pre can't be styled that way but at 12px it's probably unnecessary.)
line-height: 13px; (or something much less than current 21px)
padding: 8px 0;

 

 

The styling in edit mode should also be tweaked if possible, at least to be monospaced.

 

+example

expand_less some pre text

Pre pre

I like monospaced fonts.
They are cool.

Post pre

in edit mode:

on test (which has the proposed changed, but the tinyMCE styling is different not sure why): http://test.dwagn.org/wagn/pre_samples

 

expand_less +discussion

1. the edit mode is fixed (see example)

2. font-family is a skin-by-skin decision. default is fine for "classic" wagn look (I'll remove explicit monospace setting)

3. will remove font-size setting. default will go to 12px

4. re padding: yuck! text lines up against background. looks awful.

5. working on removing explicit line height settings wherever possible. should be better by default.

--Ethan McCutchen.....2013-08-28 21:18:48 +0000

+relevant user stories