markdown-ui 0.1.14 → 0.1.15

Sign up to get free protection for your applications and to get access to all the features.
Files changed (67) hide show
  1. checksums.yaml +4 -4
  2. data/Changelog +8 -1
  3. data/Gemfile +28 -10
  4. data/TODO.md +1 -1
  5. data/components/collections/markdown-ui-grid/Gemfile +1 -1
  6. data/components/collections/markdown-ui-grid/markdown-ui-grid.gemspec +15 -15
  7. data/components/collections/markdown-ui-menu/Gemfile +1 -1
  8. data/components/collections/markdown-ui-menu/lib/menu/custom.rb +0 -1
  9. data/components/collections/markdown-ui-menu/markdown-ui-menu.gemspec +15 -15
  10. data/components/collections/markdown-ui-message/Gemfile +1 -1
  11. data/components/collections/markdown-ui-message/lib/message/custom_message.rb +0 -1
  12. data/components/collections/markdown-ui-message/markdown-ui-message.gemspec +15 -15
  13. data/components/elements/markdown-ui-button/Gemfile +1 -1
  14. data/components/elements/markdown-ui-button/lib/button/animated.rb +2 -2
  15. data/components/elements/markdown-ui-button/lib/button/custom.rb +0 -1
  16. data/components/elements/markdown-ui-button/lib/button/element.rb +19 -15
  17. data/components/elements/markdown-ui-button/lib/button/group/buttons/element.rb +1 -1
  18. data/components/elements/markdown-ui-button/markdown-ui-button.gemspec +15 -15
  19. data/components/elements/markdown-ui-container/Gemfile +1 -1
  20. data/components/elements/markdown-ui-container/lib/container/element.rb +1 -1
  21. data/components/elements/markdown-ui-container/markdown-ui-container.gemspec +15 -15
  22. data/components/elements/markdown-ui-content/Gemfile +1 -1
  23. data/components/elements/markdown-ui-content/lib/content/divider_block.rb +1 -1
  24. data/components/elements/markdown-ui-content/lib/content/field_block.rb +1 -1
  25. data/components/elements/markdown-ui-content/lib/content/form_block.rb +1 -1
  26. data/components/elements/markdown-ui-content/lib/content/header.rb +1 -1
  27. data/components/elements/markdown-ui-content/lib/content/icon.rb +2 -2
  28. data/components/elements/markdown-ui-content/lib/content/input_block.rb +1 -1
  29. data/components/elements/markdown-ui-content/lib/content/item.rb +1 -1
  30. data/components/elements/markdown-ui-content/lib/content/item_block.rb +1 -1
  31. data/components/elements/markdown-ui-content/lib/content/list.rb +1 -1
  32. data/components/elements/markdown-ui-content/lib/content/parser.rb +31 -23
  33. data/components/elements/markdown-ui-content/markdown-ui-content.gemspec +15 -15
  34. data/components/elements/markdown-ui-header/Gemfile +1 -1
  35. data/components/elements/markdown-ui-header/lib/header/header.rb +5 -5
  36. data/components/elements/markdown-ui-header/markdown-ui-header.gemspec +15 -15
  37. data/components/elements/markdown-ui-input/Gemfile +1 -1
  38. data/components/elements/markdown-ui-input/lib/input/custom.rb +0 -1
  39. data/components/elements/markdown-ui-input/markdown-ui-input.gemspec +15 -15
  40. data/components/elements/markdown-ui-label/Gemfile +1 -1
  41. data/components/elements/markdown-ui-label/lib/label/custom.rb +0 -1
  42. data/components/elements/markdown-ui-label/markdown-ui-label.gemspec +15 -15
  43. data/components/elements/markdown-ui-segment/Gemfile +1 -1
  44. data/components/elements/markdown-ui-segment/lib/segment/segment.rb +17 -13
  45. data/components/elements/markdown-ui-segment/markdown-ui-segment.gemspec +15 -15
  46. data/exe/markdown-ui +11 -11
  47. data/exe/markdown-ui-shell +31 -0
  48. data/lib/markdown-ui.rb +47 -43
  49. data/lib/markdown-ui/tag/button_tag.rb +2 -2
  50. data/lib/markdown-ui/tag/focusable_button_tag.rb +3 -3
  51. data/lib/markdown-ui/tag/input_tag.rb +3 -3
  52. data/lib/markdown-ui/tag/item_tag.rb +2 -2
  53. data/lib/markdown-ui/tag/label_tag.rb +2 -2
  54. data/lib/markdown-ui/tag/list_tag.rb +2 -2
  55. data/lib/markdown-ui/tag/span_tag.rb +1 -1
  56. data/lib/markdown-ui/tag/standard_tag.rb +2 -2
  57. data/lib/markdown-ui/utils/klass_util.rb +1 -1
  58. data/lib/markdown-ui/version.rb +1 -1
  59. data/markdown-ui.gemspec +2 -1
  60. data/website/about.html +8 -8
  61. data/website/docs/button.html +8 -8
  62. data/website/docs/container.html +26 -23
  63. data/website/docs/divider.html +8 -8
  64. data/website/docs/toc.html +8 -8
  65. data/website/index.html +42 -27
  66. data/website/index.md +38 -20
  67. metadata +19 -3
