Merge pull request #1729 from UziTech/quick-ref

docs/demo/quickref.md

@@ -1,33 +1,34 @@
 Markdown Quick Reference
 ========================
 
-This guide is a very brief overview, with examples, of the syntax that [Markdown] supports.  It is itself written in Markdown and you can copy the samples over to the left-hand pane for experimentation.  It's shown as *text* and not *rendered HTML*.
+This guide is a very brief overview, with examples, of the syntax that [Markdown] supports. It is itself written in Markdown and you can copy the samples over to the left-hand pane for experimentation. It's shown as *text* and not *rendered HTML*.
 
 [Markdown]: http://daringfireball.net/projects/markdown/
 
 
 Simple Text Formatting
 ======================
 
-First thing is first.  You can use *stars* or _underscores_ for italics.  **Double stars** and __double underscores__ do bold.  ***Three together*** do ___both___.
+First thing is first. You can use *stars* or _underscores_ for italics. **Double stars** and __double underscores__ for bold. ***Three together*** for ___both___.
 
-Paragraphs are pretty easy too.  Just have a blank line between chunks of text.
+Paragraphs are pretty easy too. Just have a blank line between chunks of text.
 
-> This chunk of text is in a block quote.  Its multiple lines will all be
-> indended a bit from the rest of the text.
+> This chunk of text is in a block quote. Its multiple lines will all be
+> indented a bit from the rest of the text.
 >
 > > Multiple levels of block quotes also work.
 
-Sometimes you want to include some code, such as when you are explaining how `<h1>` HTML tags work, or maybe you are a programmer and you are discussing `someMethod()`.
+Sometimes you want to include code, such as when you are explaining how `<h1>` HTML tags work, or maybe you are a programmer and you are discussing `someMethod()`.
+
+If you want to include code and have new
+lines preserved, indent the line with a tab
+or at least four spaces:
 
-If you want to include some code and have
-newlines preserved, indent the line with a tab
-or at least four spaces.
     Extra spaces work here too.
-This is also called preformatted text and it is useful for showing examples.
-The text will stay as text, so any *markdown* or <u>HTML</u> you add will
-not show up formatted.  This way you can show markdown examples in a
-markdown document.
+    This is also called preformatted text and it is useful for showing examples.
+    The text will stay as text, so any *markdown* or <u>HTML</u> you add will
+    not show up formatted. This way you can show markdown examples in a
+    markdown document.
 
 >     You can also use preformatted text with your blockquotes
 >     as long as you add at least five spaces.
@@ -36,7 +37,7 @@ markdown document.
 Headings
 ========
 
-There are a couple of ways to make headings.  Using three or more equals signs on a line under a heading makes it into an "h1" style.  Three or more hyphens under a line makes it "h2" (slightly smaller).  You can also use multiple pound symbols before and after a heading.  Pounds after the title are ignored.  Here's some examples:
+There are a couple of ways to make headings. Using three or more equals signs on a line under a heading makes it into an "h1" style. Three or more hyphens under a line makes it "h2" (slightly smaller). You can also use multiple pound symbols (`#`) before and after a heading. Pounds after the title are ignored. Here are some examples:
 
 This is H1
 ==========
@@ -55,20 +56,20 @@ This is H2
 Links
 =====
 
