diff --git a/docs/common/header.md b/docs/common/header.md index 9145a1a795..61fdcc37bc 100644 --- a/docs/common/header.md +++ b/docs/common/header.md @@ -3,11 +3,15 @@
  • Home
  • Quick Start
    • + +
  • Developing a Site +
  • ◦  Site Configuration
    • +
  • Content Authoring
    • -
  • Developing a Site
    • -
  • Github Pages Deployment
    • -
  • Including Contents
    • -
  • Site Configuration
    • -
  • Preview site on Netlify
    • +
  • ◦  Including Contents
    • + +
  • Deploying a Site
    • +
  • ◦  Github Pages Deployment
    • +
  • ◦  Preview site on Netlify
    •  diff --git a/docs/common/userGuideSections.md b/docs/common/userGuideSections.md index 58b6e259f9..b975f75f86 100644 --- a/docs/common/userGuideSections.md +++ b/docs/common/userGuideSections.md @@ -1,8 +1,9 @@ ## Sections - Quick Start -- Content Authoring - Developing a Site -- Github Pages Deployment -- Including Contents -- Site Configuration -- Preview site on Netlify + - Site Configuration +- Content Authoring + - Including Contents +- Deploying a Site + - Github Pages Deployment + - Preview site on Netlify diff --git a/docs/css/main.css b/docs/css/main.css index 3c13f2f618..8721212a70 100644 --- a/docs/css/main.css +++ b/docs/css/main.css @@ -12,25 +12,3 @@ mark { background-color: yellow; } - -.important { - color: #980000; -} - -.question-wrapper .radio-list, -.question-wrapper .task-list { - list-style: none; - padding-left:0; -} - -.radio-list-input, .task-list-item-checkbox { - margin-right: 10px!important; -} - -.block-embed { - text-align: center; -} - -.closeable-show { - padding: 4px; -} diff --git a/docs/site.json b/docs/site.json index 8c1bf63f1b..2e8a66a096 100644 --- a/docs/site.json +++ b/docs/site.json @@ -13,25 +13,25 @@ "src": "userGuide/userQuickStart.md", "title": "MarkBind: User Guide - Quick Start" }, - { - "src": "userGuide/contentAuthoring.md", - "title": "MarkBind: User Guide - Content Authoring" - }, { "src": "userGuide/developingASite.md", "title": "MarkBind: User Guide - Developing a Site" }, { - "src": "userGuide/ghpagesDeployment.md", - "title": "MarkBind: User Guide - Github Pages Deploment" + "src": "userGuide/siteConfiguration.md", + "title": "MarkBind: User Guide - Site Configuration" + }, + { + "src": "userGuide/contentAuthoring.md", + "title": "MarkBind: User Guide - Content Authoring" }, { "src": "userGuide/includingContents.md", "title": "MarkBind: User Guide - Including Contents" }, { - "src": "userGuide/siteConfiguration.md", - "title": "MarkBind: User Guide - Site Configuration" + "src": "userGuide/ghpagesDeployment.md", + "title": "MarkBind: User Guide - Github Pages Deployment" }, { "src": "userGuide/netlifyPreview.md", diff --git a/docs/userGuide/contentAuthoring.md b/docs/userGuide/contentAuthoring.md index 9d81d472c6..2693575126 100644 --- a/docs/userGuide/contentAuthoring.md +++ b/docs/userGuide/contentAuthoring.md @@ -8,7 +8,7 @@ ### General writing guide #### Mixing HTML with Markdown -*MarkBind* allows you to mix HTML with Markdown content. +*MarkBind* allows you to mix HTML with Markdown content. To separate inline Markdown from HTML elements, enclose inline Markdown content with `` tags. @@ -18,7 +18,7 @@ e.g. # 1: *Markdown* Content ``` -The HTML output will be +The HTML output will be ```
    # 1: Markdown content
    @@ -39,7 +39,7 @@ The HTML output will be:

    1: Markdown content

    -``` +``` In this case, we will get a `h1` header. Example 2: @@ -62,30 +62,30 @@ Use {{showBaseUrl}} for absolute path reference of images and resource files so ### Supported Markdown Syntax MarkBind support the standard Markdown syntax. Read the [guide](https://guides.github.com/features/mastering-markdown/). - + In addition, it supports: - + * [Tables](https://help.github.com/articles/organizing-information-with-tables/) (GFM) * [Strikethrough](https://help.github.com/articles/basic-writing-and-formatting-syntax/#styling-text) (GFM) * [Emoji](https://www.webpagefx.com/tools/emoji-cheat-sheet/) shortcut. - + `:EMOJICODE:`. For example, `:smile:` will be rendered as :smile:. - + * [Task List](https://help.github.com/articles/basic-writing-and-formatting-syntax/#task-lists) * Text Hightlight using `` - + `==Highlight Text==` => `Highlight Text` - + * Text Underline using `` - + `++Underline Text++` => `Underline Text` - + * Dimmed Text (Text with grey background) - + `%%Dimmed Text%%` * Radio Button List - + ``` - ( ) Option 1 - (X) Option 2 (selected) @@ -144,7 +144,7 @@ Note: Replace all instances of `-` with `_` in the glyph's name, e.g. { + ``` To use the searchbar within a navbar, add the following markup to your file. The searchbar can be positioned using the slot attribute for the list. The following markup adds a searchbar to the right side of the navbar with appropriate styling. @@ -160,18 +160,18 @@ To use the searchbar within a navbar, add the following markup to your file. The ### Use Components To use a component, just type the corresponding markup in your file. For example, to create a Panel, you just need to write: - + ``` Panel Content. ``` - -For a list of supported components, refer to the component [doc](https://markbind.github.io/vue-strap/). + +For a list of supported components, refer to [VueStrap modified by MarkBind](https://markbind.github.io/vue-strap/). To make an element closeable, use `v-closeable`. -e.g. +e.g. ``` ``` @@ -181,6 +181,44 @@ or ... ``` + +#### Question body syntax + + + + +- ( ) Yes +- ( ) No + +
    +Probably yes +
    +
    +Yes! +
    +     +     +
    + +```html + + + +- ( ) Yes +- ( ) No + +
    +Probably yes +
    +
    +Yes! +
    +     +     +``` + +Checkboxes can also be used by substituting `- ( )` with `- [ ]`. + ### Include Contents Being able to include different markdown file into the current context is another feature of *MarkBind*. You can create a complex document from different content fragments by including them. diff --git a/docs/userGuide/index.md b/docs/userGuide/index.md index 5208acf73a..954fab1425 100644 --- a/docs/userGuide/index.md +++ b/docs/userGuide/index.md @@ -8,10 +8,9 @@ MarkBind enhances markdown and html documents with extra features that allow you to compose content-extensive website from document fragments at ease. -MarkBind provides many useful markups (customized HTML tags) to help you create complex and interactive components with simple tags such as `` and ``. The reference for all supported customized elements could be found at VueStrap modified by MarkBind. +MarkBind provides many useful markups (customized HTML tags) to help you create complex and interactive components with simple tags such as `` and ``. The reference for all supported customized elements could be found at [VueStrap modified by MarkBind](https://markbind.github.io/vue-strap/). -For users, take a look at the [quick start guide](userQuickStart.html) to start building your website with MarkBind. For contributors, take a look at the [developer guide]({{baseUrl}}/developerGuide.html) to start developing MarkBind project. +Take a look at the [quick start guide](userQuickStart.html) to start building your website with MarkBind. -