data/website/docs/container.html CHANGED
@@ -1,17 +1,17 @@
1
1
  <!doctype html>
2
2
 
3
- <html lang="en">
3
+ <html lang='en'>
4
4
  <head>
5
- <meta charset="utf-8">
6
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
5
+ <meta charset='utf-8'>
6
+ <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
7
+ <meta name='viewport' content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1'>
8
8
 
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.css">
10
- <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
11
- <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.js"></script>
9
+ <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.css'>
10
+ <script src='https://code.jquery.com/jquery-2.1.4.min.js'></script>
11
+ <script src='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.js'></script>
12
12
 
13
13
  <!--[if lt IE 9]>
14
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
14
+ <script src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script>
15
15
  <![endif]-->
16
16
  </head>
17
17
 
@@ -42,10 +42,10 @@
42
42
  <p>A standard container</p>
43
43
  </div>
44
44
  </div>
45
- <div class="ui divider"></div><div class="ui container">
45
+ <div class='ui divider'></div><div class="ui container">
46
46
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.</p>
47
47
  </div>
48
- <div class="ui divider"></div>
48
+ <div class='ui divider'></div>
49
49
  <!-- -->
50
50
  <div class="ui container">
51
51
  <div class="ui grid">
@@ -64,11 +64,11 @@
64
64
  <p>A container can reduce its maximum width to more naturally accomodate a single column of text</p>
65
65
  </div>
66
66
  </div>
67
- <div class="ui divider"></div><div class="ui text container">
67
+ <div class='ui divider'></div><div class="ui text container">
68
68
  <h1 class="ui header">Header</h1>
69
69
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.</p>
70
70
  </div>
71
- <div class="ui divider"></div>
71
+ <div class='ui divider'></div>
72
72
  <!-- -->
73
73
  <div class="ui container">
74
74
  <div class="ui grid">
@@ -93,7 +93,7 @@
93
93
  <p>A container can specify its text alignment</p>
94
94
  </div>
95
95
  </div>
96
- <div class="ui divider"></div>
96
+ <div class='ui divider'></div>
97
97
  <!-- -->
98
98
  <div class="ui left aligned container">
99
99
  <p>Left Aligned</p>
@@ -114,7 +114,7 @@
114
114
  <h4 id="justified-aligned" class="ui header">Justified Aligned</h4>
115
115
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.</p>
116
116
  </div>
117
- <div class="ui divider"></div>
117
+ <div class='ui divider'></div>
118
118
  <!-- -->
119
119
  <div class="ui container">
120
120
  <div class="ui grid">
@@ -163,12 +163,12 @@
163
163
  <p>A fluid container has no maximum width</p>
164
164
  </div>
165
165
  </div>
166
- <div class="ui divider"></div>
166
+ <div class='ui divider'></div>
167
167
  <!-- -->
168
168
  <div class="ui fluid container">
169
169
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.</p>
170
170
  </div>
171
- <div class="ui divider"></div>
171
+ <div class='ui divider'></div>
172
172
  <!-- -->
173
173
  <div class="ui container">
174
174
  <div class="ui grid">
@@ -191,7 +191,7 @@
191
191
  <p>A container can be combined with a grid allowing you to use all of the layout and alignment available for grids including responsive patterns.</p>
192
192
  </div>
193
193
  </div>
194
- <div class="ui divider"></div>
194
+ <div class='ui divider'></div>
195
195
  <!-- -->