-Let's link to a few sites.  First, let's use the bare URL, like <http://www.github.com>.  Great for text, but ugly for HTML.
-Next is an inline link to [Google](http://www.google.com).  A little nicer.
+Let's link to a few sites. First, let's use the bare URL, like <https://www.github.com>. Great for text, but ugly for HTML.
+Next is an inline link to [Google](https://www.google.com). A little nicer.
 This is a reference-style link to [Wikipedia] [1].
-Lastly, here's a pretty link to [Yahoo].  The reference-style and pretty links both automatically use the links defined below, but they could be defined *anywhere* in the markdown and are removed from the HTML.  The names are also case insensitive, so you can use [YaHoO] and have it link properly.
+Lastly, here's a pretty link to [Yahoo]. The reference-style and pretty links both automatically use the links defined below, but they could be defined *anywhere* in the markdown and are removed from the HTML. The names are also case insensitive, so you can use [YaHoO] and have it link properly.
 
-[1]: http://www.wikipedia.org/
-[Yahoo]: http://www.yahoo.com/
+[1]: https://www.wikipedia.org
+[Yahoo]: https://www.yahoo.com
 
 Title attributes may be added to links by adding text after a link.
-This is the [inline link](http://www.bing.com "Bing") with a "Bing" title.
+This is the [inline link](https://www.bing.com "Bing") with a "Bing" title.
 You can also go to [W3C] [2] and maybe visit a [friend].
 
-[2]: http://w3c.org (The W3C puts out specs for web-based things)
-[Friend]: http://facebook.com/ "Facebook!"
+[2]: https://w3c.org (The W3C puts out specs for web-based things)
+[Friend]: https://facebook.com "Facebook!"
 
 Email addresses in plain text are not linked: test@example.com.
 Email addresses wrapped in angle brackets are linked: <test@example.com>.
@@ -83,12 +84,12 @@ Lists
 - You can also use hyphens
 + Or plus symbols
 
-The above is an "unordered" list.  Now, on for a bit of order.
+The above is an "unordered" list. Now, on for a bit of order.
 
 1. Numbered lists are also easy
 2. Just start with a number
 3738762. However, the actual number doesn't matter when converted to HTML.
-1.  This will still show up as 4.
+1. This will still show up as 4.
 
 You might want a few advanced lists:
 
@@ -100,37 +101,39 @@ You might want a few advanced lists:
 - This nested list also has blank lines between the list items.
 
 - How to create nested lists
-1.  Start your regular list
-2.  Indent nested lists with four spaces
-3.  Further nesting means you should indent with four more spaces
-    * This line is indented with eight spaces.
+  1. Start your regular list
+  2. Indent nested lists with two spaces
+  3. Further nesting means you should indent with two more spaces
+    * This line is indented with four spaces.
 
-- List items can be quite lengthy.  You can keep typing and either continue
+- List items can be quite lengthy. You can keep typing and either continue
 them on the next line with no indentation.
 
 - Alternately, if that looks ugly, you can also
-indent the next line a bit for a prettier look.
+  indent the next line a bit for a prettier look.
+
+- You can put large blocks of text in your list by just indenting with two spaces.
 
-- You can put large blocks of text in your list by just indenting with four spaces.
+  This is formatted the same as code, but you can inspect the HTML
+  and find that it's just wrapped in a `<p>` tag and *won't* be shown
+  as preformatted text.
 
-This is formatted the same as code, but you can inspect the HTML
-and find that it's just wrapped in a `<p>` tag and *won't* be shown
-as preformatted text.
+  You can keep adding more and more paragraphs to a single
+  list item by adding the traditional blank line and then keep
+  on indenting the paragraphs with two spaces.
 
-You can keep adding more and more paragraphs to a single
-list item by adding the traditional blank line and then keep
-on indenting the paragraphs with four spaces.  You really need
-to only indent the first line, but that looks ugly.
+  You really only need to indent the first line,
+but that looks ugly.
 
 - Lists support blockquotes
 
-> Just like this example here.  By the way, you can
-> nest lists inside blockquotes!
-> - Fantastic!
+  > Just like this example here. By the way, you can
+  > nest lists inside blockquotes!
+  > - Fantastic!
 
 - Lists support preformatted text
 
-    You just need to indent eight spaces.
+      You just need to indent an additional four spaces.
 
 
 Even More
@@ -139,29 +142,30 @@ Even More
 Horizontal Rule
 ---------------
 
-If you need a horizontal rule you just need to put at least three hyphens, asterisks, or underscores on a line by themselves.  You can also even put spaces between the characters.
+If you need a horizontal rule you just need to put at least three hyphens, asterisks, or underscores on a line by themselves. You can also even put spaces between the characters.
 
 ---
 ****************************
 _ _ _ _ _ _ _
 
-Those three all produced horizontal lines.  Keep in mind that three hyphens under any text turns that text into a heading, so add a blank like if you use hyphens.
+Those three all produced horizontal lines. Keep in mind that three hyphens under any text turns that text into a heading, so add a blank like if you use hyphens.
 
 Images
 ------
 
-Images work exactly like links, but they have exclamation points in front.  They work with references and titles too.
+Images work exactly like links, but they have exclamation points in front. They work with references and titles too.
 
-![Google Logo](http://www.google.com/images/errors/logo_sm.gif) and ![Happy].
+![Google Logo](https://www.google.com/images/errors/logo_sm.gif) and ![Happy].
 
-[Happy]: http://www.wpclipart.com/smiley/simple_smiley/smiley_face_simple_green_small.png ("Smiley face")
+[Happy]: https://wpclipart.com/smiley/happy/simple_colors/smiley_face_simple_green_small.png ("Smiley face")
 
 
 Inline HTML
 -----------
 
-If markdown is too limiting, you can just insert your own <strike>crazy</strike> HTML.  Span-level HTML <u>can *still* use markdown</u>.  Block level elements must be separated from text by a blank line and must not have any spaces before the opening and closing HTML.
+If markdown is too limiting, you can just insert your own <strike>crazy</strike> HTML. Span-level HTML <u>can *still* use markdown</u>. Block level elements must be separated from text by a blank line and must not have any spaces before the opening and closing HTML.
 
-<div style='font-family: "Comic Sans", sans-serif;'>
-It is a pity, but markdown does **not** work in here for most markdown parsers.  [Marked] handles it pretty well.
+<div style='font-family: "Comic Sans MS", "Comic Sans", cursive;'>
+It is a pity, but markdown does **not** work in here for most markdown parsers.
+[Marked] handles it pretty well.
 </div>