Markdown Editor WYSIWYG

PRO

Introduction

test

<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/52377/cloudmark-editor-header.png" height="auto" style="width:100%; max-width:500px; margin:0 auto; display:block;"/>
 
 
# Welcome to CloudMark!
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/52377/cloudmar-tagline.png" style="max-width:350px"/>
 
---- 
 
## 👋 Introductions
 
Hi! I'm Phil. I'm a software engineer, designer, and while I can make cool apps like CloudMark, I often forget how to write markup, and has to look things up a lot—so I figured it would make sense to create an application for others, like me, to help make the process easier. 
 
All suggestions, bugs, or issues—please report them. As I'm a one man-shop, I can only work on this as time permits; but I am dedicated to keeping this application as bug/frustration free as possible *(that's the whole point, right?!)*.
 
---- 
 
## 🎬 Getting Started
To familiarize yourself with the interface, take a look at the top control bar. It has HUMAN options which require no knowledge of Markdown syntax, at all. You can **bold**, *italicize*, ~~strikethrough~~ and do a ton of other cool stuff.
 
The pane you see on the right is your ➡️ Preview Pane. It's what will show up when you import it to your GitHub, BitBucket, Stash, or Mecurial repositories. The one you see on the left contains all the markdown code <stong>⬅️ Markdown Pane. 
 
Also, there are different layouts CloudMark can present to you, depending on your writing style. You can view and edit in Portrait, Landscape, Distraction-Free, and Preview modes.
 
---- 
 
## 🌊 Kitchen Sink
### This section will show you all the different types of formatting you can accomplish with markdown syntax.
```
Note: Not all providers have the same feature subsets for markdown, and some have extended capabilities which CloudMark offers—so refer to their supported syntax if things aren't looking correct!
``` 
 
 
## Headers
___
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6 
 
 
## Horizontal Rules
___ 
Just like that. Putting some text here so things don't look strange 😁.
 
 
## Text Emphasis
___
 
**This is bold text** 
*This is italic text* 
~~Strikethrough~~ 
 
 
## Blockquotes 
___ 
 
> Blockquotes can also be nested...
>> ...by using additional greater-than signs right next to each other...
> > > ...or with spaces between arrows.
 
 
## Lists
___ 
### Unordered 
+ Create a list by starting a line with `+`, `-`, or `*`
+ Sub-lists are made by indenting 2 spaces:
 - Marker character change forces new list start:
 * Ac tristique libero volutpat at
 + Facilisis in pretium nisl aliquet
 - Nulla volutpat aliquam velit
+ Very easy! 
 
#### Example: 
 
```
+ Create a list by starting a line with `+`, `-`, or `*`
+ Sub-lists are made by indenting 2 spaces:
- Marker character change forces new list start:
 * Ac tristique libero volutpat at
 + Facilisis in pretium nisl aliquet
 - Nulla volutpat aliquam velit
+ Very easy! 
```
 
### Ordered
1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa 
 
#### Example: 
 
``` 
1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa
``` 
 
 
## Code Snippets
___ 
Inline `code`
Indented code
 // Some comments
 line 1 of code
 line 2 of code
 line 3 of code
Block code "fences"
```
Sample text here...
```
Syntax highlighting
``` js
let bar = 1; 
const foo = function (bar) { 
	return bar++ 
} 
console.log(foo(5));
```
 
 
## Tables
___ 
| Option | Description |
| ------ | ----------- |
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
 
 
 
## ⭐️ Adknowledgements
___ 
 
This application wouldn't be possible without so many talented developers who have paved the way for popular applications such as Slack, VSCode, Atom to make it to the desktop; being built in traditional web development languages. Huge thanks and grattitude to all the talent and inspiration out there! In no particular order, thank you to CodeMirror, Marked, Electron, and CodePen for all your hard work! You might not believe it—this application was originally built in CodePen, fully functional! 
 
#### So again, thank you from me, and the cloud blobs—who appreciate your support!
 
 
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/52377/cloudmark-blobs.png" style="margin-top:15px" />

test