196
196
  <div class="ui four column doubling grid container">
197
197
  <div class="ui column">
@@ -214,7 +214,7 @@
214
214
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa strong.</p>
215
215
  </div>
216
216
  </div>
217
- <div class="ui divider"></div>
217
+ <div class='ui divider'></div>
218
218
  <!-- -->
219
219
  <div class="ui container">
220
220
  <div class="ui grid">
@@ -267,7 +267,7 @@
267
267
  <p>A container can be used inside of a menu to make sure menu items appear inline with page contents. Using responsive variations like stackable menu can help make contents adjust to different device sizes.</p>
268
268
  </div>
269
269
  </div>
270
- <div class="ui divider"></div>
270
+ <div class='ui divider'></div>
271
271
  <!-- -->
272
272
  <div class="ui attached stackable menu">
273
273
  <div class="ui container">
@@ -275,7 +275,10 @@
275
275
  <a class="ui item"><i class="grid layout icon"></i> Browse</a>
276
276
  <a class="ui item"><i class="mail icon"></i> Messages</a>
277
277
  <!-- -->
278
- <div class="ui simple dropdown item">More <i class="dropdown icon"></i> <!-- --> <div class="ui menu"><a class="ui item"><i class="edit icon"></i> Edit Profile</a><a class="ui item"><i class="globe icon"></i> Choose Language</a><a class="ui item"><i class="settings icon"></i> Account Settings</a></div></div>
278
+ <div class="ui simple dropdown item">More
279
+ <i class="dropdown icon"></i>
280
+ <!-- -->
281
+ <div class="ui menu"><a class="ui item"><i class="edit icon"></i> Edit Profile</a><a class="ui item"><i class="globe icon"></i> Choose Language</a><a class="ui item"><i class="settings icon"></i> Account Settings</a></div></div>
279
282
  <!-- -->
280
283
  <div class="ui right item">
281
284
  <div class="ui input">
@@ -284,7 +287,7 @@
284
287
  </div>
285
288
  </div>
286
289
  </div>
287
- <div class="ui divider"></div>
290
+ <div class='ui divider'></div>
288
291
  <!-- -->
289
292
  <div class="ui container">
290
293
  <div class="ui grid">
@@ -340,13 +343,13 @@
340
343
  <p>A container can be used with a segment</p>
341
344
  </div>
342
345
  </div>
343
- <div class="ui divider"></div>
346
+ <div class='ui divider'></div>
344
347
  <!-- -->
345
348
  <div class="ui raised very padded text container segment">
346
349
  <h2 class="ui header">Header</h2>
347
350
  <p>Lorem Ipsum Dolor</p>
348
351
  </div>
349
- <div class="ui divider"></div>
352
+ <div class='ui divider'></div>
350
353
  <!-- -->
351
354
  <div class="ui container">
352
355
  <div class="ui grid">
data/website/docs/divider.html CHANGED
@@ -1,17 +1,17 @@
1
1
  <!doctype html>
2
2
 
3
- <html lang="en">
3
+ <html lang='en'>
4
4
  <head>
5
- <meta charset="utf-8">
6
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
5
+ <meta charset='utf-8'>
6
+ <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
7
+ <meta name='viewport' content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1'>
8
8
 
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.css">
10
- <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
11
- <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.js"></script>
9
+ <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.css'>
10
+ <script src='https://code.jquery.com/jquery-2.1.4.min.js'></script>
11
+ <script src='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.js'></script>
12
12
 
13
13
  <!--[if lt IE 9]>
14
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
14
+ <script src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script>
15
15
  <![endif]-->
16
16
  </head>
17
17
 
data/website/docs/toc.html CHANGED
@@ -1,17 +1,17 @@
1
1
  <!doctype html>
2
2
 
3
- <html lang="en">
3
+ <html lang='en'>
4
4
  <head>
5
- <meta charset="utf-8">
6
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
5
+ <meta charset='utf-8'>
6
+ <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
7
+ <meta name='viewport' content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1'>
8
8
 
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.css">
10
- <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
11
- <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.js"></script>
9
+ <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.css'>
10
+ <script src='https://code.jquery.com/jquery-2.1.4.min.js'></script>
11
+ <script src='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.js'></script>
12
12
 
13
13
  <!--[if lt IE 9]>
14
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
14
+ <script src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script>
15
15
  <![endif]-->
