652195 - Learning pages cleanup for 0.9.4

Status: VERIFIED FIXED

(developer.mozilla.org Graveyard :: Wiki pages, defect)

Description

[Jay Patel [:jay]]

I found a few issues and missing pieces that we should probably take care of ASAP for the 0.9.4 release.

1. Description text for learn <foo> pages looks a bit messy.
2. Missing CSS3 icons on CSS page
3. Intermediate and Advanced blocks have inconsistent icons

Here is what I propose:

1. Try making the text left aligned but keep it centered to so it's a bit easier to read.  If that doesn't work, let's try to do even spacing of the text so that the block of text is as rectangular as possible.
2. Add Chowse's CSS3 icons to relevant link titles on that page
3. Use the book icon for Intermediate and the grad hat icon for Advanced (blocks = introduction/beginner and the bulb = examples/demos)

Chowse:  Can you please attach the CSS3 icon to this bug in case Craig or Luke don't have them.

Thanks!

Comment 1

[Craig Cook (:craigcook)]

The CSS 3 icon and header icons are there, but you may need to shift-refresh to force them to load. You might be seeing cached sprites. What I can't figure out is why the <strong></strong> is appearing in the popup when it wasn't previously... I may have encoded something wrong.

For the descriptions, if we can't edit then I thought at least breaking it into two paragraphs with a main subhead and a longer page intro would help it scan better, but I don't care for the center alignment on the second paragraph.

Comment 2

[Luke Crouch [:groovecoder]]

> 3. Intermediate and Advanced blocks have inconsistent icons
> 
> 3. Use the book icon for Intermediate and the grad hat icon for Advanced
> (blocks = introduction/beginner and the bulb = examples/demos)

Jay, I see Beginner:blocks, Advanced:cap, Intermediate:book consistently across HTML, CSS, and JavaScript pages. Note: HTML & CSS have no "Intermediate" section - only Beginner and Advanced.

Comment 3

[Jay Patel [:jay]]

Sorry, a hard refresh cleared up the icons for CSS3 and the content block icons.  Those look fine.

We are still working out some rearranging of copy, which will potentially create 3 blocks for intro, intermediate and advanced.  So will let Janet and Craig work through those changes.

Craig: For the CSS popup, if you can get rid of the first "even more" before style and flexibility, that'll be great.  I used it twice in that sentence... so want to get rid of one of them.  Thanks.

Comment 4

[Jay Patel [:jay]]

(In reply to comment #1)
> 
> For the descriptions, if we can't edit then I thought at least breaking it into
> two paragraphs with a main subhead and a longer page intro would help it scan
> better, but I don't care for the center alignment on the second paragraph.

let's just make the second paragraph span the entire width of the page just above the content blocks.

Comment 5

[Luke Crouch [:groovecoder]]

Craig, do you want to work on this or should I?

Comment 6

[Craig Cook (:craigcook)]

(In reply to comment #5)
> Craig, do you want to work on this or should I?

I'm already on it.

Though I don't know why the <strong> is appearing in the popups and why the &gt; and &lt; aren't rendering (under HTML Challenges on the Learn HTML page.) All I've done is edit the plain text source code. Is there another process the pages need to run through to parse/encode them?

Comment 7

[Luke Crouch [:groovecoder]]

Attachment: Jan's email of changes

Comment 8

[raymond [:retornam] (inactive)]

qa-verified-stage https://developer-stage9.mozilla.org/en-US/learn

Comment 9

[raymond [:retornam] (inactive)]

verified fixed https://developer.mozilla.org/en-US/learn