16
16
  </head>
17
17
 
data/website/index.html CHANGED
@@ -1,17 +1,17 @@
1
1
  <!doctype html>
2
2
 
3
- <html lang="en">
3
+ <html lang='en'>
4
4
  <head>
5
- <meta charset="utf-8">
6
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
5
+ <meta charset='utf-8'>
6
+ <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
7
+ <meta name='viewport' content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1'>
8
8
 
9
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.css">
10
- <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
11
- <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.4/semantic.min.js"></script>
9
+ <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.css'>
10
+ <script src='https://code.jquery.com/jquery-2.1.4.min.js'></script>
11
+ <script src='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.5/semantic.min.js'></script>
12
12
 
13
13
  <!--[if lt IE 9]>
14
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
14
+ <script src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script>
15
15
  <![endif]-->
16
16
  </head>
17
17
 
@@ -29,7 +29,7 @@
29
29
  </div>
30
30
  </div>
31
31
  <!-- -->
32
- <div class="ui inverted attached orange very padded segment">
32
+ <div class="ui inverted attached basic blue very padded segment">
33
33
  <h1 class="ui header">Markdown UI</h1>
34
34
  <h3 class="ui header">Responsive UI in Markdown</h3>
35
35
  <a class="ui item" href="docs/toc.html">
@@ -39,9 +39,16 @@
39
39
  <!-- -->
40
40
  <div class="ui basic attached segment">
41
41
  <div class="ui equal width grid">
42
- <div class="ui column"><h2 id="install" class="ui header">Installation</h2><code>gem install markdown-ui</code><h2 id="usage" class="ui header">Usage</h2><code>markdown-ui index.mdui &gt; index.html</code><h2 id="credits" class="ui header">Credits</h2>
43
- Markdown-UI uses <a class="ui item" href="http://www.semantic-ui.com">Semantic-UI http://www.semantic-ui.com</a>
44
- syntax and framework, and ruby <code>redcarpet</code> library.Credit goes to the people behind these wonderful framework and libraries.<h2 class="ui header">Source</h2>
42
+ <div class="ui column"><h2 id="install" class="ui header">Installation</h2>
43
+ Markdown-UI is readily available as a Ruby gem. The minimum required Ruby version is 2.0. <br /> <br />
44
+ <code>gem install markdown-ui</code><h2 id="usage" class="ui header">Usage</h2>
45
+ Output is via standard out, which can be piped to create an HTML file. (Under Mac and Linux) <br /> <br />
46
+ <code>markdown-ui index.mdui &gt; index.html</code><h2 class="ui header">Markdown-UI (Read-Evaluate-Print-Loop) REPL shell</h2>
47
+ You can interactively create Markdown-UI websites using the <code>markdown-ui-shell</code>.<div class="ui message"><code>$ markdown-ui-shell</code><br /><code></code><br /><code>Hit RETURN three times to parse.</code><br /><code># __Button|A Button__</code><br /><code>#</code><br /><code>#</code><br /><code></code><br /><code>&lt;button class="ui button"&gt;A Button&lt;/button&gt;</code><br /><code></code><br /><code>#</code></div>
48
+ <h2 id="credits" class="ui header">Credits</h2>
49
+ Markdown-UI would not be possible without the the <a class="ui item" href="http://www.semantic-ui.com">Semantic-UI</a>
50
+ framework, and the Ruby <a class="ui item" href="https://github.com/vmg/redcarpet">RedCarpet</a>
51
+ library. A huge thanks and credit goes to the people behind these wonderful framework and libraries.<h2 class="ui header">Source</h2>
45
52
  This document is written entirely in Markdown-UI. see: <a class="ui item" href="https://github.com/jjuliano/markdown-ui/tree/master/website">the source files</a>
46
53
  <h2 id="issues-bugs" class="ui header">Notes/Issues/Bugs</h2>
47
54
  <ul class="ui unordered list"><li>Ongoing support for Semantic-UI elements/modules/components</li><li>The Colon (:) character will be parsed when used inside a text, needs post-processing to dislay correctly (for URLs)</li><li>A separator in between two spaces is required on block elements to separate elements (see Column example)</li><li>Some elements requires custom javascripts (ie toggle button) in order to display and format them properly. Those elements will not be supported by Markdown-UI.</li></ul></div>
@@ -72,13 +79,13 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
72
79
  <div class="ui column">
73
80
  <div class="ui basic segment">
74
81
  <h5 class="ui header">Button</h5>
75
- <div class="ui info message">
82
+ <div class="ui inverted blue segment">
76
83
  <code># Short-Hand</code>
77
84
  <br />
78
85
  <code>__Button|Button Text__</code>
79
86
  </div>
80
87
  <!-- -->
81
- <div class="ui info message">
88
+ <div class="ui inverted blue segment">
82
89
  <code># Block Syntax</code>
83
90
  <br />
84
91
  <code>&gt; Button:</code>
@@ -88,7 +95,7 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
88
95
  </div>
89
96
  <!-- -->
90
97
  <h5 class="ui header">Container</h5>
91
- <div class="ui info message">
98
+ <div class="ui inverted blue segment">
92
99
  <code>&gt; Container:</code>
93
100
  <br />
94
101
  <code>&gt;</code>
@@ -96,13 +103,13 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
96
103
  </div>
97
104
  <!-- -->
98
105
  <h5 class="ui header">Icon</h5>
99
- <div class="ui info message">
106
+ <div class="ui inverted blue segment">
100
107
  <code>_Icon &lt;Name&gt;_</code>
101
108
  <br />
102
109
  </div>
103
110
  <!-- -->
104
111
  <h5 class="ui header">Segment</h5>
105
- <div class="ui info message">
112
+ <div class="ui inverted blue segment">
106
113
  <code>&gt; Segment:</code>
107
114
  <br />
108
115
  <code>&gt;</code>
@@ -110,23 +117,31 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
110
117
  </div>
111
118
  <!-- -->
112
119
  <h5 class="ui header">Menu</h5>
113
- <div class="ui info message">
120
+ <div class="ui inverted blue segment">
114
121
  <code>&gt; Menu:</code>
115
122
  <br />
116
- <code>&gt; [Menu Item]</code>
123
+ <code>&gt; [Menu Item]()</code>
117
124
  <br />
118
125
  </div>
119
126
  <!-- -->
120
127
  <h5 class="ui header">List</h5>
121
- <div class="ui info message">
128
+ <div class="ui inverted blue segment">
129
+ <code># Unordered List</code>
130
+ <br />
122
131
  <code>* List 1</code>
123
132
  <br />
124
133
  <code>* List 2</code>
125
134
  <br />
135
+ <code># Ordered List</code>
136
+ <br />
137
+ <code>1. List 1</code>
138
+ <br />
139
+ <code>1. List 2</code>
140
+ <br />
126
141
  </div>
127
142
  <!-- -->
128
143
  <h5 class="ui header">Label</h5>
129
- <div class="ui info message">
144
+ <div class="ui inverted blue segment">
130
145
  <code>&gt; Label:</code>
131
146
  <br />
132
147
  <code>&gt; _Mail Icon_ 23</code>
@@ -138,20 +153,20 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
138
153
  <div class="ui column">
139
154
  <div class="ui basic segment">
140
155
  <h5 class="ui header">Item</h5>
141
- <div class="ui info message">
156
+ <div class="ui inverted blue segment">
142
157
  <code>[Item](#URL_ID "class")</code>
143
158
  <br />
144
159
  </div>
145
160
  <!-- -->
146
161
  <h5 class="ui header">Message</h5>
147
- <div class="ui info message">
162
+ <div class="ui inverted blue segment">
148
163
  <code># Short-Hand</code>
149
164
  <br />
150
165
  <code>__Message|Header:Message Header,Text:Message Text__</code>
151
166
  <br />
152
167
  </div>
153
168
  <!-- -->
154
- <div class="ui info message">
169
+ <div class="ui inverted blue segment">
155
170
  <code># Block Syntax</code>
156
171
  <br />
157
172
  <code>&gt; Message:</code>
@@ -163,12 +178,12 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
163
178
  </div>
164
179
  <!-- -->
165
180
  <h5 class="ui header">Header</h5>
166
- <div class="ui info message">
181
+ <div class="ui inverted blue segment">
167
182
  <code># H1, ## H2, ### H3, #### H4 ...</code>
168
183
  <br />
169
184
  </div>
170
185
  <!-- -->
171
- <div class="ui info message">
186
+ <div class="ui inverted blue segment">
172
187
  <code># DIV tag header</code>
173
188
  <br />
174
189
  <code>__Header|A Div Header__</code>
@@ -176,7 +191,7 @@ This document is written entirely in Markdown-UI. see: <a class="ui item" href="
176
191
  </div>
177
192
  <!-- -->
178
193
  <h5 class="ui header">Column / Grid / Row / Segment / Container</h5>
179
- <div class="ui info message">
194
+ <div class="ui inverted blue segment">
180
195
  <code>&gt; Grid:</code>
181
196
  <br />
182
197
  <code>&gt;</code>
data/website/index.md CHANGED
@@ -9,7 +9,7 @@
9
9
  > > > > [Install](#install)
10
10
  >
11
11
  > <!-- -->
12
- > > Inverted Attached Orange Very Padded Segment:
12
+ > > Inverted Attached Basic Blue Very Padded Segment:
13
13
  > > # Markdown UI
14
14
  > > ### Responsive UI in Markdown
15
15
  > > [__Button|Get Started__](docs/toc.html)
@@ -19,15 +19,29 @@
19
19
  > > > Equal Width Grid:
20
20
  > > > > Column:
21
21
  > > > > ## Installation::install
22
+ > > > > Markdown-UI is readily available as a Ruby gem. The minimum required Ruby version is 2.0. <br /> <br />
22
23
  > > > > ```gem install markdown-ui```
23
24
  > > > >
24
25
  > > > > ## Usage::usage
26
+ > > > > Output is via standard out, which can be piped to create an HTML file. (Under Mac and Linux) <br /> <br />
25
27
  > > > > ```markdown-ui index.mdui > index.html```
26
28
  > > > >
27
- > > > > ## Credits::credits
28
- > > > > Markdown-UI uses [Semantic-UI http：//www.semantic-ui.com](http：//www.semantic-ui.com) syntax and framework, and ruby ```redcarpet``` library.
29
+ > > > > ## Markdown-UI (Read-Evaluate-Print-Loop) REPL shell
30
+ > > > > You can interactively create Markdown-UI websites using the `markdown-ui-shell`.
31
+ > > > > > Message:
32
+ > > > > > ```$ markdown-ui-shell``` <br />
33
+ > > > > > ``` ``` <br />
34
+ > > > > > ```Hit RETURN three times to parse.``` <br />
35
+ > > > > > ```# __Button|A Button__``` <br />
36
+ > > > > > ```# ``` <br />
37
+ > > > > > ```# ``` <br />
38
+ > > > > > ``` ``` <br />
39
+ > > > > > ``` <button class="ui button">A Button</button>``` <br />
40
+ > > > > > ``` ``` <br />
41
+ > > > > > ```# ```
29
42
  > > > >
30
- > > > > Credit goes to the people behind these wonderful framework and libraries.
43
+ > > > > ## Credits::credits
44
+ > > > > Markdown-UI would not be possible without the the [Semantic-UI](http：//www.semantic-ui.com) framework, and the Ruby [RedCarpet](https：//github.com/vmg/redcarpet) library. A huge thanks and credit goes to the people behind these wonderful framework and libraries.
31
45
  > > > >
32
46
  > > > > ## Source
33
47
  > > > > This document is written entirely in Markdown-UI. see： [the source files](https：//github.com/jjuliano/markdown-ui/tree/master/website)
@@ -58,48 +72,52 @@
58
72
  > > > Column:
59
73
  > > > > Basic Segment:
60
74
  > > > > ##### Button
61
- > > > > > Info Message:
75
+ > > > > > Inverted Blue Segment:
62
76
  > > > > > ``` # Short-Hand ``` <br />
63
77
  > > > > > ``` __Button|Button Text__ ```
64
78
  > > > >
65
79
  > > > > <!-- -->
66
- > > > > > Info Message:
80
+ > > > > > Inverted Blue Segment:
67
81
  > > > > > ``` # Block Syntax ``` <br />
68
82
  > > > > > ``` > Button： ``` <br />
69
83
  > > > > > ``` > Button Text ``` <br />
70
84
  > > > >
71
85
  > > > > <!-- -->
72
86
  > > > > ##### Container
73
- > > > > > Info Message:
87
+ > > > > > Inverted Blue Segment:
74
88
  > > > > > ``` > Container： ``` <br />
75
89
  > > > > > ``` > ``` <br />
76
90
  > > > >
77
91
  > > > > <!-- -->
78
92
  > > > > ##### Icon
79
- > > > > > Info Message:
93
+ > > > > > Inverted Blue Segment:
80
94
  > > > > > ``` _Icon <Name>_ ``` <br />
81
95
  > > > >
82
96
  > > > > <!-- -->
83
97
  > > > > ##### Segment
84
- > > > > > Info Message:
98
+ > > > > > Inverted Blue Segment:
85
99
  > > > > > ``` > Segment： ``` <br />
86
100
  > > > > > ``` > ``` <br />
87
101
  > > > >
88
102
  > > > > <!-- -->
89
103
  > > > > ##### Menu
90
- > > > > > Info Message:
104
+ > > > > > Inverted Blue Segment:
91
105
  > > > > > ``` > Menu： ``` <br />
92
- > > > > > ``` > [Menu Item] ``` <br />
106
+ > > > > > ``` > [Menu Item]() ``` <br />
93
107
  > > > >
94
108
  > > > > <!-- -->
95
109
  > > > > ##### List
96
- > > > > > Info Message:
110
+ > > > > > Inverted Blue Segment:
111
+ > > > > > ``` # Unordered List ``` <br />
97
112
  > > > > > ``` * List 1 ``` <br />
98
113
  > > > > > ``` * List 2 ``` <br />
114
+ > > > > > ``` # Ordered List ``` <br />
115
+ > > > > > ``` 1. List 1 ``` <br />
116
+ > > > > > ``` 1. List 2 ``` <br />
99
117
  > > > >
100
118
  > > > > <!-- -->
101
119
  > > > > ##### Label
102
- > > > > > Info Message:
120
+ > > > > > Inverted Blue Segment:
103
121
  > > > > > ``` > Label： ``` <br />
104
122
  > > > > > ``` > _Mail Icon_ 23 ``` <br />
105
123
  > >
@@ -107,17 +125,17 @@
107
125
  > > > Column:
108
126
  > > > > Basic Segment:
109
127
  > > > > ##### Item
110
- > > > > > Info Message:
128
+ > > > > > Inverted Blue Segment:
111
129
  > > > > > ``` [Item](#URL_ID "class") ``` <br />
112
130
  > > > >
113
131
  > > > > <!-- -->
114
132
  > > > > ##### Message
115
- > > > > > Info Message:
133
+ > > > > > Inverted Blue Segment:
116
134
  > > > > > ``` # Short-Hand ``` <br />
117
135
  > > > > > ``` __Message|Header：Message Header,Text：Message Text__ ``` <br />
118
136
  > > > >
119
137
  > > > > <!-- -->
120
- > > > > > Info Message:
138
+ > > > > > Inverted Blue Segment:
121
139
  > > > > > ``` # Block Syntax ``` <br />
122
140
  > > > > > ``` > Message： ``` <br />
123
141
  > > > > > ``` > __Header|Message Header__ ``` <br />
@@ -125,17 +143,17 @@
125
143
  > > > >
126
144
  > > > > <!-- -->
127
145
  > > > > ##### Header
128
- > > > > > Info Message:
146
+ > > > > > Inverted Blue Segment:
129
147
  > > > > > ``` # H1, ## H2, ### H3, #### H4 ... ``` <br />
130
148
  > > > >
131
149
  > > > > <!-- -->
132
- > > > > > Info Message:
150
+ > > > > > Inverted Blue Segment:
133
151
  > > > > > ``` # DIV tag header ``` <br />
134
152
  > > > > > ``` __Header|A Div Header__ ``` <br />
135
153
  > > > >
136
154
  > > > > <!-- -->
137
155
  > > > > ##### Column / Grid / Row / Segment / Container
138
- > > > > > Info Message:
156
+ > > > > > Inverted Blue Segment:
139
157
  > > > > > ``` > Grid：``` <br />
140
158
  > > > > > ``` > ``` <br />
141
159
  > > > > > ``` > <!-- -->``` <br />
@@ -146,4 +164,4 @@
146
164
  > > > > > ``` > <!-- -->``` <br />
147
165
  > > > > > ``` > ``` <br />
148
166
  > > > > > ``` > > Column：``` <br />
149
- > > > > > ``` > > Column 2 ``` <br />
167
+ > > > > > ``` > > Column 2 ``` <br />